<audio> 要素にはキャプショントラックが必要です
Start building more accessible experiences
Compliance Data & Impact
Disabilities Affected
- 視聴覚障害
- 聴覚障害
Standard(s)
- WCAG 2.1 (A)
- WCAG 2.0 (A)
- WCAG 2.2 (A)
- Section 508
- EN 301 549
WCAG 達成基準 [WCAG 2.1 (A)]
- 1.2.1: Audio-only and Video-only (Prerecorded)
WCAG 達成基準 [WCAG 2.0 (A)]
- 1.2.1: Audio-only and Video-only (Prerecorded)
WCAG 達成基準 [WCAG 2.2 (A)]
- 1.2.1: Audio-only and Video-only (Prerecorded)
Section 508 ガイドライン
- 1194.22: Web based intranet and Internet Information & Applications
- 1194.22 (a): A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content)
修正方法
kind 要素の track 属性に値「"captions"」が含まれていることを確認します。audio 要素内のすべての意味のある情報、例えば誰が話しているか、対話の書き起こし、音楽の手がかり、効果音などがキャプションのテキストコンテンツによって伝えられることを確認します。
次のコードは、英語とスペイン語の2つの異なるトラックを追加する方法を示しています。
<audio>
<source src="mySpeech.mp3" type="audio/mp3">
<track src="captions_en.vtt" kind="captions" srclang="en" label="english_captions">
<track src="captions_es.vtt" kind="captions" srclang="es" label="spanish_captions">
</audio>注意：
キャプションと字幕は同じものではありません。聴覚障害のある視聴者がコンテンツを理解するには字幕が必要です。キャプションには、すべての会話とナレーションのテキストに加えて、すべての重要な背景ノイズやその他のサウンドのテキスト説明が含まれます。字幕は一般的に言語翻訳であり、聞き手が理解できない言語で提示されたコンテンツを理解できるようにします。たとえば、スペイン語の音声ファイルに英語の字幕を含めることができます。字幕には通常、会話とナレーションのみが含まれます。
これらの違いを考慮すると、聴覚障害者用アクセスを指定する必要があります kind="captions" 、そして指定しないでください kind="subtitles"。
src 属性はトラックファイルの名前を指定します。kind 属性はファイルの内容を説明します。srclang 属性は、適切なHTML言語コードを使用してトラックファイルの言語を指定します。label 属性はトラックの名前を提供します。srcを除くこれらの属性は、いずれも必須ではないです。それでも、強くお勧めします。
なぜ重要なのか
オーディオファイルにキャプションがないと、聴覚障害のあるユーザーは、誰が話しているのか、会話の内容、音楽の合図や効果音など音を通じて伝えられる非音声情報など、オーディオが伝える意味のある情報を知ることができません。キャプションは、オーディオトラックを介して利用可能なコンテンツの一部を提供します。
ビデオでは会話以外にも多くのことが起こります。視覚障害者は映画のセリフを聞き取ることは問題ありませんが、ビデオの重要な視覚的側面を見逃すことになります。ビデオの音声を補足する音声説明を使用することで、視覚的な側面をわかりやすくすることができます。音声解説では、ナレーターは会話に空白がある場合に話し、何が起こっているかを理解するために必要な背景情報を提供します。
HTML5のオーディオ要素 (例: <audio>) には、 <track> 属性を使用してキャプションを指定する必要があります。最も効果的であるためには、キャプションは、会話、音楽のヒント、効果音、その他の関連情報など、オーディオが伝えるすべての意味のある情報を伝える必要があります。
ルールの説明
track 各HTML5 audio 要素には要素が存在し、 kind="captions" がプロパティとして設定される必要があります。キャプションは、聴覚障害のあるユーザーのために、—会話、ナレーション、および重要な聴覚情報の—音声ファイルと同期されたテキストです。
仕組みについて (簡単に言うと)
すべてのHTML5 <audio> 要素の使用をチェックし、各要素が <track> 要素を含み、その要素が kind 属性値 "captions"を持つことを確認します。
リソース
Deque University コースのページ (要登録)
関連するコース情報はありません。
axe 4.10 ルールの一覧 を参照する
この情報は役に立ちましたか?
あなたの回答は次のとおりです。
フィードバックが提出された日付/時刻: