A

1.4.1 色の使用

アクセシビリティにおける 1.4.1 色の使用（Level A）の達成基準とは、情報の伝達、操作の指示、エラーの認識などにおいて、色だけに依存しないことを求める基準です。

[参照] https://waic.jp/translations/WCAG22/#use-of-color
目次

要件

情報、指示、アクション、視覚的手がかりを、色の違いだけで伝えてはならない。
色以外のテキスト、形状、ラベル、パターンなどの手段も用いることが必要です。

内容

入力エラーの強調

赤色のみでエラーを示さず、テキストやアイコンで明示する

状態の区別（例：完了／未完了）

緑／赤だけでなく、チェックマークや説明文も追加する

操作の指示

「赤いボタンをクリック」ではなく「右下の『送信』ボタンをクリック」のようにする

グラフや図表

色分けに加え、凡例、パターン、ラベルで区別する

具体例

悪い例（NG）良い例（OK）
必須項目のラベルを赤字だけで表現「※」や「必須」と明示的な記述を追加
エラー箇所の背景を赤くするだけ「入力エラーです」とテキストで補足
緑と赤の色分けのみの棒グラフ模様やラベル、凡例付きで区別する

利点

色覚障害への配慮

色の識別が難しいユーザーにも情報が伝わる

利用者の理解支援

高齢者や視覚処理に困難がある方にも有効

UIの明瞭化

色以外の視覚的手がかりが増えることで、全ユーザーのUXが向上

国際規格適合

WCAG 2.2／JIS X 8341-3:2016の準拠に貢献

検証方法

  • 色だけで状態や意味を区別していないか？
  • 補助情報（テキスト、記号、形など）があるか？
  • 色に頼らずに情報が理解できるか？
一覧に戻る
お問い合わせ

当社では、ウェブサイトの診断や改善方法のご提案を通じて、
すべてのユーザーにとって使いやすいウェブづくりをサポートしています。
ご相談・ご依頼は、こちらからお気軽にお問い合わせください。

お問い合わせフォームへ