ウェブアクセシビリティハンドブック

本ハンドブックは、ウェブサイトを制作・運用する人が、実務で迷いやすいアクセシビリティの要点を確認できるようにまとめたものです。
WCAG 2.2を中心に、JIS X 8341-3:2016との関係も補足しながら、「概要、実践すべきこと、運用者への注意、開発者への注意」に分けて整理しています。

アクセシビリティの最初の一歩として

ウェブアクセシビリティを向上させるための第一歩として、以下の2点を確認します。

キーボードだけでサイトを操作できるか？

サイト内をタブキーで移動でき、重要なボタンやリンクが選択状態になっていることが分かるかを確認します。

読み上げでも必要な情報が伝わるか？

NVDAやVoiceOverなどのスクリーンリーダーで、コンテンツが自然な順序で読み上げられ、必要な情報が漏れていないかを確認します。

まずはこれらの点を確認し、その後のステップとして「運用時のウェブアクセシビリティの取り組み」や「開発時のウェブアクセシビリティの取り組み」に進みましょう。
また、「達成基準」を意識しながら構築を進めていくことで、より深く学んでいくことができます。

まず取り組みたい5つの確認

はじめに

達成基準（A/AAを中心に、重要なAAAも補足）

1. 知覚可能

  1. テキストによる代替
    1. 非テキストコンテンツ (レベル A)
  2. 時間依存メディア
    1. 音声のみ及び映像のみ (収録済) (レベル A)
    2. キャプション (収録済) (レベル A)
    3. 音声解説、又はメディアに対する代替 (収録済) (レベル A)
    4. キャプション (ライブ) (レベル AA)
    5. 音声解説 (収録済) (レベル AA)
    6. 手話 (収録済) (レベル AAA)
    7. 拡張音声解説 (収録済) (レベル AAA)
    8. メディアに対する代替 (収録済) (レベル AAA)
    9. 音声のみ (ライブ) (レベル AAA)
  3. 適応可能のガイドライン
    1. 情報及び関係性 (レベル A)
    2. 意味のある順序 (レベル A)
    3. 感覚的な特徴 (レベル A)
    4. 表示の向き(レベル AA)
    5. 入力目的の特定(レベル AA)
    6. 1.3.6 目的の特定(レベル AAA)
  4. 判別可能のガイドライン
    1. 色の使用 (レベル A)
    2. 音声の制御 (レベル A)非干渉
    3. コントラスト (最低限) (レベル AA)
    4. テキストのサイズ変更 (レベル AA)
    5. 文字画像 (レベル AA)
    6. コントラスト (高度) (レベル AAA)
    7. 小さな背景音、又は背景音なし (レベル AAA)
    8. 視覚的提示 (レベル AAA)
    9. 文字画像 (例外なし) (レベル AAA)
    10. リフロー (レベル AA)
    11. 非テキストのコントラスト (レベル AA)
    12. テキストの間隔 (レベル AA)
    13. ホバー又はフォーカスで表示されるコンテンツ (レベル AA)

2. 操作可能の原則

  1. キーボード操作可能のガイドライン
    1. キーボード (レベル A)
    2. キーボードトラップなし (レベル A)非干渉
    3. キーボード (例外なし) (レベル AAA)
    4. 文字キーのショートカット (レベル A)
  2. 十分な時間のガイドライン
    1. タイミング調整可能 (レベル A)
    2. 一時停止、停止及び非表示 (レベル A)非干渉
    3. タイミング非依存 (レベル AAA)
    4. 割り込み (レベル AAA)
    5. 再認証 (レベル AAA)
    6. 時間切れ（タイムアウト） (レベル AAA)
  3. 発作や身体的反応を防ぐガイドライン
    1. 3回せん（閃）光、又はしきい（閾）値以下 (レベル A)非干渉
    2. 3回の閃光 (レベル AAA)
    3. インタラクションによるアニメーション (レベル AAA)
  4. ナビゲーション可能のガイドライン
    1. ブロックスキップ (レベル A)
    2. ページタイトル (レベル A)
    3. フォーカス順序 (レベル A)
    4. リンクの目的 (周囲の文脈・コンテキスト内) (レベル A)
    5. 複数の手段 (レベル AA)
    6. 見出し及びラベル (レベル AA)
    7. フォーカスの可視化 (レベル AA)
    8. 現在位置 (レベル AAA)
    9. リンクの目的 (リンクのみ) (レベル AAA)
    10. セクション見出し (レベル AAA)
    11. 隠されないフォーカス (最低限) (レベル AA)
    12. 隠されないフォーカス (高度) (レベル AAA)
    13. フォーカスの外観 (レベル AAA)
  5. 入力方法のガイドライン
    1. ポインタのジェスチャ (レベル A)
    2. ポインタのキャンセル (レベル A)
    3. ラベルを含む名前 (name) (レベル A)
    4. 動きによる起動 (レベル A)
    5. 操作範囲（ターゲット）のサイズ (高度) (レベル AAA)
    6. 入力メカニズムの共存 (レベル AAA)
    7. ドラッグの動き (レベル AA)
    8. 操作範囲（ターゲット）のサイズ (最低限) (レベル AA)

3. 理解可能の原則

  1. 読みやすさのガイドライン
    1. ページの言語 (レベル A)
    2. 一部分の言語 (レベル AA)
    3. 一般的ではない用語（レベルAAA）
    4. 略語の達成基準（レベルAAA）
    5. 読解レベル（レベルAAA）
    6. 発音（レベルAAA）
  2. 予測可能のガイドライン
    1. フォーカス時 (レベル A)
    2. 入力時 (レベル A)
    3. 一貫したナビゲーション (レベル AA)
    4. 一貫した識別性 (レベル AA)
    5. 要求による変化（レベルAAA）
    6. 一貫したヘルプ (レベル A)
  3. 入力支援のガイドライン
    1. エラーの特定 (レベル A)
    2. ラベル又は説明 (レベル A)
    3. エラー修正の提案 (レベル AA)
    4. エラー回避 (法的、金融及びデータ) (レベル AA)
    5. ヘルプ（レベルAAA）
    6. 誤り防止 (すべて)（レベルAAA）
    7. 冗長な入力 (レベル A)
    8. アクセシブルな認証 (最低限) (レベル AA)
    9. アクセシブルな認証 (高度)（レベルAAA）

4. 堅ろう（牢）（Robust）の原則

  1. 互換性のガイドライン
    1. 構文解析 (レベル A) ※WCAG 2.2で削除
    2. 名前（name）、役割（role）及び値（value） (レベル A)
    3. ステータスメッセージ (レベル AA)

アクセシビリティツール

ウェブアクセシビリティ試験

公開・販売・運用のことで困ったら、まずは「ましじめ」へ

ウェブサイトの制作や改善、AI活用、アクセシビリティ、
商品やサービスの見せ方まで、何から手をつければよいか分からない段階でもご相談ください。
自社事業の経験と専門的な技術力を活かし、無理なく続けられる形をご提案します。

お問い合わせはフォームへ