サイトレイアウトってどうすればいいの?視線の動きを取り入れて決めよう!

目安時間:約 5分

この記事を読むと分かること

人の視線の動きが分かります

視線の動きに合わせたブログレイアウトが分かります

 

人の2つの視線の動き

 

ヒトの視線の動きには2種類あって、

『F字型』『Z字型』があります

 

どっちか一方だけの見方をしているというわけではなく、

用途によって上手に使い分けています

 

サイトを見るときに一度意識をしてほしいんですが、

 

  • じっくり読むときは『F字型』
  • 流し読みするときは『Z字型』

 

で見ているはずです

 

じっくり読むときは内容に意識が集中するので、

記事の文章を追った視線の動き=『F字』

 

流し読みするときは全体を把握しようとするので、

上下左右を見渡す動きになります

このとき円形にグルグル見ることはないです

 

文章の羅列に合わせて左右を見て

全体を見るために上下に大きく振れます=『Z字』

 

この視線の動きから何が言えるかというと、

僕らの視線は画面の左に集中しています

 

だから画面の左に見て欲しいものを置くのが、サイトレイアウトの基本です

 

サイトレイアウトに合ったサイドバーの数

 

サイトレイアウトを気にするとき必ず出てくるのが、サイドバー

 

サイドバーは記事の左と右に置くことができて、最大2つまで設定可能です

用途はサイトのメニュー表示・サブコンテンツに使われています

 

現在のブログの主流は2カラムと呼ばれていて、

右もしくは左に1つのサイドバーを持つレイアウトです

 

昔は情報量が多いブログが人気だったので、

3カラム(左右に1つずつサイドバー)のブログが主流でした

今でも情報量を売りにしているブログは3カラムのものがありますが、

正直見づらいです

 

近年では見づらさが結構な敵で、見づらいと読者はすぐに去っていきます

同じ内容なら、綺麗でさっぱりしている方が見たい

 

ゆえに3カラムは上手に使わないと見づらくなりやすい

くわえて先ほどの視線の動きの話を入れると、2カラムがベストとなるわけです

 

 

見て欲しいのは記事かサイドバーか?

 

では2カラムに設定したとして、サイドバーはどっちに置くべきなのか?

 

まずアナタが見て欲しいものは何かを考えましょう

読者に見て欲しいのはサイドバーにあるコンテンツなのか?

それとも表示されている記事の方なのか?

 

それともう一つ、逆の立場も考えてみましょう

たとえばアナタが今ここに検索エンジンから飛ばされてきたとして、

アナタは何が見たくてここに来たのか?

 

こっちは間違いなく、記事ですよね

一体何が書いてあるのか?

僕に役立つ内容なのか?

それが見たいから検索エンジンから飛んできたわけで

決してサイトのレイアウトが見たいわけではない

 

僕もそうですが、多くのサイトが記事を見て欲しい

サイドバーとかオマケだと思ってます

 

だから僕らは2カラム右サイドバーを採用しています

 

もちろんこれが正解とかそういう話ではありません

アナタが何を優先したいのか考えてレイアウトを決めてみましょう

 

まとめ

人は『F字』『Z字』型でサイトを見ている

視線の動きに合わせると『2カラム右』が合理的

 

以上、『サイトレイアウトってどうすればいいの?視線の動きを取り入れて決めよう!』でした

この記事に関連する記事一覧

コメントフォーム

名前

メールアドレス

URL

コメント

トラックバックURL: 

ページの先頭へ