キャプションを提供するために、track 要素を使用する

適用 (対象)

HTML5

これは達成基準 1.2.2: キャプション (収録済) (G87: クローズドキャプションを提供するを満たす方法として十分) に関する達成方法である。

解説

この達成方法の目的は、タイミングを指定したテキストのキャプショントラックを video 要素に指定するために HTML5 track 要素を用いることである。テキストのタイミングのとれたキャプショントラックは、音声が利用できない又は明確に聞こえない場合に適した、会話、効果音、関連する音楽の合図、及びその他の関連する音声情報の転写又は翻訳を含む。

track 要素の src 属性は URL であり、これはテキストトラックデータのアドレスである。

track 要素の kind 属性はタイミングを指定したテキストの情報の種類を指示している。キャプションテキストトラックはダイアログおよび他ビデオを理解するために重要な音声のテキストバージョンを提供している。字幕は発話コンテンツのみを含んでいる。もしほかの音声情報がビデオを理解するために重要なのであれば、字幕トラックは達成基準を満たすために十分ではない。

事例

			  <video poster="myvideo.png" controls>
				 <source src="myvideo.mp4" srclang="en" type="video/mp4">
				 <track src="myvideo_en.vtt" kind="captions" srclang="en" label="English">
			  </video>
            

			  <video poster="myvideo.png" controls>
				<source src="myvideo.mp4" srclang="en" type="video/mp4">
				<source src="myvideo.webm" srclang="fr" type="video/webm">
				<track src="myvideo_en.vtt" kind="captions" srclang="en" label="English">
				<track src="myvideo_fr.ttml" kind="captions" srclang="fr" label="French">
			  </video>            

参考リソース

この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。

• HTML5, the track element
• Timed Text Markup Language
• WebVTT: The Web Video Text Tracks Format
• Captionator Polyfill

関連する達成方法

• G87: クローズドキャプションを提供する

検証