gazou-compressor.jp

キャプション/トランスクリプト

要点:動画や音声のテキスト代替。検索性も向上。 本ページでは、現場での判断軸/実装/検証までをまとめます。

定義

キャプション/トランスクリプトは支援技術でも理解できるようにするためのアクセシビリティの実践です。

なぜ重要か

視覚に依存するUIは情報の欠落を生みます。誰でも同じ目的を達成できる設計にします。

実務での活用(判断基準付き)

  • alt/role/ラベルを適切に。装飾は空alt。
  • コントラスト比フォーカス順を満たす。
  • モーションやデータはユーザー嗜好に合わせる。

実装例

<img src="/chart.png" alt="四半期売上の推移。Q3で前年同月比+18%。" />
<!-- 装飾画像なら alt="" で無視させる -->

検証と失敗例

  • 計測軸: WCAG達成基準・スクリーンリーダーでの読み上げ・キーボード操作の実機確認。
  • 失敗例: alt不整合 / コントラスト不足 / キーボードトラップ
  • 判断軸: 支援技術で完読可能・フォーカス迷子なし・誤読が発生しない。

チェックリスト

  • alt/role/ラベル意味を正しく伝えているか
  • コントラスト比フォーカス順を満たすか
  • モーション/データ量をユーザー嗜好に従い抑制したか
  • スクリーンリーダーで読み上げ/ナビゲーションを実機検証したか

関連用語

alt-text, contrast-ratio-wcag, skip-link

関連記事