色覚の多様性
日本人男性の約20人に1人(5%)、女性の約500人に1人(0.2%)は、特定の色(特に赤と緑)の区別がつきにくい色覚特性を持っています。 「赤はエラー、緑は成功」といった、 色だけ に頼った情報伝達は避けましょう。
良い例 vs 悪い例
- ❌ エラー項目を赤文字にするだけ
- ✅ エラー項目を赤文字にし、 アイコン ** や テキスト**で「エラー」と明示する
コントラスト比の確保
ロービジョン(弱視)のユーザーや、屋外の日差しが強い場所でスマホを見るユーザーにとって、コントラストの低い文字は読めません。
WCAGの基準
- AA(最低限の基準) :
- 通常のテキスト: 4.5 : 1 以上
- 大きなテキスト(18pt以上 / 太字14pt以上): 3 : 1 以上
- AAA(より高い基準) :
- 通常のテキスト: 7 : 1 以上
デザインツール(Figmaなど)やWeb上のチェッカーを使って、必ずコントラスト比を確認する習慣をつけましょう。
色に依存しない表現
グラフやチャートでも、色分けだけでなく パターン(網掛けなど) ** や ラベル**を併用することで、モノクロ印刷された場合でも情報を正しく伝えることができます。