track要素は、音声・動画ファイルの埋め込みに使用するaudio要素やvideo要素などの子要素として使える要素で、外部のテキストトラックを埋め込むことができます。
つまり字幕をつけたりというときに役立ちます。
ちなみにtrack要素には終了タグは必要ありません。
track要素で使える属性
track要素で使える属性には以下のようなものがあります。
- default（デフォルト）
- kind（カインド）
- src（ソース）
- srclang（ソース・ランゲージ）
- label（ラベル）
default（デフォルト）
default属性は、テキストトラックがデフォルトであることを表します。
このdefault属性が指定されたテキストトラックは、1つのaudio要素、video要素内に1つしか使用できません。
kind（カインド）
kind属性では、テキストトラックの種類を指定します。
指定できるテキストトラックの値は以下の通りです。
- subtitles（外国語の字幕）
- captions（音声が利用できない場合のテキストトラック）
- description（動画の内容を説明するテキストトラック）
- chapters（場面ごとのタイトル）
- metadata（クライアントサイドスクリプトから利用する目的のテキストトラック）
初期値は「subtitles」になっているので、何も指定しない場合は映画の字幕などを表す「subtitles」になります。
また、「metadata」は画面に表示されない内容なので、閲覧者には見えません。
src（ソース）
imgタグで使うのと同様、src属性で音声・動画ファイルに埋め込むテキストトラックのURLを指定します。
srclang（ソース・ランゲージ）
track要素はテキストを扱うので、srclang属性で言語を指定することができ、この属性による言語指定は、kind属性の値が「subtitles」の場合は必須となります。
指定できる値はlang属性と同じで、たとえば以下のようなものです。
| 値 | 言語 |
|---|---|
| ja | 日本語 |
| en | 英語 |
| eu-au | オーストラリアにおける英語 |
| de | ドイツ語 |
label（ラベル）
label属性は、ユーザーに表示するコマンドだったりテキストトラックのラベルを指定します。
track要素を1つしか記述できない場合
基本的に、1つのaudio要素、video要素内にtrack要素を複数記述することができるのですが、以下の条件を全て満たしている場合は、1つのtrack要素しか記述することができません。
- 同じaudio要素、video要素を親に持つ2つ以上のtrack要素で指定しているkind属性値が同じ
- label属性が指定されていない、もしくは同じラベルが与えられている
- srclang属性が指定されていない、もしくは同じ言語が指定されている
関連記事
『audio要素で音声ファイルを埋め込む【HTML】』
『video要素で動画ファイルを埋め込む【HTML】』
Leave a Comment