WCAG 2.2 達成基準 1.4.1 「色の使用」の検品について
アクセシビリティに関する検品について、今回はWCAG 2.2の1.4.1「色の使用」という項目を取り上げます。該当の達成基準1.4.1の内容は、Web Content Accessibility Guidelines (WCAG) 2.2（ウェブアクセシビリティ基盤委員会による日本語訳）のページで確認できます。
達成基準の日本語訳
以下、達成基準の日本語訳です。
色が、情報を伝える、動作を示す、反応を促す、又は視覚的な要素を判別するための唯一の視覚的手段になっていない。
色にのみ依存した表現が使われておらず、すべてのユーザーに対してコンテンツの内容を伝えられることが求められています。
例えば、色分けによるグラフやボタンリンクがページ内にある場合、色覚障害のあるユーザーには内容の理解が難しいことがあります。
検品の基準
検品にあたり、以下の基準に沿って確認を行います。
- 色のみに依存した表現が使用されていないこと
- 色以外の情報と組み合わせられている場合は問題なし
検品の方法
妥当性を判断するには、コンテンツの意味や文脈を追う必要があるため機械的なチェックが難しい場合が多く、品質管理部門のスタッフによる目視チェックが中心となります。
ただし、テキスト形式の指示書や原稿通りに実装されていても色に依存した表現がされているケースがあるため、単純なテキストチェックの後ページ内検索や正規表現などを用いて色を示す単語を検索し、該当テキストを目視で確認します。
実装状況の例
「色の使用」に関して、以下に「達成基準を満たす例」と「達成基準を満たさない例」を示します。
達成基準を満たす例
- 色がついたボタンリンクを押下してもらうため、ボタンの色とボタンリンクに書かれているテキストを併せて説明する
- 色分けされたグラフで、テキストや指示線を使ってデータを表す
- 色分けだけでなく、ドットや格子などのパターンでデータを表す
達成基準を満たさない例
以下の例は、色のみに依存した表現がされているため、達成基準を満たしません。
次のような表現
- 「赤字の項目」
- 「水色の背景」
- 「赤色のボタン」
色分けされたグラフで、色だけでデータを表している凡例
