ii.色覚異常者への配慮

ii-1.色覚異常者とは
ii-2.攻略法の作り方としてはどう扱うか?
ii-3.対処の方法
ii-4.参考文献

ii-1.色覚異常者とは

 まず最初に色覚異常とはどういうものか簡単に説明をしておきます。詳しいことが知りたい方は参考文献ならびに参考サイトを読んでください。なお色覚異常には先天的なものと後天的なものがありますが、ここは先天的な色覚異常をおもに取り上げます。

 色覚異常者とはこれまで色弱、色盲などと言われてきた人の総称です。よく知られているのは赤緑色盲で、これは緑色と赤色の区別ができない人のことをいいます。専門用語では先天赤緑異常というようです。これは通常は赤・緑・青の3色が見られるところ、赤ないし緑を見ることのできる視細胞が弱かったり、その色を見る視細胞自体がなかったりすることが原因となっています。ただ、見えない(見えにくい)色が赤と緑のどちらなのかによって、また見づらさの程度によって色の感じ方が変わってくるようで、決して一律的に灰色に見えるわけではありません。ある書籍によるとその意味するところは「すべての色から赤ないし緑の成分が減少して、(その分が無彩色に置き換わって)知覚される*1」のだそうです。

 その他、青色を見ることのできない人や3色とも見ることができない人も存在しますが、これらは大変珍しい症例のようです*2

ii-1.1.確率的にそれなりにある

 一般的には赤または緑が見られないという色覚異常者が多いわけですが、この確率は一般に日本人男性で5%、女性で0.2%といわれています*3。ですから統計上は日本人男性の20人に1人は視覚障害を持っていることになります。このほか白人男性は6〜8%、黄色人種は4〜5%、アメリカ黒人3.5%、アメリカインディアンは2%以下(すべて男性の値)だということです*4

 とはいえ、この全員が生活に苦労するほど重度の色覚異常者というわけでもありません。むしろ一般生活ではほとんど不自由しない人の方が多いようです*5。ただしそういった人でも一定の条件下で特定の色が見づらくなることがあるので、できるだけ配慮してウェブサイトを作るとよいでしょう。

ii-1.2.遺伝病で治療のできない病気である

 ところで男性と女性で確率が違うのは不思議に思えるかもしれません。これは色覚異常が遺伝病であることに理由があります。原因となる遺伝子は第23染色体であるX染色体に存在しており、これは劣性遺伝であるため、XXである女性の場合はどちらか一方に色覚異常ではない遺伝子があれば色覚異常にはなりません。しかしXYである男性の場合は、その遺伝子があると色覚異常になってしまいます。このため色覚異常に男性が多いのです(伴性劣性遺伝=X染色体性劣性遺伝)*6

 さて、先天的な色覚異常が遺伝病であることは説明しました。遺伝子によって特定の色を見る視細胞がない、または弱いために特定の色の区別ができないということでした。そしてそういう病気であるということからいえることは、現時点では色覚異常が治すことのできない病気であるということです。話が遺伝子レベルである以上、遺伝子をいじらなければ治すことはできません。そして残念なことに、現時点での医療のレベルではこの問題を解決することはできないのです。


*1眼科オピニオン 色覚異常』P.267
*2先天青黄異常0.002〜0.007%。全色盲(定型杆体1色型色覚)0.003%(共に『先天色覚異常-より正しい理解のためのアドバイス-』P.53,54)
*3文部省の健康診断の結果をみると男性で3.5%〜4%、女子で0.2%弱。ただし学校での検査で行われる石原式検査は「疑わしい者」を検出する簡便な方法であるので、実際に色覚異常かどうかはわからない。またパスした者でも色覚異常ではないと言い切れない。
*4『色覚と色覚異常』P.185〜187。なお、これらのデータは『Defective colour vision ,fundamentals diagnosis and management』(R. Fletcher, J. Voke)を元にしている。こちらではP.193。
*5日本人男性の約3%が軽い(正確には軽度ないし中程度の)色覚異常という話もある(『色覚異常色盲に対する誤解をなくすために 改訂第3版』P101,102)。
*6赤と緑の視細胞に関する遺伝子のみ。青の視細胞の遺伝子は第7染色体にあるそうである。

