セブンデザイン 成果を追求した大阪のホームページ制作会社

  • 2023.09.29

視線誘導の法則とは?訪問者が理解しやすいホームページに必須

ホームページを閲覧しているユーザーは、上から順番にページの内容を読んでいるわけではなく、一定のルールに基づいて、コンテンツを閲覧しています。

ユーザーが行う一定の閲覧ルールのことを視線誘導と言い、視線誘導を理解して、ホームページ制作の企画やワイヤーフレーム、デザイン作成を行うことで、ユーザーに重要なポイントを読んでもらいやすいホームページへと成長します。

当ページでは、ホームページの視線誘導とは何かや、視線誘導の法則について紹介します。

ホームページの視線誘導とは?

ホームページの視線誘導とは、ユーザーがコンテンツを閲覧するときのルールです。

訪問者が上から順番にコンテンツを見ていると考えてしまうと、コンテンツの優先順位を間違えてしまい、掲載場所がユーザーの理想と異なってしまうので、ホームページの成果を十分に発揮しづらくなってしまいます。

そのため、成果が出るホームページを制作したい方は、視線誘導を理解しなくてはならず、ユーザーの視線に合わせてコンテンツを配置することで、最大の成果を実現できるようになります。

この視線誘導は難しい内容になっておらず、視線誘導には、3つの法則が存在しているので、その法則を理解するだけで充分に高い効果を発揮できます。

では、視線誘導にある3つの法則について紹介します。

視線誘導の3つの法則

Zの法則

ホームページの視線誘導でもっとも有名なのがZの法則です。

アルファベットのZの形に沿って訪問者の視線が動くので、左上から右上、左下、右下の順番に重要なコンテンツを配置することで、ユーザーが読みやすいと感じるホームページへと成長します。

Zの法則は、もともとはホームページではなく、チラシやパンフレット、ポスターのデザイン作成で利用されていた視線誘導の法則になっており、今なお代表的な視線誘導の法則と言えるでしょう。

Fの法則

知名度としては、少し低くなりますが、現在のホームページでは、Fの法則を考えることが一般的です。

Fの法則では、左上から右上、少し下がり左から右へとユーザーが閲覧していることを想定したコンテンツ配置を行うことで、ユーザーにとって読みやすいホームページへと成長します。

お客さまが想定するホームページの閲覧方法として、もっともオーソドックスな考え方ですが、Fの法則を理解しているといないでは、コンテンツの配置場所に大きな差が生まれるので、最低限の知識としてFの法則を理解していく必要があります。

ちなみにFには、左上から左下への縦線もありますが、Fの法則では気にしなくて良いでしょう。

Nの法則

これまで多くのホームページ制作で提案をしてきましたが、Nの法則をご存じだったお客さまは、ほぼ0になっていました。

Nの法則では、右上から右下、左上、左下へとユーザーが閲覧することを想定したコンテンツ配置を行うことで、スムーズに重要なコンテンツを閲覧してもらうことが可能です。

Nの法則は、雑誌や書籍で利用される視線誘導の法則です。

手軽に訪問者の視線を操作するWebデザインのポイント

文字サイズを使う

オーソドックスな対策法ですが、文字サイズを使うことで、訪問者の視線を操作することができます。

ホームページで利用されている通常の文字サイズよりも大きくすることで、自然とユーザーは大きな文字サイズに視線を向けてしまいます。

ホームページによくある事例として、見出しの文章を本文よりも大きなサイズにして、上部の文章に飽きたユーザーの視線を見出しに向けることで、離脱される可能性を下げる対策法があります。

また、ホームページによっては、重要な数字や文章を大きく表示させて、ユーザーの視線を重要な文章に向ける対策を行うこともあります。

色を使う

重要なコンテンツだけに、目立つ色を使うことで、訪問者の視線を操作することができます。

ホームページでよくある事例は、グローバルナビゲーションの問い合わせだけ色を使うことで、ページを開いた訪問者が自然と問い合わせへのリンクがあることを認識させる対策です。

ホームページに訪問してすぐにグローバルナビゲーションから問い合わせページへと移動してくれるケースはありませんが、色を使いユーザーの視線を向けることによって、ページを読み終わったユーザーが、どこに問い合わせページへのリンクがあるかを記憶している可能性が高くなります。

色なら何でも良いわけではありませんが、Webデザインとのバランスを考えた色を使うことで、訪問者の視線を操作することが可能になるので、ホームページの成果数を高める対策として利用が可能です。

円を使う

訪問者は円の形をしたデザインに視線を向けてしまう傾向があります。

ホームページでよく見る事例としては、重要な数字を円の中に入れてユーザーが数字を見落とさないようにしたり、特徴コンテンツで円の中に特徴の文章を作成する対策法です。

当社のホームページ制作で利用頻度が高いのが、トップページのメイン画像内で円を使い、その企業の魅力を打ち出す対策法になり、メイン画像内は多くの要素が存在するので、円を利用する効果は高くなっています。

もちろん、訪問者の視線を操作したいからと言って、なんでもかんでも円の中にコンテンツを配置すると、効果が薄れる恐れがあるので、Webデザインとのバランスが重要になります。

まとめ

視線誘導とは何かや、3つの法則を紹介しました。

視線誘導においては、どのようなレイアウトやデザインのホームページを制作するかによって、使い分けることが大切です。

一般的なコーポレートサイトであればFの法則になり、チラシっぽいのであればZの法則、雑誌っぽいのであればNの法則を利用することで、ユーザーが読みやすいホームページと認識してくれます。

Web制作会社から提案されたホームページのワイヤーフレームやデザインがいまいちピンとこないとお悩みの方は、視線誘導の法則を含めた改善依頼を行うことで、理想通りのレイアウトを提案してくれるでしょう。