音声・映像コンテンツ

これらのガイドラインは、音声のみのコンテンツ、音声を含む動画コンテンツ、映像のみの動画コンテンツに関するものです。

[MUST]音声・映像コンテンツの存在を明示する

音声・映像コンテンツの存在を認知できるようにする。

意図

視覚障害者、聴覚障害者が音声や映像を含むコンテンツの存在を認知できるようにする。

対応するWCAG 2.1の達成基準

SC 1.1.1：

参考情報

チェック内容

チェックID：1411

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

  • ページ内に埋め込まれる音声/動画プレイヤーについて、適切なラベル付けがされていてそこにプレイヤーがあることが容易に認知できるようになっている。または

  • 前後のテキストから、そこにプレイヤーがあることが推測できる。

[MUST]音声の自動再生

3秒以上の長さの音声を自動再生しない。

意図

スクリーン・リーダーの音声出力を阻害しない。

対応するWCAG 2.1の達成基準

SC 1.4.2：

参考情報

チェック内容

チェックID：1421

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[CRITICAL]

3秒以上の長さの自動再生される音声コンテンツがない。

チェックID：1441

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[CRITICAL]

3秒以上の長さの自動再生される音声コンテンツがない。

[MUST]動きを伴うコンテンツ

自動的に開始し5秒以上継続する、アニメーションや動画のなどの視覚的な動きを伴うコンテンツを作らない。そのようなコンテンツを作る場合は、ユーザーが一時停止、停止、または非表示にすることができるようにする。

意図

ロービジョン者や認知障害者が、集中を阻害されないようにする。

対応するWCAG 2.1の達成基準

SC 2.2.2：

チェック内容

チェックID：1451

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[MAJOR]

  • 自動的に開始し5秒以上続く動画、アニメーションがない。または

  • 動画やアニメーションを呈し、一時停止、または非表示にすることができる。

チェックID：1471

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[MAJOR]

  • 自動的に開始し5秒以上続く動画、アニメーションがない。または

  • 動画やアニメーションを呈し、一時停止、または非表示にすることができる。

[MUST]キーボード・トラップの回避

音声/動画のプレイヤーをページに埋め込む場合、そのコンポーネントにフォーカスした状態から、Tabキー、矢印キー、Escキーなどで抜け出すことができるようにする。

意図

キーボードのみを利用している場合に、ページ中の特定のコンポーネントがページの他の部分へのアクセスを阻害しないようにする。

対応するWCAG 2.1の達成基準

SC 2.1.2：

参考情報

チェック内容

チェックID：0201

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[CRITICAL]

何らかの機能を提供するためにページ中に埋め込まれているコンポーネントにフォーカスがあるとき、簡単な操作で、埋め込まれているものの外の領域にあるリンクなどにフォーカスを移動することができ、自動的にフォーカスが元の位置に戻されない。

例：

  • 動画や音声コンテンツのプレイヤー

  • デート・ピッカーなど、フォーム入力のためにJavaScriptで実装されたコンポーネント

キーボード操作によるチェック実施方法の例

Tab, Shift+Tab, 矢印キー、ESCキーのいずれかの操作で、フォーカスを移動できることを確認する。

iOS VoiceOverによるチェック実施方法の例

1本指による右および左方向へのフリックの後、フリックする前に選択されていたオブジェクトに選択状態が戻らないことを確認する。

参考：1本指による右および左方向へのフリック

Android TalkBackによるチェック実施方法の例

1本指による右および左方向へのフリックの後、フリックする前に選択されていたオブジェクトに選択状態が戻らないことを確認する。

参考：1本指による右および左方向へのフリック

[MUST]テキスト情報と同等の内容にする

テキスト情報の代替情報として音声・映像コンテンツを用い、そのコンテンツがテキスト情報の代替であることを明示する。

意図

音声・映像コンテンツの利用ができないユーザーも支障なくコンテンツを利用できるようにする。

対応するWCAG 2.1の達成基準

SC 1.2.1：
SC 1.2.2：
SC 1.2.3：
SC 1.2.4：

参考情報

チェック内容

チェックID：1481

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[MAJOR]

音声・映像コンテンツは、そのコンテンツがなくても不足なく情報が伝わるような内容で、そのコンテンツがテキスト情報の代替もしくは補助的な位置づけであることが明示されている。

チェックID：1501

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[MAJOR]