ii-2.攻略法の作り方としてはどう扱うか?

 さて、これらを前提として『攻略法』を作る際に気をつける点ですが、人数や傾向を考えた場合、少なくとも赤ないし緑に対して何らかの障害を持っている人を考慮して作った方がよさそうです。もちろんできるならすべての人に見られるようにするのが一番です。

ii-3.対処の方法

ii-3.1.色だけで区別をさせない

 本文の5.3.【色だけで区別をさせない】でも述べましたが、とにかく色だけでの区別はさせない(色だけに特定の意味を持たせない)ことが大事です。形、飾り(斜線、点々、アミ掛け)、記号、配置、説明文などの補助的な手段を用いて色以外の方法で判断ができるようにすれば、たとえそれが見づらい色の組み合わせであっても、意味が伝わらなくなる可能性はぐっと低くなるでしょう。

ii-3.2.注意すべき配色

 しかたなく色で区別をするときには、基本的には彩度や明度の差をつけることで回避ができるようです(→▼ii-3.3.明度差を付ける参照)。またある程度は見えにくい色が決まっているので以下のことに気をつけて配色設計をするとよいでしょう。ただ、見えにくい色が決まっているとはいっても、実際にはかなり環境に左右されやすく(光源/周囲の明るさ/体調など)また個人差も大きいということです。

 ここからは書籍やサイトからの引用を中心に解説していきます。各書籍やサイトの詳しいデータについては参考文献を見てください。

【引用元サイト】『色盲の人にもわかるバリアフリープレゼンテーション法』(岡部正隆、伊藤啓)
「すべてのタイプの色覚に対応した表現方法の開発は極めて困難です。実用上、第3色盲の人に配慮しつつも、大多数を占める赤緑色盲への対応を優先することになりますが、限られた種類の色を区別させるのであれば、使用する色を工夫することで全てのタイプの色盲に対応が可能です。例えば、我々は赤と緑の色の組み合わせのかわりに、赤紫と緑の組み合わせを使うよう提唱しています。」
※その他の具体的な例に関してはWEBを参照。「第3色盲」とは先天青黄異常のこと。

 まずは限界を知っておきましょう。すべての色覚異常者に対応できるようなページを作ることは困難です。同じ赤色が見にくい人でも、見づらくなるような配色が誰でも同じというわけではなく、かなり個人差が出るということです。従って、理想はともかく個人で実際にウェブサイトを作っていくときにはある程度の割り切りが必要ではないかと思います。攻略法のように、さほど「表現」に突っ込まないときはまだ何とかできるようですが、そうでなければ何らかの決断が迫られそうです。

【引用元サイト】『色覚異常者に配慮したカラースライドとポスター作成についての提言』(村上元彦)
・青色と青色を基調にして図を作ること.文字や図は,簡単に大きく書き,あまり重要でない余計な情報を細字で書き込まない
・緑色の背景の上に赤色の文字や図を書かないこと.もちろん,この逆も避ける
・Magenta(深紅色)は使わない.(赤緑色覚異常者にとって,この色は灰色にしか見えません.)
・スライド毎に背景の色を変えないで,出来るだけ同じ色に統一する.(背景の色がめまぐるしく変わると,見ていて非常に疲れます.)

 これはスライドやポスターを作るときの例なので、ウェブでは直接関係するところは少ないのですが、場面を限定したり、またレイアウトなどに応用したりすれば、攻略法でも使えるところがでてくるでしょう。たとえば一番初めの「図」についての提言は図表を入れるときに必要になりますし、最後の背景に関しても対応ができるでしょう。ただし、他の人の攻略法を置かせてもらったりする場合は、なかなか統一のフォーマットでサイト全体を構築することは難しくなります。ですので、攻略法という単位では背景を意味もなく変えたりはしないようにしましょう。テンプレートを同じにするかCSSで統一的なフォーマットにすれば対応できることです。

【引用元書籍】『先天色覚異常の検査と指導-実地医科のために-』(視覚研究所/市川一夫/渡邊詔子/深見嘉一郎)P.3
・赤と緑と茶
・緑と橙
・ピンクと水色と白(灰色)
・赤紫と灰色(黒)と緑
・赤と灰色(黒)と青緑
【引用元サイト】『見え方の特徴 間違えやすい色の組み合わせ』(ぱすてる)
1.灰色←→水色 ・ ピンク←→灰色
2.黄緑←→黄土色
3.青緑←→灰色
4.薄い緑(レタスグリーン)←→肌色
5.こげ茶色←→深緑
6.赤←→緑
7.暗い緑←→暗い赤←→黒←→暗い緑

 この2つは具体的な実例です。これを見ると
