ユニバーサルデザイン・色

カラー ユニバーサルデザインとは？

色の見え方は人によって違う

「この図は色分けされているから、すぐにわかる」と思ったことはないでしょうか。グラフ、地図、信号、学校のプリント、スマートフォンの画面、駅の案内表示など、私たちの身の回りには色を使って情報を伝えるデザインがたくさんあります。

しかし、色の見え方はすべての人に共通しているわけではありません。赤と緑の区別がしにくい人、特定の色の組み合わせが似て見える人、明るさやコントラストによって情報を読み取りにくく感じる人もいます。一般的には「色弱」「色覚特性」「色覚の多様性」などと呼ばれることがあります。

日本では、男性の約5％、女性の約0.2％に色覚の特性があるとされています。つまり、学校、職場、公共施設、Webサイト、アプリ、広告、教材などを作るときには、「色の違いだけで情報を伝えない」という考え方がとても大切になります。

この記事では、カラー ユニバーサルデザインの考え方をもとに、色覚の違いに配慮した色の使い方、見分けにくい色の組み合わせ、身近な工夫の例をわかりやすく紹介します。

カラー ユニバーサルデザインとは？

カラー ユニバーサルデザインとは、色の見え方の違いにかかわらず、できるだけ多くの人に情報が正しく伝わるように配色や表示方法を工夫する考え方です。

単に「きれいな色を選ぶ」ということではありません。大切なのは、色だけに頼らず、文字・形・記号・模様・明暗差などを組み合わせて情報を伝えることです。

たとえば、赤いボタンを「危険」、緑のボタンを「安全」として色だけで区別している場合、赤と緑の違いが見えにくい人には意味が伝わりにくくなります。しかし、そこに「停止」「開始」という文字や、×印・チェックマークなどの記号を加えれば、色の見え方に関係なく意味が伝わりやすくなります。

カラー ユニバーサルデザインは、色弱の人だけのための特別な配慮ではありません。高齢者、子ども、外国人、視力が低い人、暗い場所や明るすぎる場所で画面を見る人、白黒印刷で資料を見る人にとっても役立ちます。

色覚の違いを比較してみよう

まず、以下のイラストをご覧ください。

この画像は、一般的な色覚の場合と、色の区別がしにくい場合の見え方を比較したイメージです。実際の見え方には個人差があり、すべての色弱の人が同じように見えているわけではありません。ただし、色の組み合わせによっては、見分けにくさが生じることがあります。

一般的な色覚の場合

• ✅ 赤・緑・青・黄色などの違いを比較的はっきり区別しやすい
• ✅ 色分けされた図やグラフの違いを読み取りやすい
• ✅ 果物、信号、地図、ボタンなどの色の違いを直感的に判断しやすい

色の区別がしにくい場合の一例

• ⚠️ 赤と緑、黄と緑などが似た色に見えることがある
• ⚠️ 色だけで分けられたグラフや地図の違いがわかりにくいことがある
• ⚠️ 赤い文字や緑の表示が、背景によっては目立ちにくいことがある
• ⚠️ 色の濃淡だけで表された数字や図形が読み取りにくいことがある

このように、同じ色を使っていても、見る人によって情報の伝わり方が変わることがあります。そのため、色のユニバーサルデザインでは「誰が見ても意味がわかるか」を意識することが重要です。

ユニバーサルデザインとは？

ユニバーサルデザインとは、年齢、性別、国籍、障害の有無、身体的特徴などにかかわらず、できるだけ多くの人が使いやすいように設計する考え方です。

たとえば、段差をなくした入口、自動ドア、点字ブロック、ピクトグラム、多言語表示、大きく読みやすい文字、直感的に操作できるボタンなどは、ユニバーサルデザインの身近な例です。

色の使い方も、ユニバーサルデザインの大切な要素です。どれほど美しいデザインでも、必要な情報が一部の人に伝わりにくければ、使いやすいデザインとは言えません。

特に、公共の案内表示、学校教材、医療情報、防災マップ、交通機関の路線図、Webサイトのボタンなどでは、色の違いだけに頼らず、誰にでも意味が伝わる工夫が求められます。

なぜ「色の使い方」が重要なの？

色は、情報をすばやく伝えるためにとても便利です。赤は注意、青は安全、緑は許可、黄色は警告といったように、色には直感的なイメージがあります。

しかし、色の違いだけで情報を伝えると、色の見え方に違いがある人にとっては、意味を判断しにくくなることがあります。また、色覚に特性がない人でも、暗い場所、強い日差しの下、古いモニター、白黒印刷、画面の明るさ設定などによって、色の違いがわかりにくくなることがあります。

特に、次のような場面では注意が必要です。

