第248回:自社のHPが分かりづらいと思ったら「視線の流れ」をセルフチェックするとよいかもしれない

ラウンドナップWebコンサルティングの中山陽平です。

このPodcast/書き起こしで得られること(要点)

  • ホームページが分かりづらく見える時、視線の流れを疑うべき理由が分かる。
  • 顔写真の向きや文字配置が、読む順番や見てもらいたい場所に大きく影響すると理解できる。
  • 専門家でなくてもできる、視線の流れのセルフチェック方法をつかめる。
  • きれいに作ることより、伝わることを優先して自社で調整していく姿勢が大事だと分かる。

見づらさの正体は、視線の流れの詰まり

この回で取り上げられているのは、ホームページやバナーを見た時に「何となく分かりづらい」「あとから見返すと、こんなところに大事な情報があったのか」と感じる原因です。そのかなりの割合が、視線の誘導を意識していないことにある、というのがこの回のお伝えしたいことです。見た目の好み以前に、そもそも見てほしい場所へ目が流れていないと、情報は届きません。

読ませたい場所に目が行っていない

人は画面の中を均等には見ません。どこかで引っかかり、どこかを飛ばし、無意識のうちに読み方を決めています。だから、問い合わせボタンや大事なメッセージがあるのに見てもらえない時は、内容より前に、そこへ目が動く設計になっているかを疑った方がいい、という話になります。

まず効くのは人の顔と目線

視線の流れを考える時に、特に分かりやすいのが人物写真です。

人は顔の向きを追ってしまう

人の顔があると、見る側はその目線の先を追いやすくなります。右を向いていれば右側を見たくなるし、上を向いていれば上側へ意識が行く。これはかなり無意識に起きる反応なので、素材として人を置くなら、その向きは軽く考えない方がよいというのがこの回の具体的なポイントです。

文字や案内は目線の先に置く

たとえばメッセージを読ませたいなら、その人物の目線の先にメッセージを置く。お問い合わせへ目を持っていきたいなら、その方向へ自然に流れる配置にする。集合写真でも、どこを見ているかで画面の印象はかなり変わります。写真を置いて終わりではなく、どこへ連れていく写真なのかまで考える必要があります。

自分でできるセルフチェック

この回の面白いところは、専門的な測定機器がなくても、ある程度のチェックは自分でできると話している点です。

目を閉じて、ぱっと開いた瞬間を見る

ホームページを表示した状態で、一度目をぎゅっとつぶってから、ぱっと開く。そうした時に自分の視線が最初にどこへ行くかを見てみる。これを何度かやると、自然と吸い寄せられる場所や、逆に見えていない場所が分かってきます。人物写真があるページなら、目の位置に引っ張られている感覚もかなりつかみやすいはずです。

第三者の目で止まる場所を探す

さらに、自分たちだけでなく何人かで見てみると、「ここで止まる」「ここから下は広告っぽく見える」「この見出しで流れが切れる」といった癖が拾いやすくなります。ヒートマップのような大げさな話の前に、自分たちでできる観察だけでも改善の手がかりは十分見つかります。

止まるデザイン、流れるデザイン

視線の流れは、写真だけではなく、細かな要素でも変わります。

線、色、揃え方で読み方が変わる

真っ黒な横線が強すぎると、そこで目が止まって下へ流れにくくなることがあります。中央揃えがいいのか、左揃えがいいのかも、読ませたい流れによって変わります。濃い背景に白文字が合う時もあれば、画像っぽく見えて中身が読まれにくくなる時もある。つまり、デザインの正解は見た目の好みではなく、どう読ませたいかで決まってくるわけです。

作り込みすぎが逆効果になることもある

この回は、きれいに作りすぎると親近感や信頼感を落とすことがある、という最近の感覚にもつながっています。特に中小企業のサイトでは、人がちゃんと更新している感じや、等身大の空気が見えた方が反応につながる場面もあります。だから、ただ整えるのではなく、伝えたい空気まで含めて調整する必要があります。

ホームページを自分たちの手に取り戻す

この回の底に流れているのは、ホームページを専門家任せで終わらせず、自社でも触り、更新し、調整していくべきだという考え方です。

専門家任せで終わらせない

もちろん、土台づくりや専門的な助言は重要です。ただ、デザインは専門家が言う通りにしておけばよい、と考えすぎると、自社の伝えたいものとずれたまま進みやすくなります。見る側の違和感は、作る側より当事者の方が先に気づくことも多い。だからこそ、自分たちでも遠慮せず見づらさや止まり方を観察してよい、というメッセージが入っています。

等身大の発信が信頼につながる

最終的には、会社とお客さんが等身大でつながり、信頼を積み上げることが大事だとこの回は語っています。見た目を整えることが目的ではなく、伝わること、読み進めてもらえること、自分たちの空気がきちんと届くことが目的です。その意味で、視線の流れを整えることは、単なるデザイン論ではなく、コミュニケーションの話でもあります。

まとめ:視線の流れを整えると、伝わり方が変わる

この回が伝えているのは、ホームページの分かりづらさは、センスの問題だけではなく、視線の流れを整えることでかなり改善できるということです。顔の向き、文字の置き方、線や色の強さ、余計な装飾の有無。そうした要素を、自分たちでも観察しながら調整できる時代になっています。きれいに作ることより、相手に自然に読んでもらい、伝えたいことへ導くことを優先する。その発想が、サイト全体の伝わり方を変えていきます。

配信スタンド

■Podcast /Webinar への質問は

こちらのフォームへどうぞ。
https://forms.gle/Lvy4nVauyJ2SRhJM7

運営・進行

株式会社ラウンドナップ(ラウンドナップWebコンサルティング)

代表取締役・コンサルタント 中山陽平

Webサイト:https://roundup-inc.co.jp/

[無料週間メルマガ] Webコンサル通信 - 中小企業に活用に役立つヒント・トピックスをお届け
このホームページをフォローする
中小企業専門WEBマーケティング支援会社・ラウンドナップWebコンサルティング(Roundup Inc.)