・「緑系統」と「赤系統」(特に暗い赤と緑)
・「灰色」と「水色」
が、大まかにいうと一緒に使ってはいけない色のようです。

【引用元書籍】『色覚異常 色盲に対する誤解をなくすために 改訂第3版』(深見嘉一郎)P.50〜51
(1)灰色は、白の背景の上では橙、ピンクと誤られ、背景を黒にすると緑と間違える。
(2)茶色は、赤、緑、橙と間違えることが多く、背景の違いはあまり影響がないようである。
(3)紫色は一般に青とよく間違える。しかし時に、赤、緑と誤ることもある。
(4)橙色は赤とよく間違える。他に緑、黄という誤りもする。
(5)緑はあまり間違えないが、赤、橙、黄と誤りやすく、白背景の時によく橙に見えるようである。
(6)赤は間違えにくい色なのであるが、第一色盲の人が白背景上でしばしば黒または灰色と間違える。
※原著では丸数字であるが、機種依存文字にあたるので括弧付きの数字にしてある。また「第一色盲」は赤の視細胞に異常がある色覚異常である。

 こちらは上とは違って、色どうしの組み合わせで色の見え方がどう変わるかを書いています。こうした配色を背景色と文字色に設定してしまったとき、例えば(6)の「白が背景」で「赤の文字」の状態で『赤い文字のところをクリックしてみてください』と書いても通じないことがあるということです。ここだけでなく上の時もそうですが、色は色相環で見ながら考えた方がよい場合もあります。この色相環の歪み方に関しては『色覚異常者の見え方』のサイトを参考にしてください。

 このほかにも『カラーバリアフリー案内』、『色覚異常者の見え方(国立滋賀医科大学)』『色覚に障害を持っていたとしたら、あなたのサイトは見えるでしょうか ?』といったサイトも参考になるでしょう。『色覚異常に配慮した色づかいの手引き(ぱすてる書房)』は印刷物ではありますが、見づらい組み合わせをCMYKで表示してあり大変有用です。

ii-3.3.明度差を付ける

 先に説明したとおり、彩度や明度の差を付けることで混同を避けることができます。ただWEBセーフカラーにおいては、彩度の違うものは少ないのが実状です(約70%は同じ→iii-3.彩度から選ぶ参照)。そこで、ここでは明度差の付け方について解説します*

 コンピューター上では一般にRGBないしCMYKで色を表現しますが、この他にもHSV**で色を表す方法があります。HSVは、それぞれH(色相)、S(彩度)、V(明度)を示しますが、明度差を付けるといことは、このうちV(明度)の数値を大きくずらすということです。HTMLではHSVを直接指定することはできませんが、HSVで色を決めた後にRGBに変換して打ち込めばば、簡便に明度差を付けることができます。

 最近のHTML作成ソフトでは画像を扱うことができ、また色を設定する機能がついていますので、これらを使うことでHSVで色を決めることができるでしょう(少なくともホームページビルダーには実装されています)。それからHSVを表示できるソフトを使うことで、テキストエディタやこうした機能を持っていないソフトを使っている人も変換が可能になります。HSVを扱えるソフトには、インプレス系の本に付録としてついている『配色設定ツール(C_Maker)』、伊月めい氏作成の『HSV to RGB』(RGB,HSV変換可)、わたげ氏作成の『ColorDialog 003』(RGB,HSV,ESL変換可)などがあります。


*
 明度差を付ければ識別がしやすいということは様々な書籍やサイトにも書いてある。そこから普遍して論理的に考えればこういうことになるのだが、私の調べた限りどの書籍やサイトを見ても「V(明度)を変更することで対応できる」とは書いてないので確証はない。当然ながら具体的にどのくらい数字をずらせばいいのかも不明である。

 実のところ、「彩度や明度の差をつけることで回避できる」といった表現は初学者向けであったり簡便な言葉で書かれている柔らかめの資料には書いてあることがあっても、あまり学術論文や医学系のしっかりした作りの堅い資料にはでてこない表現である。そういうわけで「これさえ守っておけば大丈夫」というものではない。ただ、どうやら色覚異常の人の方が明度差や彩度差に敏感であることは確かなようなので、手間を掛けない簡便な方法の一つとして紹介しておく。

