メインコンテンツ
サイトの現在位置
次期Webアクセシビリティ規格「WCAG 2.2」について
WCAG(Web Content Accessibility Guidelines)は、W3C(World Wide Web Consortium)が策定するWebアクセシビリティに関する国際的なガイドラインです。
このページでは「WCAG 2.2」について、デモ画面を用いながら解説します。
Web Accessibility Guidelines

WCAG 2.2 解説ガイド

すべての利用者にとって使いやすいWebを実現するための国際標準ガイドライン。各達成基準をインタラクティブなデモで体験できます。

01WCAG 2.2の概要

W3Cが策定するWebアクセシビリティの国際標準。2023年10月に正式公開された最新バージョンです。

策定団体
W3C
World Wide Web Consortium
公開日
2023年10月
WCAG 2.2 正式勧告
追加された達成基準
9項目
WCAG 2.1比で新規追加
国内JIS規格
改正予定
現行はWCAG 2.0ベース

02WCAGの4つの基本原則

すべての達成基準はこの4原則(POUR)に基づいて整理されています。

👁️
Perceivable

知覚可能

情報やUIコンポーネントは、利用者が知覚できる方法で提供されなければならない。

⌨️
Operable

操作可能

UIコンポーネントやナビゲーションは操作可能でなければならない。

💬
Understandable

理解可能

情報やUIの操作は理解可能でなければならない。

🔩
Robust

堅牢

現在および将来の支援技術を含むさまざまなユーザーエージェントが確実に解釈できること。

03WCAG 2.2で追加された主な達成基準

WCAG 2.1から新たに追加・変更された達成基準の一覧です。特に高齢者・モバイル利用者への配慮が強化されています。

達成基準 レベル 対象原則 概要
2.4.11 フォーカスの外観 AA 操作可能 キーボード操作時のフォーカスを視覚的に明確にする
2.4.12 フォーカスの外観(拡張) AAA 操作可能 より高いコントラスト比でフォーカスを表示する
2.4.13 フォーカスの外観(詳細) AA 操作可能 フォーカスインジケーターの最小面積・コントラスト比を規定
2.5.7 ドラッグ操作の代替 AA 操作可能 ドラッグ以外の方法(クリックやタップ)でも操作可能にする
2.5.8 ターゲットサイズ(最小) AA 操作可能 ボタンやリンクの操作領域を 24×24px 以上確保する
3.2.6 一貫したヘルプ A 理解可能 問い合わせやヘルプへの導線を複数ページで統一した位置に配置
3.3.7 冗長入力の排除 A 理解可能 同一セッション内で既入力の情報を再入力させない
3.3.8 アクセシブルな認証(最小) AA 理解可能 認知テスト(文字認識CAPTCHAなど)を必須とせず代替手段を提供
3.3.9 アクセシブルな認証(拡張) AAA 理解可能 すべての認知テストを排除した認証を提供

042.4.11 フォーカスの外観 AA

キーボードでTabキーを押してフォーカスを移動したとき、現在どこにフォーカスがあるかが視覚的に分かるようにする必要があります。
下記のボタンやリンクをTabキーで移動して、違いを確認してください。

❌ 非準拠:フォーカスが見えない(outline: none)

リンクC

✅ 準拠:フォーカスが明確に表示される

リンクC
💡 ポイント:CSSで outline: noneoutline: 0 を設定すると、キーボード利用者・スクリーンリーダー利用者がどこにフォーカスがあるか判別できなくなります。WCAG 2.2では最小2pxのアウトラインと十分なコントラスト比が求められます。

052.5.7 ドラッグ操作の代替 AA

スライダーや並び替えなど、ドラッグ操作が必要なUIには、クリック・タップや矢印キーなどの代替操作手段を必ず提供する必要があります。上肢障害のある利用者や精密な操作が難しい方への配慮です。

音量調整スライダー — ドラッグ+ボタン代替あり(✅ 準拠)

50%
🔇 0 100 🔊
音量
50%
💡 スライダーは ドラッグ矢印キー+/-ボタン のいずれでも操作でき、現在値を数値・バー・バッジの3箇所で確認できます。単一のドラッグ操作のみに頼らない設計が求められます。

