「見た目がいいサイト」は研究でどう決まる？ 単純さ・典型性・色
見た目がいいと感じられるサイトは、「単純で、よくある配置」でした。約4万人に約240万回サイトを評価してもらった研究では、好む色の量と複雑さが、国・性別・学歴で違うこともわかっています。
3行でわかる
- 見た目の好みは一瞬で決まり、単純でよくある配置のサイトほど好まれた
- 好む色の量と複雑さは人で違う。国・性別・学歴で好みのピークがずれた
- 見た目は「単純さ」と「多様さ」「色」「作りの丁寧さ」に分けて考えられる
確かさ: A 確か＝メタ分析・大規模な再現・長く再現されてきた法則があり、効果があること自体が確か／B 条件しだい＝場面で結果が変わる・争いがある（基準）。
01 使える原則見た目がいいサイトの条件は？
単純さとよくある配置（典型性）は、くり返し出ている。色の量や複雑さの好みは、人によって変わる（B）。
| 原則 | わかっていること | 確かさ |
|---|---|---|
| 単純さ | 見た目が複雑でないサイトほど、第一印象の評価が高かった | B 条件しだい |
| よくある配置 | 典型的な配置（ロゴは左上・メニューは上など）のサイトほど、評価が高かった | B 条件しだい |
| 好みは人で違う | 好む色の量と複雑さは、国・性別・学歴で違った（例: 女性はカラフルなサイトを、ロシアの人は複雑さの低いサイトを好んだ） | B 条件しだい |
| 見た目の4つの面 | 見た目の評価は「単純さ」「多様さ」「色」「作りの丁寧さ」の4つに分けて測れる | B 条件しだい |
| 見た目がよいと使いやすく感じる | 見た目の評価が高い画面ほど、使った後も使いやすいと感じられた | B 条件しだい |
02 どうやってわかったのかどうやって調べた？
サイトの画面を一瞬だけ見せて評価してもらう実験を、オンラインで大勢に行った。
B 条件しだいReinecke & Gajos（2014、CHI）[1]
約4万人の評価で、見た目の好みが最も高くなる色の量と複雑さは、人によって違った。国・性別・学歴で好みのピークがずれた。
どうやって: 研究用のサイトで、ウェブの画面を一瞬だけ見せて好みを評価してもらった（約240万件の評価）。
B 条件しだいTuch ほか（2012、International Journal of Human-Computer Studies）[2]
見た目の複雑さが低く、典型的な配置のサイトほど、第一印象の評価が高かった。
どうやって: 複雑さと典型性を変えたサイトの画面を、短い時間だけ見せて評価してもらった。
B 条件しだいMoshagen & Thielsch（2010、International Journal of Human-Computer Studies）[3]
サイトの見た目の評価は「単純さ」「多様さ」「色」「作りの丁寧さ」の4つの面に分けて測れた。
どうやって: 多くの人にサイトを評価してもらい、評価の項目のまとまりを統計で調べた。
03 作るときの当て方どう作ればいい？
単純にして、よくある配置を崩さず、色は少なめに。読み手に合わせて調整する。
要素を減らす
1画面に置く物を減らし、余白を取る。飾りを足さない。
よくある配置を崩さない
ロゴは左上、メニューは上、大事なボタンは目に入る所に。
色は読み手に合わせて
好む色の量は人で違う。迷ったら基本の色と目立たせる色1つに絞り、目立たせる色は要所だけ。
読み手に合わせる
好む複雑さは人で違う。誰に向けたサイトかで、情報量を変える。
丁寧に仕上げる
そろっていない余白・ずれた文字は「作りの丁寧さ」の評価を下げる。
第一印象・迷わなさの原則は、ウェブサイトに使える10の原則にまとめた。
04 使わない説よく聞くけれど使わないのは？
決まった色や流行の飾りで「見た目がよくなる」という説は使わない。
| よく聞く説 | 判定 | 研究では |
|---|---|---|
| この色にすると購買率が○%上がる | 根拠なし | 色の受け取り方は文化・商品・文脈で変わり、決まった数字を支える研究は見つからない |
| 流行の飾り（ぼかし・光・グラデーション）を足すと良く見える | 言い過ぎ | 研究で好まれたのは単純さとよくある配置。飾りは複雑さを上げうる |
05 まだわかっていないことまだわからないのは？
研究の多くはパソコンの画面で、スマホの縦長の画面で同じかは確かめられていない。
- スマホの画面での好みパソコンの横長の画面で測った研究が多く、スマホで同じ傾向になるかはわかっていない。
- 日本の人の好み国で好みが違うことはわかったが、日本の人に合う程度を決めるほどの研究は少ない。
06よくある質問
見た目がいいウェブサイトの条件は？
研究では、見た目が単純で、よくある配置のサイトが好まれました（Tuch ほか 2012）。好む色の量と複雑さは、人によって違いました（Reinecke & Gajos 2014）。
サイトの色は多いほうがいいですか？
決まった答えはありません。約4万人の研究では、好む色の量は国・性別・学歴で違い、たとえば女性はカラフルなサイトを好む傾向がありました（Reinecke & Gajos 2014）。
見た目は使いやすさに関係しますか？
見た目の評価が高い画面ほど、使った後も使いやすいと感じられたという研究があります（Tractinsky ほか 2000）。
出典
- Reinecke, K., & Gajos, K. Z. (2014). Quantifying visual preferences around the world. Proceedings of CHI 2014, 11–20. doi:10.1145/2556288.2557052
- Tuch, A. N., Presslaber, E. E., Stöcklin, M., Opwis, K., & Bargas-Avila, J. A. (2012). The role of visual complexity and prototypicality regarding first impression of websites. International Journal of Human-Computer Studies, 70(11), 794–811. doi:10.1016/j.ijhcs.2012.06.003
- Moshagen, M., & Thielsch, M. T. (2010). Facets of visual aesthetics. International Journal of Human-Computer Studies, 68(10), 689–709. doi:10.1016/j.ijhcs.2010.05.006
- Tractinsky, N., Katz, A. S., & Ikar, D. (2000). What is beautiful is usable. Interacting with Computers, 13(2), 127–145. doi:10.1016/S0953-5438(00)00031-X
- Lindgaard, G., Fernandes, G., Dudek, C., & Brown, J. (2006). Attention web designers: You have 50 milliseconds to make a good first impression! Behaviour & Information Technology, 25(2), 115–126. doi:10.1080/01449290500330448