**ESL,HV/C,HSB,HSLなどとも表示するようである。厳密な定義ごとに言葉が変わってくるのであると思われるが、同様に扱ってもいいのではないかと思う。

 なおこの『攻略法の作り方』では右の表のように配色をしています。この表は主要な色について抜き出したものです。ここで特に注目してほしいのは背景色と文字色との明度の差です。

BODY(背景色) - P(文字色) =240-72=168
BODY(背景色) - H3(文字色) =240-72=168
BODY(背景色) - SUP(文字色) =240-120=120
BODY(背景色) - A:visited(文字色) =240-144=96
H2(背景色)-H2(文字色)=168-60=108

 正直どのくらい差があれば大丈夫なのかはわかりませんが、このくらいは明度差を作り出しているということで書いてみました。

 また、WEBセーフカラーと明度の関係についてまとめましたのでそちらについても参考にしてみてください。
iii.WEBセーフカラーと明度

タグ 要素 明度
BODY background-color FFFFFF 240
H2 border-color 000099 72
H2 color 000099 72
H3 color 000099 72
H2 background-color 66CCFF 168
H3 border-color 009999 72
P color 006699 72
B color black 0
STRONG color black 0
BLOCKQUOTE color black 0
A:link color blue 120
A:visited color 6633ff 144
A:hover color white 240
SUP color ff0000 120

ii-4.参考文献

ii-4.1書籍

先天色覚異常の検査と指導-実地医科のために-
 視覚研究所/市川一夫/渡邊詔子/深見嘉一郎 金原出版 1996年10月刊 \4,000+税 ISBN4-307-37041-4
 全ページカラー。図版も写真も多い。実際にどういうものが見づらいかの実例が多い。

先天色覚異常-より正しい理解のためのアドバイス-(コンパクト眼科学17)
 北原健二 金原出版 1999年12月刊 \4,000+税 ISBN4-307-90077-4
 シリーズものということでちょっと説明が簡略的。しかし押さえるところは押さえている。言葉による説明が主で色つきの図版は少なめ。

色覚異常 色盲に対する誤解をなくすために 改訂第3版
 深見嘉一郎 金原出版 1995年6月刊 \2,500+税 ISBN4-307-35085-5
 比較的読みやすい自称「通俗科学書」。先に挙げた『先天色覚異常-より正しい理解のためのアドバイス-(コンパクト眼科学17)』をもう少し広く深く書いたような感じ。

どうしてものが見えるのか
 村上元彦 岩波新書(新赤版413)  1995年10月刊 \650+税ISBN400430413X
 第8章がまるまる「色覚異常」の項になっている。

色覚異常に配慮した色づかいの手引き
 高柳泰世、金子隆芳 ぱすてる書房 1998年12月刊 \3,333+税 ISBN4938732459
 実践的にどのようにすればいいかということが実例を元に書いてある。

月刊『生物の科学 遺伝』1999年9月号(53巻9号)B5判 80頁
 裳華房 1999年9月刊 \1,100+税 雑誌01615-9 ISSN0387-0022

眼科オピニオン 色覚異常
 深見嘉一郎編集 中山書店 1998年刊 \4,500+税 ISBN4-521-55011-8
 様々な立場の人が様々な意見を書いている。対立しあう意見が一冊の本の中に混在しているところが特徴。

色覚と色覚異常
太田安雄, 清水金郎 改訂第2版 金原出版 1992年7月 \19,223+税 ISBN430735060X
 タイトル通り「色覚」について医学的な説明が入っているので、色について興味のあるものも読んでおいて損はないだろう。また先天色覚異常ばかりではなく、後天色覚異常についても述べられている。参考文献リストとしても有用。値段が示すとおり医学専門書である。

色覚と色覚異常 これだけは知っておきたい理論と実践
太田安雄, 清水金郎 金原出版 1999年.9月刊 \13,000+税 ISBN4307351002
 上記の『色覚と色覚異常』をさらに「わかりやすくコンパクトに」というコンセプトで作られたらしいが、それでも一般人が読むにはこれでも重い。医学専門書であるということを忘れてはイケナイ。

