※回答一覧

 出題者   カテゴリ   作成日

坂本　邦夫		 ユーザビリティ・デザイン担当 2016-08-30 13:43:24
 問題   ヒント   回答数 
■すべての人に文字を読みやすくするために考えておきたいこと

みなさん、こんにちは。ユーザビリティ・デザイン担当の坂本です。

台風が連続して発生して被害も多く出ているようですが、みなさまのところは大丈夫でしょうか。
地球温暖化のせいなのかはわかりませんが、年々今までの夏とは違うような気がしていて、心配になったりしています。気候はともかく、体の疲れ具合は体力の衰えのせいなんだろうなぁと思いつつ、暑さに負けて特に何もしていないわけなので、ご飯が美味しい秋が待ち遠しいところです。

それでは今回の課題に行ってみましょう。

世界保健機構(WHO)などの定義では、65歳以上の高齢者が7%を超えた社会を「高齢化社会」、14%を超えた社会を「高齢社会」、21%を超えた社会を「超高齢社会」とされています。日本では2007年に21.5%を超えており、超高齢社会に突入して10年が経とうとしています。また人口の減少も問題になっており、今後もこの傾向が変わることはないと考えられます。

そのような中で2016年3月22日には、JIS規格「高齢者・障害者等配慮設計指針-情報通信における機器,ソフトウェア及びサービス-第3部:ウェブコンテンツ(JIS X 8341-3:2016)」が公示され、4月1日には「障害を理由とする差別の解消の推進に関する法律」(障害者差別解消法)が施行され、より多くの人が見られるwebサイトの制作が強く求められています。

今回は「視覚」で情報を取得するための、文章と文字の色について考えてみましょう。
下の画像のA,Bをご覧ください。

http://webtan-tsushin.com/wp-content/uploads/2016/08/67b8aceed3c4f5d8a409bb2b9a9815bc.png

Q1.　白(#FFFFFF)と黒(#000000)を使ったAの2つの文章のうち、読みやすいと感じるのはどちらでしょうか?　その理由も教えてください。

Q2.　白(#FFFFFF)とグレー(#777777)を使ったBの2つの文章のうち、読みやすいと感じるのはどちらでしょうか?　その理由も教えてください。

「どちらとも読みやすい」「どちらとも読みにくい」のような回答でも構いませんが、その場合にはどちらの方が好みであるかをお答えください。		 4

 

メンバーの回答一覧　お疲れ様でした！
※講師コメント詳細は冊子に掲載されています。

なるほど
票数		 回答 講師コメント
1 awk
[Q1]
左の文章の方が読みやすいです。
※問いにはありませんが、Aの右よりBの右の方が読みやすく感じるのは意外でした。
　コントラストがキツ過ぎて読みにくいのか、フォントが細いからなのか…。

[Q2]
右の文章の方が読みやすいです。
ただ、右がとても読みやすいということではなく、左の本文が薄く読みにくいです。

どちらにも言えることですが、フォントの太さと大きさ、行間を調整すれば、
配色は同じでも読みやすさの結果は変わってくると思います。		 銀 (坂本　邦夫)
ご回答いただいたように、フォントのサイズや太さによって、見え方は変わってきます。実は既に皆さんの閲覧環境はまちまちで、デスクトップの大型のモニタで見ている方と、ノートパソコンで見ている方では実際に見えている大きさが違います。 私が今原稿を打っているノートパソコンの11インチのモニタでは、課題の画像は約15cmのサイズで表示されていますが、27インチのモニタで見ると約19cmとなっています。 またノートパソコンとデスクトップパソコン、あるいはスマートフォンやタブレットなど端末によって画面への距離も変わってきます。 ぜひ課題に回答していただいた環境と異なる環境で画像をチェックしてみてください。
0 yamataco
Q1.　左のほうが読みやすい。
右側のように、背景色を黒で白字にしたときに字が細いと、漢字など画数が多い文字の場合かすれたように見えて読みづらいため。

Q2.　どちらも読みづらいのですが、どちらかと言えば右のほうが読みやすいです。
グレーと白だとコントラストがはっきりしていないので読みづらく感じるのではないかと思います。		 金 (坂本　邦夫)
仰るとおり、グレーと白の組み合わせが基本的にコントラストが低くなり、多くの環境で読みにくくなるのが基本です。 ただご指摘のようにコントラストが高すぎても、Q1の右側のように見えにくくなることもあります。特に画数が多い場合での見え方は鋭いご指摘で、これはコントラストが高いときほど生じる現象です。 Q2ではどちらも読みにくいという回答でしたが、他の環境で見た場合はどうでしょうか？ もっと読みにくくなるかもしれませんし、あるいは読みやすくなることもあるかもしれません。
0 フジダイ
Q1.白と黒の場合は、白い背景のほうが読みやすい。(左)

コントラストがはっきりしていて、黒が多いと目にきつく感じます。
また、白い文字は、黒い背景で少しつぶれて見える気がします。

Q2.白とグレーの場合は、グレー背景のほうが読みやすい。(右)

グレーの文字は白い背景だとぼやけて見えます。		 銅 (坂本　邦夫)
同じ色の組み合わせであっても、文字と背景が入れ替わるだけで読みやすさが変わりますし、同じ白背景であっても、そのコントラストによっても見えやすさが変わるのを感じていただけたかと思います。 このような見え方の差は、一般的には文字が小さい場合に顕著に表れます。また今回は印刷のこともあり、白・黒・グレーの3色で課題を作成しましたが、カラーになるとまた事情も変わります。
0 YN
Q1: 左の方が読みやすいです。
理由 - 見出し部分と本文の背景色とテキストの色が反転しているため、テキストの強弱が分かりやすいです。また、単純にフォントサイズの小さいテキストは、黒地に白抜きだとつぶれてしまって読みにくいです。

Q2: 第一印象は、左の方が読みやすいと感じました。Q1の理由と同様、強弱があり見出しと本文の違いが明確で分かりやすいです。

一方で、ディスプレイモニターの輝度を上げた場合、白色部分が強調されるせいか、本文については(フォントサイズの小さいテキスト)は右の方が読みやすいと感じました。		 注目 (坂本　邦夫)
見出しで概要を把握し、その上で本文を読み進めていくという流れの中でも特に重要です。文章の読みやすさは、文字の色だけではないことに言及していただきました。 モニタの輝度を変えてご確認いただいたということで、それぞれの環境によっても見え方が変わるということにお気づきいただけたかと思います。 同じコンテンツであっても、環境やその人のとらえ方によって読みやすさが変わることがわかります。大変興味深い回答をありがとうございます。