このページの本文へ移動

G182:文字色の違いが情報を伝えるために使用される場合に、利用可能な追加の視覚的な手がかりを確保する

出典:WAIC. “ G182: 文字色の違いが情報を伝えるために使用される場合に、利用可能な追加の視覚的な手がかりを確保する新しいウィンドウを開きます ” WCAG 2.0 達成方法集(参照2024年7月1日)

概要

G182は、文字色の違いを用いて情報を伝える場合に、色に依存せずに情報を理解できるようにするため、追加の視覚的な手がかりを提供することを求めています。これは、色覚障害を持つユーザーや、モノクロ表示のデバイスを使用しているユーザーに対して、情報を明確に伝えるためのガイドラインです。

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

適用(対象)

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

実践的な方法

強調表示に追加の視覚的手がかりを提供する

文字色を変えて情報を強調する場合、その情報を色に依存せずに理解できるようにするため、追加の視覚的な手がかりを提供します。たとえば、重要な情報を赤色で表示する場合、同時にその部分を太字にする、下線を引く、または斜体にするなどの方法が有効です。

リンクやボタンに追加の視覚的手がかりを提供する

リンクやボタンを色で区別する場合、そのリンクやボタンが特定の機能を持つことを明確にするため、追加の視覚的な手がかりを提供します。たとえば、リンクには常に下線を引く、ボタンにはアイコンを追加する、またはホバーやフォーカス時にボーダーや背景色を変えるなどの方法があります。

情報のカテゴリーやステータスを色で示す場合

情報のカテゴリーやステータスを色で示す場合、その情報を補足するための視覚的な手がかりを追加します。たとえば、進行状況を示すバーグラフを色で区別する場合、異なるパターンやラベルを使用して各セクションを明確にします。

まとめ

G182は、文字色の違いを用いて情報を伝える場合に、色に依存せずに情報を理解できるようにするための追加の視覚的な手がかりを提供することを目的としています。色の使用に依存せず、太字や下線、アイコン、ラベルなどの視覚的な手がかりを加えることで、すべてのユーザーが情報を正確に理解できるようになります。このガイドラインを遵守することで、より多くのユーザーにとって使いやすいウェブサイトを提供することができます。

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のサイト内にある英語版であることにご注意ください。

お問い合わせ

アクセシビリティ対応の第一歩は現状を知ることから

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

お問い合わせ