新臨床眼科全書第2巻A 眼機能学(1)
 市川宏 編 金原出版 1985年4月刊 \29,000+税(絶版) ISBN4307600657
 第4章が色覚の項になっており、その中で色覚異常についても触れられている。参考文献リストとしても有用。

Defective colour vision ,fundamentals diagnosis and management
R. Fletcher,J. Voke著 Adam Hilger 1985年4月刊 $164.00 ISBN: 0852743955
 リンク先はAmazon.comの紹介ページ。どうやら色覚異常の発生率はこの書籍が元になっているようである。

ii-4.2.WEB

『色覚の多様性と色覚バリアフリーなプレゼンテーション』岡部正隆、伊藤啓
 (第一回)『色覚の原理と色盲のメカニズム』(PDFファイル:約899KB/細胞工学 Vol.21 No.9 2002 P.733〜P.745)
 (第二回)『色覚が変化すると、どのように色が見えるのか?』(PDFファイル:約442KB/細胞工学 Vol.21 No.8 2002 P.909〜P.930)
 (第三回)『すべての人に見やすくするには、どのように配慮すればよいか』(PDFファイル:約1,003KB/細胞工学 Vol.21 No.9 2002 P.1080〜P.1104)

 私の知る限り、WEB上の日本語で見られる最良の資料。色覚異常(筆者の表現でいうところの「色盲」)に関する領域からコンピューターの色表現に関する領域までまとめられていて非常に今日的な内容である。ただもともとは細胞工学という学術雑誌に3回にわたって掲載されたものであるので、難しいところも多い(リンク先のPDFファイルに全文が載っている)。一回目は原理とメカニズムということであまり実践的なところは扱ってないので、実践的なものを求める人は第2回と第3回から見ていくといいだろう。

 同じ人たちが書いたものに『色盲の人にもわかるバリアフリープレゼンテーション法』があり、こちらにも具体的にどうしたらいいかの実例がある。

目の健康情報 遺伝性の目の病気社団法人日本眼科医会
 遺伝に関する詳しく簡単な説明がこの前の方のページで展開されているので参考にしてみるといい。

色覚問題に関する指導の手引き  平成元年3月 文部省(平成6年増刷版)
 学校で教師に配られている資料。

国立滋賀医科大学
 『色覚異常者の見え方』『色覚異常研究グループ
 後者は遺伝についての詳しい説明。

色覚異常者に配慮したカラースライドとポスター作成についての提言』村上元彦
 日本生理学会学会誌58巻9号からの転載。「青を基調とする」などの実践的方法が書いてある。

色覚に障害を持っていたとしたら、あなたのサイトは見えるでしょうか ?
MSDN Web Workshop 『More or Hess コラム アーカイブ』

視覚研究所『色覚異常を理解するために』
 書籍の方も参考のこと。WEBサイトは『先天色覚異常の検査と指導-実地医科のために-』のダイジェスト版みたいな感じである。『色覚異常者の見え方』など。

日本白墨工業(株)色覚異常について チョーク

『児童・生徒の健康状態(2-2)』文部科学省統計要覧
平成12年度版Excel'97版 / PDF版 / CSV版
 それぞれ内容は同じである。学校の身体検査でわかる色覚異常(の可能性のある人)の割合は男子で3.5%〜4%、女子で0.2%弱であることがわかる。

カラーバリアフリー案内

ぱすてる
色覚の問題を考えるボランティアグループ。『見え方の特徴 間違えやすい色の組み合わせ』はこちら。

目の事典Ocular.net/新見眼科
色覚
色覚異常についてのQ&A

WEBユニバーサルデザインガイドライン


#ゲームの攻略法には関係がないと思われるので、この『攻略法の作り方』では音声読み上げソフトへの対応は書かなかった。しかし一般のWEBサイトなどでは関係があるので興味のある方は個別に調べてみることをお薦めする。

参照本文

5.3.【色だけで区別をさせない】


<<戻る<< ▲TOP▲ ■フレーム化■
 >>次へ>> ■INDEX■ サイトマップ/索引/略語用語集
KO-1(myu-myu-myu@nifty.com)