最終更新日

track要素

track要素は、video要素audio要素に対し、字幕などによるテキストでの説明情報を追加できるようにします。track要素自身はコンテンツを持たない空要素で、終了タグはありません。

kind属性は、テキスト情報の種類を下表で示すキーワードで指定します。

src属性の指定は必須で、テキストトラックデータのURLを指定します。

srclang属性は、テキストトラックデータの言語を言語タグ名で指定します。kind属性の値がSubtitlesの場合には、srclang属性を指定しなければなりません。

label属性では、トラックのタイトルを指定します。この情報はユーザーにも表示されますが、ブラウザによっても利用されます。label属性を指定する場合、空の文字列は指定不可です。label属性が指定されていない場合、track要素のラベルは、ブラウザ定義による文字列となります。

default属性を指定すると、ユーザーが別のトラックを選択しない限り、そのトラックの利用が有効になります。この場合、同じ親要素内に、default属性が指定されているtrack要素が2つ以上あってはなりません。

1つのメディア要素内に、同じkind属性、同じ言語属性、同じラベル名の値を持つ複数のtrack要素を含めることはできません。

HTML5での変更点
・track要素は、HTML5で追加された新しい要素です。
カテゴリ タグの省略 親要素 子要素
なし 空要素 videoaudio なし
属性 説明
kind subtitles
captions
descriptions
chapters
metadata
テキスト情報の種類について、いずれかのキーワードを指定します。
「subtitles」は、翻訳字幕を表示します。 「captions」は、翻訳字幕に加え、音響効果などを文字で表示します。 「descriptions」は、画面のない環境向けに使用します。動画の視覚的な構成の説明をします。 「chapters」は、各章のタイトルを設定し、章単位での移動を可能にします。 「metadata」は、スクリプトから利用されるものです。ユーザーには表示されません。
src URL テキストトラックデータのURLを指定します。(必須属性
srclang 言語 テキストトラックデータの言語を指定します。
label 文字列 トラックのタイトルを指定します。
default default 論理属性。優先トラックとして設定します。
グローバル属性 - -
イベント属性 - -
サンプルコード
<body>
  <video controls>
    <source src="sample.mp4" type="video/mp4">
    <source src="sample.webm" type="video/webm">
    <track kind="subtitles" src="sample.en.vtt" srclang="en" label="英語">
    <track kind="subtitles" src="sample.ja.vtt" srclang="ja" label="日本語">
  </video>
</body>
参考文献:W3C HTML5「4.8.9 The track element」外部リンク
HOME
当サイトの活動をサポートしてみませんか?気軽にクリエイターの支援ができます。