Webサイトのデザインを制作する時、見やすさを考えることはとても重要です。
Zの法則とFの法則は、視線が無意識にしている動きのことなので、Webのデザインに取り入れると非常に効果的です。
この記事ではZの法則とFの法則について紹介します。
Webサイトのデザイン作成に悩んでいる方は是非参考にしてください。
伝わりやすいデザインは、Webサイトのユーザー数や売上にも高い確率で良い効果を与えるのでぜひ覚えておくことをおすすめするわ。
Zの法則って何？
まずは、Zの法則について説明していくわね。
Zの法則の使い方
Zの法則とは、人の視線がアルファベットの「Z」のように、左上→右上→左下→右下の順番に移動することです。
全体の概要をざっくりと把握できるので、初めてWebサイトを見る人はこのように目線を移動させることが多いです。
視線の順番は、画像のように左上→右上→左下→右下なので左上が特に目立ちます。
なので、左上には、重要な情報や一番見てほしい情報などを配置します。
例：サイトロゴ、企業名など
右上、左下、右下や、Zのライン上も目立つ場所なので、その他に見てほしい情報を配置します。
例：おすすめの記事、商品の画像、バナー広告、カテゴリのリンクなど
Zの法則はどんなページに使う？
先述した通り、初めてWebのページやチラシ、広告を見る人は全体をざっくり見ようと視線を「Z」に動かします。
Zの法則は以下のようなページで使用すると効果的です。
- Webサイトのトップページ
- 写真やイラストなどが多いページ
Fの法則って何？
やっぱり「F」の形に視線が動くんすか？
早速内容を説明していくわね。
Fの法則の使い方
Fの法則は、人の視線が画像のように左上→右上→下がってもう一度左→右→下がって以下繰り返し、とアルファベットの「F」のように移動することです。
リピーターやサイトをじっくり読む人はこのような視線の動きをします。
左から右に視線が動き徐々に下へ移動していくため、上部分の特に左側がよく見られます。
なので、Zの法則と同じく左上に重要な情報や一番見てほしい情報などを配置します。
そして、Fのライン上にその他の情報を配置します。
Fの法則はどんなページに使う？
ここでは、Fのページはどんなページで使うと効果的なのか紹介します。
Fの法則は、じっくり内容を読む人がする視線の動きなので、全体の文章量が多いページで活用すると効果的です。
具体的には以下のようなページで活用することをおすすめします。
- 商品の詳細ページ
- ブログなどの読み物系のコンテンツページ
その他の視線の動き方の法則
大きいものの方が視線を集めやすい
画像を見てみると、小さいオブジェクトより大きいオブジェクトの方が視線が向くのではないでしょうか。
画面上の面積比が大きいため、自然と視線が集まりやすくなるのです。
このように画像や文字の大きさを変えることで、視線を誘導することもできます。
人の向いてる方向に視線も誘導される
視線を誘導したいときは、人の画像を上手く使うことも有効です。
画像①のように視線をずらしていると、見ているユーザーも男性の視線の先へ目が行きます。
逆に画像②のように、こちらを見つめている画像はユーザーも画像の女性を見つめ返すことが多いです。
数字を利用する
画像のように情報に数字を振り分けると、視線も数字に誘導されます。
数字を振り分けておけば、デザインが多少バラバラでも順序を示すことができます。
副業に興味あるけど一歩が踏み出せない方必見！
初めてでも安心して副業ができる方法
副業や兼業を認める企業が増えた現代、「自分も何か初めて副収入を得たい！」と考えたことはありませんか。実際、本業と同じ額とまでは行かなくても月3~5万円くらいの副収入をすきま時間で得ている人は増えています。
しかし、実際に副業を始めようとしても
「興味はあるけど何からすればいいのかよく分からない」
「特別なスキルがないと副業できないのでは？」
「本業と両立できるか不安…」
という悩みを持ったことはありませんか。
何事も新しく始めてみるのはエネルギーが必要になりますよね。
なるべくサクッと始めることができれば、副業に対する不安や疑問も軽減できるかもしれません。
そこでおすすめなのが、業界でも最大手のクラウドソーシングサイト「CrowdWorks（クラウドワークス）
在宅で一日１時間〜２時間程度の案件や、未経験でもスキルを積ませてくれる案件など、まさに副業初心者にうってつけの仕事が多く掲載されています。
もちろん、月30万円以上などの高単価案件も多くあり、「まずはすきま時間で簡単にできる案件から初めて、スキルを積み上げて自身が付いたら単価の高い案件にも挑戦していきたい」と考えている人にぜひおすすめです。
おすすめポイント
- 未経験者・スキルのない人でも副業ができ経験も積める！
- 200種類以上の仕事が掲載されているため自分に合う副業を見つけやすい！
- 本業をしながら無理なくすきま時間で稼げる！
- 家事・子育てをしながらでも月5万円のお小遣い稼ぎができる！
- 地方・在宅でも働ける案件が多く多い！
CrowdWorksは、無料登録をしてからすぐに副業を始められます。
登録・退会にお金はかからないので、とりあえず登録して案件をチェックしてみるのもありでしょう。
CrowdWorks
まとめ：人の視線の法則を理解しよう！
今回のポイントまとめ
- Zの法則Webサイトのトップページや画像の多いページで使うと効果的
- Fの法則は商品の詳細ページや文章量の多いページで使うと効果的
- 大きさや数字など視線を動き方に影響を与えるものがある
またこの他にも、デザイン関連の記事を執筆していますのでぜひ参考にしてください。
