このページは、晴眼者向けに視覚障害、色覚障害および高齢者へのWebページ制作上の注意点を記述しています。
そのため、「悪い例」としてアクセシブルではない記述を行なっている個所および、文法的に不適切な個所があります。ご了承ください
例えば下記のようなグラフを例にとってみます。
折れ線グラフの色が商品ごとに異なっているため、色覚に問題がない人には各商品の推移が分かります。
しかし、色覚障害を持っている方がこのグラフを見たらどうなるでしょうか。下に、P型色覚(1型色覚)、D型色覚(2型色覚)の見え方をシミュレーションした結果を示します。
D型色覚(2型色覚)、P型色覚(1型色覚)共に、商品の識別ができないことが分かります。これは「色だけ」で情報を伝えているために起きる現象です。
色以外に、線の種類を変えてシミュレーションしたのが下記の結果です。
色だけでなく、線の種類という情報を加えることでかなり改善されていることが分かります。
もう一つ、地図の例をあげてみます。埼玉県の地図に、何らかのエリアをマッピングした例です。(地図画像提供:Craft MAP)
凡例も記述されていますし、健常者には、はっきりとエリアの区別が付きます。
これを、P型色覚(1型色覚)、D型色覚(2型色覚)としてシミュレーションしてみます。
かなりエリアの区別が付きにくいことが分かります。そこで、エリアごとのの塗りに色以外の情報を加え、ラベルも付けてみた結果が下記の画像です。
これらのシミュレーション結果を見ることで「色だけで情報を伝え」てはいけないということがお分かり頂けると思います。
色覚障害者への配慮(前景色と背景色のコントラストに注意するなど)
視覚障害者への配慮(日付、時刻などの表記に注意する、線形化されたテーブルを利用するなど)