色や、形、音、レイアウト情報のみでコンテンツを説明していない
概要
この基準では、色や形、音、レイアウトに頼らずに情報を伝えていることを確認してください。感覚的な特徴に頼らない説明を提供することで、すべての人が情報を理解できるようにします。
メリット
- 色覚特性・多様性のあるユーザー: 色だけでなく、テキストや記号で情報を伝えることで、色がわからなくても情報を理解できます。
- 視覚障害のあるユーザー: コンテンツの形や位置に依存せず説明することで、形や位置を知覚しない状態でも利用できます。
達成方法
- 色や、形、音、レイアウト情報などの感覚的情報以外の手段で情報を伝える:
- 情報は感覚的情報だけでなく、テキストやアイコンなどで情報を追加して伝えます。例えば、「必須項目」を示すために、赤色の装飾を加えるだけでなく、「必須」というテキストを併記します。
- 感覚的な特徴を利用した説明にテキスト情報を追加する:
- 「右のボタンをクリック」という指示は、「右の送信ボタンをクリック」とするなど、感覚的な特徴だけに頼らず説明します。
- 感覚的な特徴を説明に利用しない:
- 「右のボタンをクリック」という指示は、「送信ボタンをクリック」とするなど、感覚的な特徴を使わずに説明します。
悪い例
- 色に依存した指示: 「緑色のボタンを押して進む」という指示は、色覚特性のある人にはわかりにくいです。代わりに、「送信ボタンを押して進む」とテキストで明確にします。
- 形に依存した指示: 「星形のアイコンを選んでください」という指示は、視覚障害のある人には理解しづらいです。代わりに、「お気に入りに追加するには、星形のお気に入りボタンを押してください」と、ボタンのラベルなどを利用して説明します。
- レイアウトに依存した指示: 「画面の右上のリンクをクリック」という指示は、画面のレイアウトを認識できない人にとって不明瞭です。「ヘルプセクションへのリンクをクリック」のようにレイアウトに頼らず説明したり、「画面上部のリンクリストの最後のリンクをクリック」などレイアウト以外の情報も合わせて説明します。
テスト方法
- 色や形に依存する説明文がないか確認:
- ページ内の説明文などで、色や、形、音、レイアウト情報（上下左右など）に依存した説明がされていないかを確認します。
- 色や形に依存する状態表示がないか確認:`
- エラー・必須・選択中・活性などのUIコンポーネントの状態を、色のみで提示していないかを確認しています。