このページの本文へ移動

G111:色とパターンを併用する

出典:WAIC. “ G111: 色とパターンを併用する新しいウィンドウを開きます ” WCAG 2.0 達成方法集(参照2024年7月1日)

概要

G111は、色を用いて情報を伝える場合、その情報が色に依存せずに理解できるよう、パターンを併用することを求めています。これは、色覚障害を持つユーザーや、モノクロ表示のデバイスを使用しているユーザーに対して、情報を明確に伝えるためのガイドラインです。

このページでは、ウェブサイト制作でよく直面する課題に対して、基本的で取り組みやすい方法を紹介しています。
ただし、他にも対処すべき状況や多くの手段があり、具体的な状況に応じて最適な方法を選ぶことが大切です。

適用(対象)

こちらは、次の達成基準に関連する達成方法です。

実践的な方法

グラフやチャートにおける色とパターンの併用

グラフやチャートで異なるデータセットを色で区別する場合、そのデータセットを区別するためにパターンや形状を追加することが有効です。例えば、棒グラフの各棒に異なるパターン(ストライプ、ドット、チェックなど)を適用したり、線グラフの各線に異なる線種(破線、点線、実線など)を用いることで、色だけに頼らずに情報を区別できるようにします。

地図や図表における色とパターンの併用

地図や図表で異なる領域を色で区別する場合、その領域に異なるパターンを追加することが推奨されます。例えば、地図上の異なるエリアに異なるハッチング(斜線、クロスハッチングなど)を適用することで、色覚障害を持つユーザーにもエリアの違いが理解しやすくなります。

まとめ

G111は、色を用いて情報を伝える場合に、その情報が色に依存せずに理解できるようにするための追加の視覚的手がかりとしてパターンを併用することを目的としています。グラフやチャート、地図などで色とパターンを併用することで、色覚障害を持つユーザーや、色を区別できない環境でも情報が正確に伝わりやすくなります。このガイドラインを遵守することで、より多くのユーザーにとって使いやすいウェブサイトを提供することができます。

WCAG 2.0とその翻訳文書の利用について

本ページの内容は、「Web Content Accessibility Guidelines (WCAG) 2.0新しいウィンドウを開きます」、「WCAG 2.0 解説書新しいウィンドウを開きます」および「WCAG 2.0 達成方法集新しいウィンドウを開きます」からの引用を含んでいます。引用された内容は、W3CおよびWAICによって公開されており、以下のクリエイティブ・コモンズライセンスに基づいて使用されています。これらのガイドラインを参考にしつつ、ウェブアクセシビリティの向上に向けた具体的な取り組みを分かりやすく説明しています。

WCAG 2.0

この作品はクリエイティブ・コモンズ 表示 4.0 国際ライセンス新しいウィンドウを開きますの下に提供されています。

WCAG 2.0 解説書及び達成方法集

この作品はWCAG 2.0 解説書及び達成方法集からの引用を含みます。翻訳はWAICによって提供されており、文書のステータスは「勧告」です。なお、この文書の正式版はあくまでW3Cのサイト内にある英語版であることにご注意ください。

Contactお問い合わせ

当社ではウェブアクセシビリティ診断を提供しております。すべてのユーザーにアクセスできるウェブサイトを目指して、一緒に取り組みましょう。診断のご依頼や詳細については、お気軽にご連絡ください。

お問い合わせ