音声・映像コンテンツは、そのコンテンツがなくても不足なく情報が伝わるような内容で、そのコンテンツがテキスト情報の代替もしくは補助的な位置づけであることが明示されている。

[MUST]キャプションの提供

テキストの代替情報ではない音声・映像コンテンツにおいて、音声情報には、同期したキャプションを提供する。

ただしライブ配信の場合は[SHOULD]

意図

音声情報を理解できなくてもサービスの利用が困難にならないようにする。

聴覚紹介者が、音声コンテンツおよび動画コンテンツ内の音声を理解できるようにする。

対応するWCAG 2.1の達成基準

SC 1.2.2：
SC 1.2.4：

参考情報

チェック内容

チェックID：1511

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

音声を含むコンテンツには、同期したキャプションが提供されている。

チェックID：1531

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

音声を含むコンテンツには、同期したキャプションが提供されている。

[MUST]書き起こしテキストの提供

テキストの代替情報ではない、映像がなく音声のみの収録済みコンテンツの場合は、書き起こしテキストを提供する。

意図

音声コンテンツを理解できなくてもサービスの利用が困難にならないようにする。

聴覚障害者が音声のみのコンテンツを理解できるようにする。

対応するWCAG 2.1の達成基準

SC 1.2.1：

参考情報

チェック内容

チェックID：1571

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

映像がない音声のみのコンテンツについて、音声を書き起こしたテキストが提供されている。

チェックID：1591

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

映像がない音声のみのコンテンツについて、音声を書き起こしたテキストが提供されている。

[MUST]テキスト情報または音声解説の提供

テキストの代替情報ではない音声・映像コンテンツにおいて、映像がある収録済みコンテンツの場合、映像の内容が分かるような同期した音声情報、またはテキストによる説明を提供する。

意図

映像情報を理解できなくてもサービスの利用が困難にならないようにする。

視覚障害者が、映像コンテンツを理解できるようにする。

対応するWCAG 2.1の達成基準

SC 1.2.3：

参考情報

チェック内容

チェックID：1541

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

  • 動画は、元々収録されている音声トラックの内容から容易に映像を推測できる。または

  • 動画には音声解説が含まれている。または

  • 映像に関するテキストによる説明が提供されている。

チェックID：1561

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

  • 動画は、元々収録されている音声トラックの内容から容易に映像を推測できる。または

  • 動画には音声解説が含まれている。または

  • 映像に関するテキストによる説明が提供されている。

[SHOULD]音声解説の提供

すべての音声・映像コンテンツにおいて、映像がある収録済みコンテンツの場合、映像の内容が分かるような同期した音声情報を提供する。

意図

映像情報を理解できなくてもサービスの利用が困難にならないようにする。

視覚障害者が、映像コンテンツを理解できるようにする。

対応するWCAG 2.1の達成基準

SC 1.2.3：
SC 1.2.5：

参考情報

チェック内容

チェックID：1542

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

  • 動画は、元々収録されている音声トラックの内容から容易に映像を推測できる。または

  • 動画には音声解説が含まれている。

チェックID：1562

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

  • 動画は、元々収録されている音声トラックの内容から容易に映像を推測できる。または

  • 動画には音声解説が含まれている。

[SHOULD]手話の提供

収録済みコンテンツの音声情報には、同期した手話通訳を提供する。

意図

手話を主たる言語として使う聴覚障害者が、音声コンテンツまたは動画コンテンツ中の音声を理解できるようにする。

対応するWCAG 2.1の達成基準

SC 1.2.6：

参考情報

チェック内容

チェックID：1601

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

動画の音声情報には同期した手話通訳が提供されている。

チェックID：1621

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

動画の音声情報には同期した手話通訳が提供されている。

[SHOULD]充分に小さい背景音

映像がなく音声のみの収録済みコンテンツの場合で主たる発話音声があるとき、背景音がない、もしくは主たる発話音声に対して背景音の音量が少なくとも20db小さい状態にする。

意図

音声コンテンツの内容を聞き取りやすいものにする。

対応するWCAG 2.1の達成基準

SC 1.4.7：

参考情報

チェック内容

チェックID：1631

対象

デザイン

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

音声コンテンツについて、充分に聴き取りやすい。

チェックID：1651

対象

プロダクト

対象プラットフォーム

Web、モバイル

重篤度

[NORMAL]

音声コンテンツについて、充分に聴き取りやすい。