• ⚠️ グラフや地図の凡例を色だけで区別している
• ⚠️ ボタンのオン／オフ状態を色だけで表示している
• ⚠️ エラーメッセージを赤字だけで示している
• ⚠️ 路線図や案内表示で、似た色の線が並んでいる
• ⚠️ 防災マップで危険度を色の違いだけで示している
• ⚠️ 学校のプリントで、重要部分を赤や緑だけで区別している
• ⚠️ 食品表示や薬のパッケージで、注意情報が色だけで示されている
• ⚠️ Webサイトのリンクやボタンが、色の違いだけで判断される作りになっている

色は便利な情報伝達の手段ですが、色だけに頼ると、見落としや誤解につながることがあります。だからこそ、カラー ユニバーサルデザインでは、色以外の手がかりを組み合わせることが大切です。

色の見え方に配慮したデザインのポイント

色覚の違いに配慮したデザインでは、「色を使わない」のではなく、「色だけに頼らない」ことが基本です。色は使ってよいのですが、色以外の情報も一緒に示すことで、より多くの人に伝わりやすくなります。

画像で見る、色に頼らないデザインの工夫

上の画像では、色の違いだけではなく、記号、模様、文字、コントラストなどを使って情報を伝える工夫が示されています。

記号を併用する

チェックマークやバツ印などの記号を使うと、色の違いがわかりにくい場合でも意味が伝わりやすくなります。

たとえば、青い丸と黒い丸だけでは意味がわかりにくい場合でも、チェックマークとバツ印が入っていれば、「正しい」「間違い」「許可」「禁止」などの意味を判断しやすくなります。

グラフには模様や線の違いを加える

棒グラフや折れ線グラフでは、色だけで項目を区別すると、見分けにくい人が出てしまうことがあります。

そのため、棒に斜線やドットの模様を入れたり、折れ線を実線・点線・破線に分けたりすると、色以外の手がかりでもデータを読み取れるようになります。

ボタンには文字を入れる

ボタンは、色だけで役割を伝えないことが大切です。

たとえば、「送信」「戻る」「キャンセル」「購入する」「次へ」などの文字が入っていれば、ボタンの色が判断しにくくても、操作の意味がわかります。

また、背景色と文字色のコントラストを十分に確保すると、視力に不安がある人や高齢者にも読みやすくなります。

見分けやすい配色を選ぶ

赤と緑の組み合わせは、色覚特性がある人にとって見分けにくい場合があります。そのため、青とオレンジ、紫と黄など、比較的差がわかりやすい組み合わせを使うことがあります。

ただし、どの配色でも万能というわけではありません。背景色、明るさ、彩度、文字の大きさ、表示環境によって見え方は変わります。配色を選ぶときは、色相だけでなく、明度差やコントラストも確認することが大切です。

ユニバーサルデザインにおける色の組み合わせのポイント

色の組み合わせを考えるときは、「きれいに見えるか」だけでなく、「情報が正しく伝わるか」を確認することが重要です。

• 高いコントラストを確保する
  背景色と文字色・図形色の明度差を大きくし、色弱の人や高齢者でも判別しやすくします。白背景に黒文字のような組み合わせは、基本的で読みやすい例です。
• 色相の差も意識する
  明るさだけでなく、赤・青・黄・紫などの色相の差も考えることで、情報を区別しやすくなります。ただし、色相の違いだけに頼るのではなく、明度差や文字情報も合わせて考える必要があります。
• 色だけに頼らない情報伝達を行う
  色分けだけでなく、形、模様、文字、アイコン、線の種類などを併用すると、誰でも意味を理解しやすくなります。
• 色覚の多様性に配慮する
  赤と緑、緑と茶色、青と紫などは、人によって識別しづらい場合があります。必要に応じて補助要素を加えることが大切です。
• 背景色と前景色のバランスを考える
  コントラストを確保しつつ、まぶしすぎない配色にすることも重要です。極端に強い色の組み合わせは、長時間見ると疲れやすくなることがあります。
• 自然光や画面表示環境も考慮する
  同じ色でも、屋外、室内、スマートフォン、パソコン、印刷物では見え方が変わります。デジタル画面と紙の資料では、確認すべきポイントが異なります。
• 文化的背景や色の意味にも注意する
  色には国や文化によって異なる意味があります。日本では自然な配色でも、海外では別の印象を与えることがあるため、国際的な表示では注意が必要です。
• 配色数は必要最小限にする
  色数が多すぎると、かえって情報が散らかって見えます。資料やWebページでは、基本となる色を3〜4色程度に抑えると、見やすく整理された印象になります。
• 試作段階でテストする
  色覚シミュレーターを使ったり、実際の利用者に見てもらったりすることで、作り手が気づきにくい問題を発見できます。
