れのあのブログ

の画像

はじめに

こんにちは!今回は、色覚異常についてと色覚異常に配慮したデザインについてお話しします。
色覚異常は、私たちの周りにいる多くの人々が抱える視覚の特性であり、さまざまなデザインにも影響を与えます。
この記事では、まず色覚異常について簡単に説明します。
そして、色覚異常に配慮したデザインのポイントをいくつかご紹介します。
配色の工夫やカラーコントラストの選び方などもまとめているので、ぜひ読んでみてくださいね!

色覚異常ってなんだろう?

色覚異常とは、目の機能に異常が起こることで、通常と違った色の見え方になることをいいます。
程度は人によって異なり、軽いものから色を全く認識できない重度のものまであります。
遺伝などによる先天的な原因から、病気や加齢などの後天的な要因で起こる場合もあります。
先天性の色覚異常は、日本人の場合男性の20人に1人女性の500人に1人いるといわれています。

色覚異常の種類

色覚異常には、3つのパターンがあります。

1型色覚
赤に敏感な視細胞の機能に異常があるパターン。

2型色覚
緑に敏感な視細胞の機能に異常があるパターン。

3型色覚
青に敏感な視細胞の機能に異常があるパターン。

色覚異常の中で最も一般的なのは、赤と緑の区別がつきにくい赤緑色覚異常です。
赤と緑の他、区別がつきにくい色の組み合わせには、赤と黒、緑と灰色、ピンクと灰色、青と紫などがあるといわれています。

こうした色覚異常の方が困らないよう、街中の看板やウェブサイトなどにはカラーユニバーサルデザインを使うことが推奨されています。

カラーユニバーサルデザインってなんだろう?

さまざまな色覚の方に配慮し、その情報ができるだけすべての人に伝わるような、利用者の立場に寄りそったデザイン。
これを、カラーユニバーサルデザインといいます。
東京都のガイドラインを参考に、どのような工夫ができるか見てみましょう。

印刷物作成時の工夫

1.さまざまな色の見え方の理解

色の見え方は個人によりさまざまです。
これに対する理解を深めることが、まずは重要です。

2.原案を作成する

以下のカラーユニバーサルデザインチェックリストを参考に、原案を作成します。

3.シミュレーターなどでチェックする

〇白黒コピーで明暗の差を確認。
〇色弱模擬フィルタ(色覚異常者体験メガネ)などで見え方を確認。

伊藤光学工業株式会社
色弱模擬フィルタ「バリアントール」(別ウィンドウで開きます)

〇シミュレーターソフトで確認。

東洋インキ株式会社
カラーユニバーサルデザイン支援ソフト「UDing™ディザ」(別ウィンドウで開きます)

浅田一憲
色のシミュレータ(別ウィンドウで開きます)

4.当事者によるチェックをする

色覚異常を持つ方に確認してもらい、問題点の修正などを行う。

色の工夫

色の工夫として、色相に配慮する必要があります。

1.赤を使う場合

濃い赤は、黒やこげ茶と間違えやすいです。
なので、赤橙やオレンジを使うなどの工夫が必要です。
文字で使う場合、背景を白にすればさらに見やすくなります。
白背景ができない場合は、白の縁取りを加えることで見やすくなります。

2.緑を使う場合

緑は赤や茶と間違えやすいです。
これらの組み合わせを使用しないのが一番ですが、どうしても使う場合は青みが強めの緑を使うとよいでしょう。

3.黄色~明るい緑を使う場合

黄色と明るい緑は同じ色に見えやすいです。
なので、黄色、黄緑、明るい緑は同時に使わないようにするとよいでしょう。

4.暖色系と寒色系の使い方

暖色系→暖色系(寒色系→寒色系)で使うと、違いが分かりにくくなります。
なので、暖色系→寒色系のように交互に使うとよいでしょう。

5.カラーユニバーサルデザイン推奨配色セットの使用

カラーユニバーサルデザイン推奨配色セットというものがあります。
ここからベースカラーやアクセントカラーを選ぶとよいでしょう。

カラーユニバーサルデザイン推奨配色セット(別ウィンドウで開きます)

色以外の工夫

1.色の名前を入れる

色は個人で見え方が異なります。
また、照明や角度によっても見え方が変わってきます。
色の部分にこれが何色かを表記することで、誰にでもわかりやすくなるでしょう。

