Web担トップ » Webのコト、教えてホシイの！ » カラーユニバーサルデザインとはどのような手法ですか？ CUDO副理事長・伊賀公一さんに聞いてきた

Webのコト、教えてホシイの！

カラーユニバーサルデザインとはどのような手法ですか？ CUDO副理事長・伊賀公一さんに聞いてきた

色のユニバーサルデザインとは何なのか。基本の考え方と、Webサイトで使える具体的なデザイン手法を伺った。

星井博文 6/28 7:00 UX／CX | マンガ/小説

5 9 12

Webのコト、教えてホシイの！

あれテレビのリモコンを見てくださいここに赤青黄緑って書いてあるんですなぜわざわざ色名を書いているんでしょうか？ ↑このマンガを描いている星井それは色弱の人向けなんですよ ↑Web担編集長・四谷さんそっか… 人によって色の見え方が違うのか… Web担・内藤さん↓ 最近はＷｅｂサイトを作る際にもカラーユニバーサルデザインを意識することが増えてきましたねカラーユニバーサルデザインってなんですか？今回はカラーユニバーサルデザインについて伊賀公一さんに話を聞きに行きましょう！

どうもよろしくお願いします NPO法人カラーユニバーサルデザイン機構（CUDO）伊賀公一さんお願いします！伊賀さんは特定の赤と黄と緑が識別できない P型色覚なんですよねはいえっそうなんですか!! おもいっきり赤と黄と緑がありますね… だけど… あらゆる色に色名を添え書きするのは難しいですよねカラーユニバーサルデザインには色名を書く以外にも様々な色覚の人に利用しやすくするデザイン手法があるんです

色弱者は日本国内では男性の２０人に 1人女性の５００人に１人合計３００万人以上いると言われていますえっそんなにっ呼称についてお聞きしたいんですがどの呼び方が適切なのでしょうか？「色弱」「色盲」「色覚障害」「色覚異常」２００５年に日本眼科学会は「色盲」「色弱」という呼称を廃止し現在は「色覚異常」と呼んでいますが色覚の異常ではなく違いなのでＣＵＤＯではＣ型・Ｐ型・Ｄ型と色覚のタイプ別に呼ぶことを提唱しています・C型色覚（Common=一般的な／Cipher=0型）眼科によって「正常色覚」と診断される一般的な錐体を3種持つ人。日本人男性の約95%，女性の99%以上を占める。・P型色覚　P（強度　Protanope＝1型2色覚）　P型の強度　赤い光を受け取るL錐体がなかったり、機能していないタイプ。緑の光を受け取るM錐体と青の光を受け取るS錐体の２本で色を感じる。　PA（弱度　Protanormaly=1型3色覚）　P型の弱度。M錐体と似た分光感度のL錐体を持つ。色の感じ方は、P型とC型の中間と考えられている。・D型色覚　D（強度 Deuteranope＝2型2色覚）　D型の強度　緑の光を受け取るM錐体がなかったり、機能していないタイプ。　赤い光を受け取るL錐体と、青い光を受け取るS錐体の２本で色を感じる。　DA（D型弱度 Deuternormaly=2型3色覚）　D型の弱度。Ｌ錐体と似た分光感度のM錐体を持つ。　色の感じ方は、D型とC型の中間と考えられている。

まぁただＰ型とＤ型の人全体を表す呼称については交通で困難や不便を感じている人を「交通弱者」というように色に関して困りごとを抱えているので色の弱者すなわち「色弱者」と呼ぶのが良いのではないかと思います了解しました色弱者にとって区別がつきにくい色にはどんなものがあるんですか？Ｃ型色覚にとっての青／紫水色／ピンク明るい灰色／淡い水色灰色／淡い緑深緑／茶色濃い赤／焦げ茶赤／緑黄色／黄緑明るい茶色／オレンジ／明るい緑などがありますなので見分けやすいようにという意図でこれらの色の区別に何らかの情報が付与されていると色弱者にはその情報を読み取れないので困ってしまうんです

それは大変ですねそもそもユニバーサルデザインとはどういうものなんですか？年齢・性別・文化・障害などの個々の状況にかかわらず誰もが快適に使える状況を設計するという考え方ですねこの考え方を色に関しても実施していこうというのがカラーユニバーサルデザインなのです色弱者にとっても快適な世界の実現を目指しているんですねでは具体的にどのような取り組みをしているのでしょうか？我々カラーユニバーサルデザイン機構ではカラーユニバーサルデザインの３つのポイントを定めています ①できるだけ多くの人に見分けやすい配色を選ぶ ②色を見分けにくい人（場合）でも情報が伝わるようにする ③色の名前を用いたコミュニケーションを可能にする

①できるだけ多くの人に見分けやすい配色を選ぶまず 1つ目が「見分けやすい配色を選ぶ」明度を変えたり彩度を変えたりすることで見分けることができるようになります ②色を見分けにくい人（場合）でも情報が伝わるようにする次にグラフや図形の色＋形の違いを使って情報を伝わりやすくします ③色の名前を用いたコミュニケーションを可能にする最後は色名を記入することで色覚タイプの違う人とのコミュニケーションをしやすくします

思ってたより難しいことじゃないですねおっしゃる通りですかつては青信号の色が緑色で色弱者にとっては赤信号や黄信号と見分けがつきにくかったのですが１９７０年代以降色弱者にも区別しやすい青緑色に変更されました必要なのは違いがわかる配色なんですねはいＣＵＤＯは推奨配色セット委員会に参加してサイトでセットを公開しているので参考にしてください — ※カラーユニバーサルデザイン推奨配色セットについて（CUDO）

Ｗｅｂサイトがわかりやすい配色になっているかを確認するにはどうすれば良いんでしょうか？　たとえばこのようなさまざま色がありますがこれを色覚シミュレーションするとこのようになります

確かに見分けづらいですね人によって色の見え方がこんなにも違うんだそれらもふまえて作らないとダメですね今後さらに色覚のことを広く理解するためにはどの様な手法がありますか？検定がありますのでそちらに挑戦していただきたいですね早く色覚の多様性に対応する社会を実現したいですねＷｅｂ担でも関連情報と知識の普及に力を入れていきますそれでは最後読者に一言お願いします

カラーユニバーサルデザインはより多くの人にとって「整理された見分けやすいデザイン」です色覚は多様であるという視点に立った配色やデザインをぜひ心がけてみてくださいカラーユニバーサルデザインは今後ますます重要になりますより多くの人にわかりやすく伝わりやすいことを目指しましょう今回の取材で色覚のことを知れてよかったですホシイノもカラーユニバーサルデザインに対応します！いや… このマンガは白黒だから…

次回は7月26日（金）公開予定

この記事が役に立ったらシェア!9 12

※記事へのコメント機能は2021年11月をもって終了しました。編集部へのご連絡は、問い合わせフォーム・メール・Twitterなどをご利用ください。

Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]

[GOLD SPONSOR]

株式会社日本レジストリサービス

[SPONSOR]

株式会社キノトロープ Sitecore 株式会社ミツエーリンクス株式会社電通デジタル株式会社サイズ