• 長時間見ても疲れにくい色合いにする
  極端に鮮やかな原色を多用すると、目が疲れやすくなることがあります。特に教材、業務画面、医療情報、長時間読む資料では、見やすさと疲れにくさの両方を考える必要があります。

見分けにくい色の組み合わせの例

色覚の特性によって見分けにくい色の組み合わせは異なりますが、一般的に注意されることが多い組み合わせがあります。

• 赤と緑
• 緑と茶色
• 赤と黒
• 青と紫
• 黄緑と黄色
• ピンクと水色
• オレンジと黄緑

これらの組み合わせを絶対に使ってはいけない、というわけではありません。大切なのは、色だけで意味を区別しないことです。

たとえば、赤と緑を使う場合でも、「赤＝停止」「緑＝開始」と色だけで伝えるのではなく、「停止」「開始」という文字、アイコン、形の違いを加えれば、意味が伝わりやすくなります。

身近にあるカラー ユニバーサルデザインの例

信号機

信号機は、色によって意味を伝える代表的なものです。しかし、信号は色だけで判断するものではありません。多くの信号では、赤・黄・青の位置が決まっており、歩行者用信号では人の形のピクトグラムも使われています。

色が見えにくい場合でも、位置、明るさ、形などを手がかりに判断できるようになっている点は、色だけに頼らないデザインの一例です。

駅の路線図

駅の路線図では、多くの路線が色で分けられています。しかし、色だけで区別すると、似た色の路線が見分けにくいことがあります。

そのため、路線名、駅番号、アルファベット、線の太さ、案内サインなどを組み合わせることで、色の違いに頼らなくても目的地を探しやすくなります。

学校のプリントや教材

学校のプリントでは、重要な部分を赤字にしたり、正解を緑で示したりすることがあります。しかし、赤や緑だけで意味を伝えると、見分けにくい場合があります。

重要な部分には「重要」「ポイント」などの文字を添えたり、下線、囲み、太字、番号などを使ったりすると、より多くの人に伝わりやすくなります。

グラフや表

プレゼン資料やレポートで使うグラフでは、色分けがよく使われます。しかし、折れ線グラフを赤・緑・茶色などで分けるだけでは、線の違いがわかりにくいことがあります。

線の種類を変える、凡例にわかりやすい文字を入れる、グラフの線の近くに直接ラベルを付けるなどの工夫をすると、色だけに頼らず情報を読み取れます。

Webサイトやアプリ

Webサイトやアプリでは、ボタン、リンク、通知、エラーメッセージなどに色が使われます。

たとえば、入力ミスを赤い枠だけで知らせるのではなく、「必須項目です」「メールアドレスの形式が正しくありません」などの文章を表示すると、原因がわかりやすくなります。

また、リンクは色だけでなく下線を付ける、ボタンには文字を入れる、通知にはアイコンを加えるなどの工夫も有効です。

防災マップやハザードマップ

防災マップでは、危険度を色で示すことがあります。たとえば、浸水の深さや土砂災害の危険区域を色分けする場合です。

しかし、危険度を色だけで示すと、見分けにくい人が出る可能性があります。色に加えて、文字、数字、模様、境界線、凡例の工夫を加えることで、緊急時にも情報を理解しやすくなります。

医療や薬の表示

薬のパッケージや医療情報でも、色はよく使われます。注意、禁止、用量、服用時間などを色で示すことがありますが、命や健康に関わる情報では、色だけに頼るのは危険です。

文字、アイコン、番号、説明文を組み合わせることで、誤解を防ぎやすくなります。

スマホやパソコンにもある色覚サポート機能

近年のスマートフォンやパソコンには、色の見え方を調整するための機能が用意されています。

iPhoneでは「カラーフィルタ」などの設定を使って、色覚特性に合わせた表示に変更できます。Androidにも、色補正や色反転などのアクセシビリティ機能があります。

また、パソコンやデザインソフト、Web制作ツールの中には、色覚シミュレーションやコントラストチェックができるものもあります。

こうした機能は、色弱の人が使いやすくするためだけでなく、デザイナーや資料作成者が「自分の作った画面や資料が本当に見やすいか」を確認するためにも役立ちます。

色とユニバーサルデザインに関する豆知識

信号の赤は、すべての人に同じ赤として見えているわけではない

色覚に特性がある人の中には、赤がくすんだ色や暗い色に見える人もいます。それでも信号を判断しやすいのは、色だけでなく、位置、明るさ、形、周囲の状況などの手がかりがあるためです。

このように、信号は色を使いながらも、色だけに頼りすぎない仕組みになっています。

Excelの赤と緑は見分けにくいことがある

Excelやスプレッドシートでは、増加を緑、減少を赤で示したり、条件付き書式で赤と緑を使ったりすることがあります。

