インターン17日目

みなさまこんにちは!ハシバです。インターシップ本日を入れてあと2日です。本当にあっという間の1ヶ月でした~自身のポートフォリョサイトのアップロードはできたのですが、まだまだやりたいことが残っていますので最終日までやりきります!!就職活動も同時進行で行っているのですが、求人サイトを見てまだまだ知らない企業、業界があることに驚いています。WEB制作会社だけでもホントに多くありますね!!就職活動も頑張るぞ~

さてさて、本日は「視線移動の法則」について記事を書いていきます。ちょっと硬いタイトルですが、内容はシンプルになっていますので最後まで読んでいただければと思います。

Zの法則

Zの法則はとても有名な法則ですね!WEBサイト以外にも紙媒体にもよく使用されています。Zの法則とは読んで字のごとく人の目線がWEBサイトや紙媒体を見るときに「Z」の順で無意識に見ているという法則です。

目線の順番は左上→右上→左下→右下の順に動いていきます。

いくつかサイトを見てみたのですが、多くのWEBサイトでZの法則は使われています。WEBサイトを見てみると左上に企業名やロゴが配置してあり、右上にナビゲーションが配置してある組み合わせが多いです。この位置に配置することで企業名やナビゲーションなどの情報が自然に入ってきます。

また画像やイラストが多いときはZの導線上に画像やイラストを配置することで効果的に情報を伝えることができます。サイトのデザインを考えるときのはZの法則意識して制作しましょう!

Fの法則

Fの法則はWEBサイト特有の法則です。(恥ずかしながら知りませんでした)

目線の順番は左上→右上まではZの法則と一緒です。次にFの文字のようにページ下部に下りて左→右の繰り返しになります。

最初はZの法則でで全体を見て、Fの法則でサイト下部に降りていくことが多いそうです。Fの法則はブログやニュースなど文章が多いときに使用すると効果的です。当ブログのTOPページもまさにFの法則が使われています。伝えたい情報が多いときにはFの法則をうまく活用してデザインを考えましょう。

大きい物から→小さい物

他にも視線移動の特徴として大きい物→小さい物の順で視線移動していきいます。ブログやニューズ欄などでよく見かけます。

見出しを見て→本文の順で見ていきます。確かに、なかなか本文から読まれる方はいないと思います。文章にするとすごく当たり前なことに感じますが、目で見て当たり前に感じさせることがとても重要なことだと思います。

WEBサイトはページの離脱が非常に早いです。ちょっと見にくかったり、探している情報の場所がわかりにくいとすぐに別のサイトに行ってしまいます。ページ離脱を防ぐためには知りたい情報をスムーズかつわかりやすく伝える必要があります。そのためには視線移動の知識も必ず必要になるので、デザイン性も大事ですが視線移動のこともしっかり考えてサイトデザインをしていきましょう!

まとめ

普段自然に見ていることですが、調べてみると面白いですね。WEBサイトを見るときに視線移動に注意してみるといつもと違った発見がありとても勉強になります。WEBサイトを作る上で情報をわかりやすく伝えることは非常に重要なことなので、Zの法則、Fの法則などの視線移動についてしっかり勉強していきます!!

ちなみに・・・・心理学的には話をしている相手の目線が左上の時は過去のことを思い出していて、右上の方を見ているときは新しいことを考えたり想像をしているらしいです。