2010年11月8日(月曜日)
リンクと他の文字とのコントラストを3:1以上にする、という話の元ネタ
公開: 2010年11月17日14時40分頃
最近、JIS X 8341-3:2010やWCAG2.0で「リンクと他の文字とのコントラストを3:1以上にするべし」とされている……という話を耳にしました。しかも複数回耳にしているので、けっこう広まっているのではないかと思います。
これはそもそもおかしな話ではないでしょうか。WCAG2.0 1.4.1 Use of Color (www.w3.org)では「色に依存してはならない」とされていて、これは「Level A」で必須です。リンクが色でしか区別できない状態はそもそもNGで、3:1のコントラストがあれば良いという話にはならないはずです。
おそらく、3:1 の元ネタは Techniques for WCAG 2.0 の G183 「G183: Using a contrast ratio of 3:1 with surrounding text and providing additional visual cues on focus for links or controls where color alone is used to identify them (www.w3.org)」でしょう。確かに、3:1のコントラスト比と書かれています。
しかし、これはHow to meet 1.4.1 (www.w3.org)の4番目に出ている実装方法で、他の3つの実装方法よりも優先度が低いものです。さらに、よく見ると3:1のコントラストだけではなく、オンフォーカス時に変化する必要があるとされています。本文を読むと、むしろオンフォーカス時の変化のほうがメインであるように読めます。
The intent of this technique is to provide a redundant visual cue for users who may not be able to discern a difference in text color. Color is commonly used to indicate words that are links within a paragraph or other block of text. For example, scattered words in text may be hypertext links that are identified only by a difference in color with surrounding text. This technique describes a way to provide additional cues on hover and focus so that users who may have difficulty perceiving color differences or have low vision can identify them.
オンフォーカス時に変化させる前提で、変化前にも3:1のコントラストが必要だと言っているに過ぎません。しかもこんな補足まであります。
While using this technique is sufficient to meet this success criteria, it is not the preferred technique to differentiate link text. This is because links that use the relative luminance of color alone may not be obvious to people with black/white color blindness. If there are not a large number of links in the block of text, underlines are recommended for links.
リンクテキストを区別する方法としては優先度が高くないし、リンクが少なければアンダーラインの方がオススメだというわけです。
……にもかかわらず、なぜか 3:1 のコントラストがあれば良いかのごとく誤解されているような気配を何度か感じている今日この頃なわけで。
そして今日、その誤解の原因かもしれないものを発見しました。それがこれ……「G183: リンク又はコントロールを色だけで識別している箇所の視覚的な手がかりを補足するために、周囲にあるテキストとのコントラスト比を 3:1 以上にする (www.ciaj.or.jp)」。ウェブアクセシビリティ基盤委員会(WAIC)のサイトで公開されている邦訳なのですが、タイトルからして "and providing additional visual cues on focus" の部分をうまく訳せていない感じで、これは誤解を招きそうではありますね。
※なんかつぶやいたら植木さんに伝わったようなので、この辺はそのうち対応されると思います。
- 「リンクと他の文字とのコントラストを3:1以上にする、という話の元ネタ」にコメントを書く
- 前(古い): 2010年11月6日(Saturday)のえび日記
- 次(新しい): 2010年11月12日(Friday)のえび日記