しかし、赤と緑の組み合わせは、色覚特性がある人にとって見分けにくい場合があります。そのため、色だけでなく、矢印、プラス・マイナス記号、数値、文字、アイコンなどを併用するとわかりやすくなります。

石原式色覚検査は日本人が考案した

色覚検査でよく知られている、丸い点の中に数字が描かれた検査表は「石原式色覚検査」と呼ばれます。日本の眼科医である石原忍博士が考案したもので、現在でも世界的に知られています。

色の見え方の違いを理解するうえで、色覚検査は重要な役割を果たしてきました。

青とオレンジ、紫と黄は比較的見分けやすい場合がある

赤と緑の組み合わせよりも、青とオレンジ、紫と黄などの組み合わせの方が見分けやすい場合があります。

ただし、色の組み合わせは、明るさ、背景色、彩度、表示環境によって見え方が変わります。単に「この色なら大丈夫」と考えるのではなく、実際に見やすいかどうかを確認することが大切です。

色覚サポート機能は身近なユニバーサルデザイン

スマートフォンやパソコンにある色覚サポート機能は、テクノロジーによって実現されるユニバーサルデザインの一例です。

こうした機能が標準で用意されるようになったことで、色の見え方に違いがある人も、自分に合った画面表示を選びやすくなっています。

学校や職場でできるカラー ユニバーサルデザイン

カラー ユニバーサルデザインは、専門のデザイナーだけが考えるものではありません。学校の先生、会社員、資料を作る人、Webサイトを運営する人、チラシやポスターを作る人など、誰でも意識できる工夫です。

プリントや資料を作るとき

• 重要な部分を赤字だけで示さず、太字や下線も使う
• 色分けした部分には、文字や番号も付ける
• 白黒印刷しても意味が伝わるか確認する
• 文字と背景のコントラストを十分に取る

プレゼン資料を作るとき

• グラフの線は色だけでなく、線の種類も変える
• 凡例だけでなく、グラフの近くに直接ラベルを付ける
• 背景と文字の色をはっきり分ける
• 赤と緑だけで良い・悪いを表さない

Webページを作るとき

• リンクは色だけでなく下線などでも示す
• ボタンには「送信」「購入する」などの文字を入れる
• エラー表示には文章とアイコンを添える
• スマホでも見やすい文字サイズとコントラストにする

ポスターや案内表示を作るとき

• 案内矢印やピクトグラムを使う
• 色分けには文字説明を添える
• 遠くから見ても読める文字サイズにする
• 背景と文字が似た色にならないようにする

少しの工夫を加えるだけで、情報はずっと伝わりやすくなります。

カラー ユニバーサルデザインで大切な考え方

カラー ユニバーサルデザインで大切なのは、「色を使わないこと」ではありません。色は、情報をわかりやすく、楽しく、美しく伝えるためにとても役立ちます。

しかし、色だけに頼ると、情報が伝わりにくくなる人がいます。そこで、文字、形、記号、模様、明暗差、配置などを組み合わせることが重要になります。

つまり、カラー ユニバーサルデザインとは、色の美しさを否定するものではなく、色の便利さを生かしながら、より多くの人に伝わるようにする考え方です。

見やすいデザインは、特定の人だけに役立つものではありません。多くの人にとって、読みやすく、迷いにくく、使いやすいものになります。

まとめ：色だけに頼らないことがユニバーサルデザインの基本

ユニバーサルデザインにおける色の工夫では、色の見え方が人によって違うことを理解することが大切です。

赤と緑、青と紫、緑と茶色など、人によっては見分けにくい色の組み合わせがあります。また、色覚に特性がない人でも、暗い場所、強い光、古い画面、白黒印刷などの条件によって、色の違いがわかりにくくなることがあります。

そのため、色だけで意味を伝えるのではなく、文字、形、記号、模様、線の種類、明暗差などを組み合わせることが重要です。

カラー ユニバーサルデザインは、色弱の人だけのための特別な配慮ではありません。高齢者、子ども、外国人、視力が低い人、急いで情報を確認する人など、さまざまな人にとって役立つ考え方です。

色を上手に使いながら、色だけに頼らない。これが、誰にでも伝わりやすいデザインを作るための基本です。

関連ページ

ユニバーサルデザインについてさらに詳しく知りたい場合は、以下の記事も参考になります。

• ユニバーサルデザイン・一覧
• ユニバーサルデザイン・家の中
• ユニバーサルデザイン・学校
• ユニバーサルデザイン・自動ドア
• ユニバーサルデザイン・点字ブロック
• ユニバーサルデザインの時計
• ユニバーサルデザイン・身近な例
• ユニバーサルデザイン・ルービックキューブの工夫
• ユニバーサルデザインの7原則