062.5.8 ターゲットサイズ(最小)AA

ボタンやリンクなどのインタラクティブ要素の操作可能領域は 24×24px 以上(推奨:44×44px以上)確保する必要があります。スマートフォン利用者・手の震えのある方への配慮です。

ターゲットサイズの比較

❌ 非準拠:小さすぎるボタン

ボタン高さ: 約22px(24px未満)

✅ 準拠:44×44px以上のボタン

ボタン高さ: 44px以上(推奨値)
💡 WCAG 2.2の要件:最小24×24px(ただし隣接要素との間隔を含む)。モバイルファーストの観点からは Apple / Google ガイドライン準拠の 44px以上が推奨されます。

073.2.6 一貫したヘルプ A

複数のWebページにわたってヘルプへの導線(FAQ・チャット・問い合わせフォームなど)が存在する場合、それらは同一の相対的な順序・位置に配置されなければなりません。迷ったときにいつでも同じ場所でヘルプを見つけられる設計です。

✅ 準拠例:全ページ共通のヘッダー&フッターにヘルプ導線

✓ 位置統一済み
〇〇市 電子申請システム

住民票の写し交付申請フォーム(ページ2/3)

💡 「❓ ヘルプ」リンクと問い合わせ導線がヘッダー・フッターの固定位置に存在します。申請の各ステップで迷ったとき、利用者はいつも同じ場所でサポートにアクセスできます。

083.3.7 冗長入力の排除 A

同一セッション内で、利用者が以前に入力した情報を再入力させてはなりません。自動入力・コピー機能の提供が求められます。特に電子申請や購入フォームなど複数ステップの入力で効果的です。

✅ 準拠例:住所入力の自動転記

ステップ1:請求先住所

ステップ2:配送先住所

✅ 請求先住所を自動入力しました
💡 「請求先と同じ住所を使う」ボタンにより、利用者は同じ情報を再入力する必要がありません。認知負荷の軽減・入力ミス防止にも効果的です。

093.3.8 アクセシブルな認証 AA

認知機能に障害のある利用者のために、ログイン等の認証プロセスで認知テスト(CAPTCHAの文字解読など)を唯一の手段とすることは禁止されています。代替手段が必要です。

認証方式の比較

❌ 非準拠:歪んだ文字CAPTCHAのみ

下の文字を入力してください X9mRk2 ※認知機能障害のある方には判別が困難

✅ 準拠:パスキー / ワンタイムコード

または
メールに送信されたコードを入力:
💡 パスキー・SMSコード・メールリンク・パスワードマネージャー等の代替手段を提供することで、認知機能に関わらず誰でも認証できます。

10JIS規格との関係と今後の展望

国内のWebアクセシビリティ規格「JIS X 8341-3」はWCAGをベースとして策定されています。WCAG 2.2の普及に伴い、JIS改正も見込まれています。

現行規格

JIS X 8341-3:2016

  • WCAG 2.0 ベース
  • 公共機関・自治体サイトで適用
  • 達成基準:25項目
  • 2016年改正・現在適用中
改正予定

JIS X 8341-3(次期)

  • WCAG 2.2 ベース見込み
  • フォーカス・モバイル・認証の基準強化
  • 電子申請システムへの影響大
  • 早期対応で改正後もスムーズに対応可能

自治体・企業サイトへの主な影響

⌨️ キーボード利用者への配慮強化
フォーカス表示の明確化
📱 スマートフォン操作性向上
ターゲットサイズの確保
🧓 高齢者・障害者UX向上
ドラッグ代替・認証改善
📋 電子申請の入力負荷軽減
冗長入力の排除
🔒 アクセシブルな認証実装
パスキー・MFA対応
📐 JIS改正への先行対応
将来コスト削減

本ページはWCAG 2.2(W3C勧告 2023年10月)をもとに作成しています。

詳細は W3C WCAG 2.2公式仕様書 をご参照ください。

本文終わり
掲載内容に関するお問い合わせはこちら
導入検討・デモ
株式会社 コム
住所:403-0007 山梨県富士吉田市中曽根四丁目6番22号
TEL:0555-22-8901
FAX:0555-22-8902