Webサイトで抑えておきたい、3つの重要なレイアウトパターン
Webサイトのレイアウトで必ず抑えておきたいパターンが以下です。
レイアウトというよりかは、サイトの閲覧者が どうやって、サイト上を見ているかを分析すると 大抵は、上記の3つになります。
人の目の動きを意識して、 ボタンや画像を置くことでコンバージョンを少しでも 高めるヒントになると思います。
グーテンベルク・ダイヤグラム
あまり、きいたことが無いような名前なのではないでしょうか。
こちらのように、左上から右下に向けて1直線の動きです。
このような動きになるのは、スクロールなしで全体が見渡せるページに多く
均等に文章が表示されている場合にこのような動きになります。
本などの斜め読みを意識するとわかりやいと思います。
Zパターン
読んで字のごとく、Zの書き順のような動きです。
多くの場合、左上にタイトルや画像があり視点が集中します。
そこから、右に読んでいき、
次のタイトルやアイキャッチの画像めがけて右上から左下へと移動するパターンです。
そして、また右に読んでいくと
Zパターンになります。
このZパターンになりやすいのは、上記した、グーテンベルク・ダイヤグラムの様な斜め読みができないパターンの時や、 適度にタイトルが入っている時にこの動きになります。
Fパターン
こちらも読んで字のごとくFの書き順の様な動きです。
こちらは、THE 流し読みパターンです。
縦にスクロールしながら、タイトルだけ目で追っていくような感じになります。
Fパターンだと、ちゃんと文章が読まれない時にこの動きになります。
一般的なWebのパターンでは比較的この動きが多くなります。
まとめ
着目するところは、右下です。
グーテンベルク・ダイヤグラム,Zパターン 共に右下にたどり着きます。
ここに目立つようにコンバージョンさせたいボタンを置くことで コンバージョン率改善のヒントになるのではないでしょうか。
