動画や音声をアクセシブルにするには、音だけで伝わる情報を文字でも示し、映像だけで伝わる情報を音声または文章でも伝える必要があります。
字幕ファイルを追加するだけで作業が終わるわけではありません。コンテンツの種類を見分け、必要な代替手段を作り、利用者が選べる形で提供し、公開前に内容と操作を確認するところまでが制作工程です。
- 収録済みかライブかによって、確認する達成基準が異なります。
- キャプションには発話だけでなく、理解に必要な話者名や効果音も含めます。
- 音声解説は、せりふだけでは分からない重要な視覚情報を補います。
- 音声認識や編集ツールの出力は、そのまま公開せず、人が映像と照合します。
制作前に決める三つの条件
最初に、コンテンツの種類を三つの条件で整理します。
- 配信形態：収録済みか、ライブ配信か。
- メディアの組み合わせ：音声のみ、映像のみ、映像と音声の組み合わせのどれか。
- 意味を担う情報：発話、効果音、画面上の文字、人物の動作、図表の変化など、理解に必要な情報がどこに含まれるか。
同じ動画でも、映像が話者の姿だけなら音声解説を追加する必要がない場合があります。
一方、操作手順、画面上の注意書き、図表の変化を映像だけで示しているなら、その視覚情報を別の方法でも伝える設計が必要です。
字幕、文字起こし、音声解説の違い
似た言葉を区別すると、制作物の抜けを見つけやすくなります。
| 用語 | 役割 | 含める情報 |
|---|---|---|
| キャプション | 音声情報を、映像と同期した文字で伝えます。 | 発話、話者の識別、理解に必要な効果音や音楽。 |
| 翻訳字幕 | 発話を別の言語へ訳して伝えます。 | 主に会話。アクセシビリティ用途では、必要な非発話音も扱うかを確認します。 |
| 文字起こし | 音声情報を、時間に縛られず読める文章として提供します。 | 発話、話者、意味のある音。動画では重要な視覚情報を加えた説明付き文字起こしも検討します。 |
| 音声解説 | 主音声だけでは分からない視覚情報を、音声で補います。 | 重要な動作、場面の変化、画面上の文字、図表の要点。 |
地域や制作現場によって「字幕」と「キャプション」の使い方は異なります。
この記事では、同じ言語の発話と必要な非発話音を示すものを「キャプション」、別言語への翻訳を主目的とするものを「翻訳字幕」と呼びます。
WCAG 2.2で確認する達成基準
WCAG 2.2の全体像を踏まえ、時間依存メディアに関係する主な達成基準を整理します。
レベルAAへの適合を評価するときは、レベルAとレベルAAの両方を確認します。
| 達成基準 | レベル | 制作時の確認 |
|---|---|---|
| 1.2.1 音声のみ及び映像のみ | A | 収録済みの音声のみ、または映像のみの内容に、必要な代替手段があるか。 |
| 1.2.2 キャプション | A | 収録済みの同期した映像と音声に、必要なキャプションがあるか。 |
| 1.2.3 音声解説又はメディアに対する代替 | A | 収録済み動画の重要な視覚情報を、音声解説または説明付き文字起こしなどで伝えているか。 |
| 1.2.4 キャプション | AA | ライブの同期メディアに、リアルタイムのキャプションがあるか。 |
| 1.2.5 音声解説 | AA | 収録済み動画の重要な視覚情報を音声で伝えているか。 |
| 1.2.6 手話 | AAA | 収録済み音声に手話通訳を提供する方針か。 |
達成基準1.2.2の対象と実装は、収録済み動画のキャプション要件でも確認できます。
法令、契約、組織の調達基準が求める範囲は案件ごとに異なるため、WCAGの技術要件とは分けて確認します。
公開までの制作手順
素材を棚卸しする
動画と音声の一覧を作り、配信形態、長さ、言語、公開場所、既存の字幕や原稿の有無を記録します。
すべてを同時に直せない場合は、利用頻度が高いもの、手続きや学習に欠かせないもの、問い合わせにつながっているものから着手します。
基準となる原稿を作る
音声を文字に起こし、固有名詞、数字、専門用語を映像と照合します。
話者が変わる場面では話者名を示し、内容の理解に影響する効果音は「ドアが閉まる音」のように具体的に書きます。
音声認識を使った場合も、誤変換、文の切れ目、話者の取り違えを人が確認します。
キャプションを同期させる
一つの表示に情報を詰め込みすぎず、発話の区切りに合わせて読みやすい単位へ分けます。
表示の開始と終了が音声から大きくずれていないか、重要な画面表示を覆っていないかも確認します。
視覚情報を補う
主音声を聞くだけでは理解できない視覚情報を抜き出し、音声解説または説明付き文字起こしへ反映します。
色、服装、背景をすべて読み上げるのではなく、場面の理解や次の操作に必要な情報を優先します。
プレイヤーとページを確認する
字幕の選択、再生、停止、音量調整をキーボードでも操作できるか確認します。
文字起こしを別ページに置く場合は、動画の近くに内容の分かるリンクを設け、同じページに置く場合は見出しで位置を示します。
WebVTTの実装例
WebVTTは、Web上の動画へ時間情報付きテキストを関連付けるための形式です。
キャプション用ファイルは、次のように開始時刻、終了時刻、表示内容を記述します。
WEBVTT
00:00:05.000 --> 00:00:08.500
司会：本日の議題を説明します。
00:00:09.000 --> 00:00:11.500
[通知音]HTMLでは、video要素の中にtrack要素を置きます。
<video controls preload="metadata">
<source src="movie.mp4" type="video/mp4">
<track kind="captions" src="captions-ja.vtt" srclang="ja" label="日本語キャプション" default>
</video>srclangはキャプションの言語、labelは利用者が選択画面で見る名前です。
多言語で提供する場合は言語ごとにtrack要素を追加し、内容と言語コードが一致しているか確認します。
音声解説の提供方法
音声解説の実装方法は、動画の構成とプレイヤーの機能に合わせて選びます。
- 主音声へ組み込む：制作段階から、話者が画面上の要点も説明する構成にします。
- 音声解説版の動画を用意する：通常版とは別に、解説を収録した動画を提供します。
- 別音声トラックを用意する：プレイヤーが切り替えに対応している場合に選びます。
- 時間情報付きの説明テキストを使う：プレイヤーが読み上げや一時停止を適切に扱える場合に選びます。
track kind='descriptions'を記述しただけでは、音声の解説トラックが自動で作られるわけではありません。
採用するプレイヤーでの対応状況を確認し、実際のブラウザー、キーボード、支援技術を使って検証します。
達成基準1.2.5の考え方は、収録済み動画の音声解説要件で詳しく整理しています。
研修動画で考える改善例
画面共有を使う研修動画を例にします。
講師が「この数値が上がっています」とだけ話すと、音声だけでは対象を特定できません。
講師が「四月の問い合わせ件数が前月より増えています」と説明すれば、視覚情報の一部を主音声へ組み込めます。
キャプションには講師の説明を同期して示し、グラフの色や位置だけに頼らず対象を特定します。
画面操作の動画であれば、「右上の保存を選ぶ」だけでなく、ボタン名と操作後の変化も音声または説明文で伝えます。
公開前チェックリスト
- 発話、固有名詞、数字が元の音声と一致している。
- 話者の交代と、理解に必要な効果音がキャプションで分かる。
- キャプションの表示時刻と発話が大きくずれていない。
- キャプションが画面上の重要な文字や操作部品を隠していない。
- 映像だけで伝えている重要情報が、音声解説または文章でも分かる。
- 字幕、音声解説版、文字起こしへの導線を見つけやすい。
- 再生、停止、音量、字幕選択をキーボードで操作できる。
- 複数のブラウザーと端末で、字幕の選択と表示を確認した。
- 実際の利用者による確認で見つかった問題を記録し、修正した。
運用で品質を保つ
新しい動画を公開するたびに個別対応すると、字幕や確認工程が抜けやすくなります。
企画、収録、編集、公開の各工程に担当者と確認項目を置き、動画本体と字幕ファイルを同じ単位で管理します。
公開後に動画を差し替えたときは、字幕、文字起こし、音声解説も同じ内容へ更新します。
管理指標には、対応済み動画の本数だけでなく、未校正の字幕、未対応の視覚情報、利用者から報告された問題と修正状況を含めると、次の作業を決めやすくなります。
制作担当者が持ち帰る要点
動画と音声のアクセシビリティは、「字幕を付けたか」だけでは判断できません。
音声情報にはキャプションや文字起こしを用意し、重要な視覚情報には音声解説や説明付き文字起こしを用意します。
そのうえで、利用者が代替手段を見つけて選択でき、プレイヤーを操作できるかまで確認します。
制作前に必要な代替手段を決め、公開前チェックを工程へ組み込むことが、対応漏れを減らす最短の方法です。
この記事に関連する株式会社greedenの取り組み
動画の字幕や音声解説は、公開後の確認まで含めて初めて利用者に届きます。株式会社greedenは、Webアクセシビリティサービス「UUU」とチェックサービスを通じ、既存サイトの使いやすさを見直す入口を提供しています。