BLOG

ホームページ制作会社のニュース・ブログ

Keep Going.

ホームページ制作に役立つことから、スタッフの素顔まで。

アクセシビリティガイドラインWCAG2.2について(第1 / 3回) 【概要編】

web業界に勤める方に向けてアクセシビリティ(wcag)について、全3回に渡って解説いたします。

第2回 成功基準の具体例・役割編

第3回 実践編

概要

1. WCAG とは何か

  • WCAG(Web Content Accessibility Guidelines)は、ウェブコンテンツがすべてのユーザー、特に障害を持つユーザーにとってアクセス可能であることを保証するためのガイドラインです。
  • WCAG 2.2は、WCAG 2.1を基にして、2023年10月5日に発行されました。

WCAG 2.2 解説書

https://waic.jp/translations/WCAG22/

2. WCAG 2.2の目的

  • すべてのユーザーがウェブコンテンツにアクセスしやすくすること。
  • 特に、視覚、聴覚、運動、認知の障害を持つユーザーに配慮すること。

3. WCAG 2.2の構造

  • 原則 (Principles)
    • 知覚可能 (Perceivable)
      • 情報とユーザインターフェースの構成要素は、ユーザーが知覚できるように提供されなければならない。
    • 操作可能 (Operable)
      • ユーザインターフェースの構成要素とナビゲーションは、操作できるように提供されなければならない。
    • 理解可能 (Understandable)
      • 情報とユーザインターフェースの操作は、理解できるように提供されなければならない。
    • 堅牢 (Robust)
      • コンテンツは、様々なユーザーエージェント(含む支援技術)に対して堅牢であるように提供されなければならない。

4. WCAG 2.2のガイドラインと成功基準

  • ガイドライン (Guidelines)
    • 各原則に関連する具体的なガイドラインが定義されています。
  • 成功基準 (Success Criteria)
    • 各ガイドラインに対して、具体的な達成基準が定義されています。これらはA、AA、AAAの3つのレベルで分類されます。 ※後述

5. WCAG 2.2での主な変更点

WCAG 2.2では、WCAG 2.1に追加された9つの新しい成功基準(Success Criteria)が具体的に含まれています。それぞれの基準が、特定のアクセシビリティ上の問題を解決するために導入されています。以下に、具体的な成功基準の変更や追加内容を紹介します。

1. ドラッグジェスチャーの代替(2.5.7 Dragging Movements) – Level A

  • ドラッグ操作が必要な場合、それを行うための代替方法を提供しなければなりません。例えば、タッチスクリーンデバイスでドラッグアンドドロップが必要な場面では、クリックやタップで同様の操作ができる方法を提供する必要があります。

2. ターゲットの最小サイズ(2.5.8 Target Size (Minimum)) – Level AA

  • インタラクティブな要素(ボタン、リンクなど)のタッチエリア(ターゲットサイズ)が少なくとも24×24ピクセルであることが求められます。これにより、ユーザーが小さすぎるボタンやリンクを誤操作するリスクが減ります。

3. フォーカス可視性の強化(2.4.11 Focus Appearance (Minimum)) – Level AA

  • キーボードフォーカスを受けたインタラクティブな要素の外観が、視覚的に十分に明確であることを求められています。フォーカスインジケーターが目立たない場合は、ユーザーがどの要素にフォーカスしているのか分かりにくくなるため、この基準が追加されました。

4. フォーカスインジケーターの強調(2.4.12 Focus Appearance (Enhanced)) – Level AAA

  • より高いアクセシビリティ基準として、フォーカスされた要素のインジケーターがより視覚的に目立つように設計されていることが求められます。

5. 一時停止、停止、非表示(3.2.6 Consistent Help) – Level A

  • サポート機能が提供されている場合(FAQやヘルプリンクなど)、そのサポート機能に容易にアクセスできることを要求しています。この基準は、サポートが必要なユーザーにとってヘルプが見つけにくい問題を解決します。

6. 認証の代替方法(3.3.7 Accessible Authentication) – Level A

  • パスワード入力のような記憶を必要とする認証手段を避けるため、ユーザーに代替手段を提供する必要があります。例えば、メールのリンクや生体認証、セキュリティキーなどが使えるようにすることが求められます。

7. 認証プロセスでの再入力の最小化(3.3.8 Redundant Entry) – Level A

  • 認証プロセスやフォーム入力中に、すでに入力された情報を再度要求することを避けるべきです。これにより、ユーザーが無駄な入力をしなくて済むようにすることが求められます。

8. エラー防止(3.3.9 Accessible Authentication without cognitive function test) – Level AA

  • 認証手段において、ユーザーに不必要な認知負荷をかけることを避けるため、単純なパズルや覚える必要のある内容を含まない認証方法を提供します。

9. コンポーネントのエラー防止(2.5.9 Accessible Component Labels) – Level AA

  • 入力エラーが起こりやすいフォームやインターフェースコンポーネントについて、エラーメッセージの明示や入力内容の確認を行い、エラーの発生を防止するための指示を提供する必要があります。

WCAG 2.1からの他の改訂

  • WCAG 2.1で導入された基準はWCAG 2.2でも引き継がれており、変更や削除はありません。WCAG 2.2の新しい基準は、特にモバイルデバイスやタッチスクリーンを使用するユーザーに焦点を当てており、インタラクティブな操作のアクセシビリティをさらに強化することを目的としています。

6. 実際の適用例

  • 知覚可能
    • 画像には代替テキストを提供する。
    • 文字サイズの調整ができるようにする。
  • 操作可能
    • キーボード操作が可能なナビゲーション。
    • コンテンツの時間制限の調整。
  • 理解可能
    • 明確で一貫性のあるナビゲーション。
    • 読みやすいテキストとレイアウト。
  • 堅牢
    • 最新の技術に対応し、互換性を保つ。

成功基準のレベルについて

WCAG 2.2の成功基準は、各ガイドラインに対して具体的な達成基準を定義しており、これらは3つのレベル(A、AA、AAA)で分類されています。

  • レベルA (最低レベル)
    • ウェブコンテンツがアクセシブルになるために、最低限満たさなければならない基準です。
    • 基本的なアクセシビリティ問題に対処するための基準が含まれています。
  • レベルAA (中間レベル)
    • より多くのユーザーがアクセスしやすくなるための基準です。
    • 法的要件として多くの国で採用されることが多いです。
  • レベルAAA (最高レベル)
    • すべてのユーザーに対して、できる限り最高のアクセシビリティを提供するための基準です。
    • 全てのサイトで達成するのは難しいが、可能な限り達成することが推奨されます。

 

次回はより実践的な内容を、具体例を交えてお伝えします。

第2回 成功基準の具体例・役割編

第3回 実践編

関連記事

郵便番号を元に、住所の自動入力を実装!yubinbango.js
ヘッドレスCMSとは
セマンティックなHTMLの重要性と実例講座【誤用編】
セマンティックなHTMLの重要性と実例講座【基礎編】