2.形状を変える

例えば折れ線グラフがあるとします。
線の色を変えるだけだと見づらい場合があります。
破線や点線を加えたり、〇や△などを交えることで見やすくなるでしょう。

3.境界線や模様を入れる

例えば棒グラフがあるとします。
色を変えるだけだと境界がわからない場合があります。
境界線や模様を入れることで、見やすくなるでしょう。

4.縁取りを入れる

やむを得ず、見にくい色の組み合わせでデザインをする場合があるとします。
その場合は、色と色の境界線に縁取りを入れると見やすくなるでしょう。

5.強調箇所は色以外で表現

強調箇所は、色を変えずに下線やフォントサイズを変えることで、見やすくなるでしょう。

その他の工夫

1.音声コードの使用

文書に音声コードを貼り付けることにより、視覚障害者が音声で情報を得る方法があります。

音声コードとは…
紙に記された文書をデジタルデータに変え、読み込むと音声を読み上げてくれるコードです。
18㎜角のコードに日本語約800文字が記録できます。

2.情報提供は読み上げソフトに対応させる

視覚障害者がパソコンを使うときは、専用ソフトで文字を音声に変える方法を使う場合があります。
PDF文書では使えないため、このソフトを使う前提の場合は、テキストを使用したHTMLでサイトを作る必要があります。
PDFだと文書自体が画像のような扱いになり、テキストを判別できないためです。
複数の読み方がある漢字にはふりがなを付ける工夫も必要です。

また、リンクをクリックしたときに新しいウインドウが開かれると、ブラウザの戻るボタンが使えずに混乱させるもとになります。
新しいウインドウを開く場合は、その旨を表記するのも大切です。

ここまで東京都のガイドラインの内容をピックアップしてご紹介しました。
もっと詳しく知りたい方は、東京都福祉保健局のユニバーサルカラーデザインガイドラインのページをご参照くださいね。

東京都福祉保健局:カラーユニバーサルデザインガイドライン(別ウインドウ開きます)

色覚異常に配慮しているサイトの例

札幌市や東京都、大阪府など都市の公式サイトは大体色覚異常の方に配慮したウェブサイト作りをしています。

札幌市公式サイトの工夫

サイト内文章の音声読み上げ機能
文字サイズを、縮小・標準・拡大に変更可能
色合いの変更可能
・標準(背景白)
・青地に黄色文字
・黄色地に黒文字
・黒地に黄文字

このように、さまざまな要素を組み合わせて見やすいウェブサイト作りがされています。
試しにどんな見え方になるか試してみませんか?

札幌市公式サイト(新しいウィンドウが開きます)

これからウェブサイトを立ち上げる方がいれば、こうした配慮をしているサイトを参考にしてもいいかもしれませんね。

色覚異常を持つ有名人

決して珍しくない色覚異常ですが、有名人にも少なからずいるんです。
その中から日本国内の方を何人か紹介します。
もしかしたらあなたの知っている有名人もいるかもしれませんね。

丹波哲郎(俳優)

映画やドラマなどで活躍した俳優です。
軍人を目指していましたが、赤緑色覚異常により試験に落ちたそうです。

hyde(ミュージシャン)

ロックバンド「L’Arc~en~Ciel」のボーカリストです。
絵の仕事につきたくてデザインの専門学校に通ったものの、色覚異常により断念。
紫を青だとずっと思っていたと語っています。

小堺一機(芸人)

昔放送していたお昼の番組「ごきげんよう」で有名な方ですね。
デザイナーを目指していましたが、色覚異常により断念し、芸能界へ入ったそうです。
父親の理解があり、救われたというエピソードもあります。

中村悠一(声優)

さまざまな役をこなし、第一線を走っているその世界では知らない人がいない声優です。
Youtubeの動画内で、色覚異常であることを告白しました。

ざっと調べただけでも、これだけの有名人が色覚異常をもっていることが分かりました。
自分的に意外な人もいたのでちょっと驚きました。

さいごに

色覚異常の方々は、日常生活やインターネット上でさまざまな困難に直面しています。
ですが、私たちの努力によってその困難を改善することができます。
彼らに対する理解と配慮が広がり、あらゆる人が情報やサービスにアクセスし利用できる環境が作られることを願います。

ここまで読んでいただきありがとうございました!

他の記事もどうぞ!
れのあのブログTOPへ