3-1) 色のみに依存しない情報提供(文字編)

ここでは色のみに依存しない、情報の提供方法についてご説明致します。

先ず以下の<図1>をご覧下さい。ごく普通の健常者が見ると、3,500円コースの下に「上海蟹を味わえるお得なコースです。」が赤系統色で表示されていて、分かり易く、またコースメニューのサブタイトルであると誰もがお分かり頂けると思います。

<図1>

しかしながら、例えば色弱者の中でU型(白黒の世界)に属する方々から見る<上図1>は、以下<図2>のように見えるのです。(※グレースケールに変換しています。)

<図2>

皆さんいかがでしょうか?

これでは全ての人々に対して、強調したいという制作側の思いが伝わりません!!  <図1>のような、色のみによる「強調」だけでは不十分であることがお分かり頂けるかと思います。 これがWebアクセシビリティ、誰にも分かり易い配色を考慮する上での、最も基本的な考え方となります。

そこで、この部分を以下<図3>のように改善してみました。同様に<図4>がグレースケールに変換してみたものです。

<図3>

<図4>

<図2>と見比べて見てください。

これならばどこが強調点で、サブタイトルなのかが一目瞭然で分かる様になったと思います。 このように色のみに意味を持たせる(依存)ことのないように、十分な配慮が必要となる訳です。 具体的には、色に意味を持たせる部分には、色以外での表現も加える心がけが必要ということです。 そして、その表現方法は同一サイト内で統一することが重要です。

尚、上記の改善例を提示すると、全てグレースケールで検証をすれば良いのか?という単純なご質問もあるかもしれませんが、それでは全体のデザインの話がどこかにいってしまう恐れもありますので、デザインを活かした総合的な検討が必要になってきます。