<video> 要素にはキャプションが必要です

ルールID: video-caption
ルールセット: axe-core 4.10
ユーザーへの影響:
ガイドライン: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), Section 508, Trusted Tester, EN 301 549

Start building more accessible experiences

Axe DevTools Pro helps dev teams find and fix up to 80% of accessibility issues while coding. No experience required. Get started with your free trial today.

Compliance Data & Impact

User Impact

Disabilities Affected

  • 聴覚障害

Standard(s)

  • WCAG 2.1 (A)
  • WCAG 2.0 (A)
  • WCAG 2.2 (A)
  • Section 508
  • Trusted Tester
  • EN 301 549

WCAG 達成基準 [WCAG 2.1 (A)]

  • 1.2.2: Captions (Prerecorded)

WCAG 達成基準 [WCAG 2.0 (A)]

  • 1.2.2: Captions (Prerecorded)

WCAG 達成基準 [WCAG 2.2 (A)]

  • 1.2.2: Captions (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)

Trusted Tester 指南

  • 17.A: The multimedia provides accurate captions for the audio content.

    修正方法

    すべての video 要素が track 表題属性を持つ要素を使用して表題があることを確認します。video 要素内のすべての意味のある情報を表題が伝えるようにします。これには、会話、音楽のヒント、効果音などが含まれますが、これらに限定されません。

    優れたキャプションには、会話だけでなく、誰が話しているかが示され、意味のある効果音など、音を通じて伝えられる非音声情報も含まれます。

    次のコードは、英語とスペイン語の2つの異なるトラックを追加する方法を示しています。

    <video width="300" height="200">
        <source src="myVideo.mp4" type="video/mp4">
        <track src="captions_en.vtt" kind="captions" srclang="en" label="english_captions">
        <track src="captions_es.vtt" kind="captions" srclang="es" label="spanish_captions">
    </video>

    注意:

    キャプションと字幕は同じものではありません。聴覚障害のある視聴者がコンテンツを理解するには字幕が必要です。キャプションには、すべての会話とナレーションのテキストに加えて、すべての重要な背景ノイズやその他のサウンドのテキスト説明が含まれます。字幕は一般的に言語翻訳であり、聞き手が理解できない言語で提示されたコンテンツを理解できるようにします。たとえば、スペイン語のビデオ ファイルには英語の字幕が含まれている場合があります。字幕には通常、会話とナレーションのみが含まれます。

    これらの違いを考慮すると、聴覚障害者用アクセスを指定する必要があります kind="captions" 、そして指定しないでください kind="subtitles"

    src 属性はトラック ファイルの名前を指定します。kind 属性はファイルの内容を説明します。srclang 属性は、適切なHTML言語コードを使用してトラック ファイルの言語を指定します。label 属性はトラックの名前を提供します。srcを除くこれらの属性は、いずれも必須ではないです。それでも、明瞭度が向上するため、これらは強くお勧めします。

    YouTubeは、自動字幕作成機能をやや実験的な機能として提供しています。自動字幕は、編集しないと不正確になりがちですが、それによりかなりの作業が省けます。YouTubeが提供するもう1つの便利な機能は、トランスクリプトをビデオと自動的に同期する機能です。字幕を入力してYouTubeにアップロードすると、YouTubeは音声認識を使用して動画と字幕を一緒に処理し、字幕を動画と同期します。この機能はほぼ完全に正確です。場合によっては、追加の編集は必要ありません。他の場合は、タイミングを少し微調整する必要がありますが、少なくともすべての作業を手動で行う必要はありません。

    なぜ重要なのか

    動画にキャプションがない場合、聴覚障害のあるユーザーは動画に含まれる情報にアクセスできないか、アクセスが制限されます。字幕トラックが利用できる場合でも、会話だけでなく、ビデオの意味のある情報がすべて含まれていることを確認してください。

    聴覚障害のある視聴者はビデオの内容をすべて見ることができますが、字幕がなければ何も聞こえません。字幕トラックがないと、聴覚障害のある視聴者は、会話やナレーション、または「劇的な器楽」、拍手、叫び声、シーンを設定したり、背景を提供したり、ビデオに意味を与えたりするその他の音など、人が話していない重要な音を知る方法がありません。

    ルールの説明

    HTML5 video 要素には、 track 要素が含まれており、 kind="captions" がプロパティとして設定されている必要があります。キャプションは、会話、音楽のヒント、効果音、聴覚障害のあるユーザーにとってその他の関連情報など、ビデオ内のすべての意味のある聴覚情報を伝える必要があります。

    仕組みについて (簡単に言うと)

    video 要素にキャプションがあることを確認します。

    リソース

    その他のリソース

    その他リソースもあわせてご参照ください。

    axe 4.10 ルールの一覧 を参照する

    この情報は役に立ちましたか?

    すでにフィードバックをいただきました、ありがとうございます。.

    あなたの回答は次のとおりです。

    この情報は役に立ちましたか?
    フィードバックが提出された日付/時刻: