人は見た目が9割。ホームページも…
ファーストビューとは、あるホームページをユーザーが訪れた時に、最初に目に入る部分のことです。
ざっくり言うと、トップページの一番上の部分ですね。もう少し詳しく言うと、サイトを開いて画面をスクロールしなくても「パッと見」で認識できる部分になります。
ですから、同じサイトでもパソコンで見る場合とスマホで見る場合とではファーストビューの範囲は違ってきます。
ファーストビューは、その名前の通り、ホームページの「第一印象」を決めるとても大切なエリアです。
以前『人は見た目が9割』という本がベストセラーになりました。本の内容はさておき、確かに、初めて人に会う時の服装や表情、髪型といった「見た目」は、その人となりを判断するのに、ものすごく影響していると思います。
「写真がすごく綺麗」「エッジのきいたデザイン」「エフェクトがカッコイイ」など、ファーストビューがイケてる会社サイトは、「サイトの中身も面白そう。見てみたい」となりますし、会社へのイメージも高めてくれます。
逆に「字だらけで見づらい」「デザインが古くさい」「社長の写真がコワイ」などファーストビューが残念なサイトは、見る人に、その会社やサービスにまで悪印象を持たせてしまいます。どれだけサイトの中に良いことを書いていても、見てもらえません。これはビジネスにとって大きなマイナスですよね。
新しくサイトを作る方は、とにかくファーストビューにはこだわってください。
また現在すでにサイトをお持ちで「どうも反応が悪い…」とお感じの方は、ファーストビューに問題がないか今一度見直してみてください。
ネットの世界の「3秒ルール」
突然ですが、「3秒ルール」って聞いたことありませんか？
床にお菓子を落としてしまっても、3秒以内に拾ったら大丈夫（食べられる）みたいな、まあ迷信というか、おまじないみたいなものです。
実はインターネットの世界にも「3秒ルール」があります。
それは
人があるホームページを開いた時に、それが自分にとって必要か不要かを判断する時間は『3秒』である
というもの。（これは迷信じゃありませんよ）
ネット検索がどんどん便利になっている中で、ユーザーは欲しい情報を「より早く」欲しいと考えます。サイトの中で3秒探して見つからなかったら、そこでページを閉じてしまうわけです。
もちろん厳密には、3秒の時もあれば5秒、10秒の時も、1秒で離れる時もあるでしょう。要は、それだけ短い時間でサイトの要・不要を判断されるということを知っておいてください。
移り気なネットユーザーの心を引き留めるためには、
- 誰をターゲットにしているのか
- このサイトで得られるベネフィット（利益）は何か
この2点が、一瞬で分かるようなファーストビューが理想です。
ファーストビューを改善するための4つのポイント
ファーストビューの大切さは、お分かりいただけましたでしょうか？
それでは本題の、ファーストビューを改善するためのポイントを具体的にご説明いたします。これらをご参考にしていただき、「つかみ」の強いホームページを作ってください。
1.いちばん伝えたい情報を載せる
ファーストビューには、そのサイトであなたが最も訴えたいこと「だけ」を表現しましょう。
先ほど申し上げた
- 誰をターゲットにしているのか
- このサイトで得られるベネフィット（利益）は何か
を意識して、伝えたいメッセージをできるだけシンプルにしてください。
時々見かけるのが、ファーストビューに商品やサービスの特徴がてんこ盛り状態になっているサイトです。
そのものの良さをたくさん知っていればこそ「あれも伝えたい、これも知ってほしい」となるお気持ちはよく分かります。
でも、一目で認識できる情報量には限りがあります。繰り返しますが、3秒で判断してもらわないといけないのですから。
それに「分かりにくい」「ゴチャゴチャしている」というのは、サイトの内容以前に、それだけでユーザーに不親切なサイトだという悪印象を与えてしまいます。
人の心を動かすのに、そんなにたくさんの理由はいりません。
とにかく、あなたがサイトで一番言いたいことを絞りましょう。
それが響かない人は、そもそも貴社が出会いたいお客様ではなかったのです。
2.視覚的なインパクトを盛り込む
どれだけ良いメッセージが書いてあっても、目にとめてもらわなければ意味がありません。平板なデザインの中にあっては、せっかくの情報が閲覧者に届かないまま離れていってしまうのです。
視覚的なインパクトを盛り込んで、目にとまりやすい、印象に残るファーストビューを目指しましょう。
大きくする
「大きいことはいいことだ」なんていうキャッチコピーが昔ありましたが、見せたいものを「大きくする」という手法は、いたってシンプルでありながら、効果が高いのでおすすめです。
キャッチコピーや商品写真、イメージ画像など、どの要素でも良いです。一度「ちょっと大きすぎるかな？」というくらいのサイズで入れてみてください。メリハリのきいた、インパクトの強いファーストビューになると思います。
ちょっと動かす
複数の写真が自動で切り替わる「スライドショー」、マウスカーソルを合わせると絵が動く、文字やキャラクターのフェードイン・フェードアウトなど、ちょっとした「動き」を取り入れることで見た目のインパクトが生まれます。
グリグリ動くかっこいいアニメや動画ももちろん良いですが、それを作るのは簡単ではありません。まずはできる工夫から始めてみてはいかがでしょうか。
人を出す
人物の笑顔とかポーズをつけている写真も強いアクセントになります。人の姿や表情があると、まずそこに目がいきますし、ぱっと見が生き生きするんですよね。
会社サイトだと代表者の方やスタッフ様の写真を使うことが多いですが、もちろんモデルさんや素材集の写真でもOK。なお使うにあたっては、必ず写真のご本人の承諾を得てくださいね。
ちなみに、動物の写真は…弊社ではあまり使ったことがありません。好き嫌いがありますので、よりけりですね。うまくハマればかなりインパクトを出せると思います。
【弊社の事例】
https://www.daitokisetsu.co.jp/
クライアントの強みを大きく打ち出したタイポグラフィと、現場で奮闘するスタッフの写真でスライドショーを作成しました。
「大きくする」「動かす」「人を出す」の全てを押さえた、インパクトの強いファーストビューです。
3.強みを「数字」で示す
企業の強みや商品のセールスポイントを、ファーストビューに文字で紹介する時には、「数字」を使いましょう。
数字というのは不思議なもので、ある事実を数値化することで、説得力や真実味が増します。もちろんウソはいけませんが、ファーストビューでの訴求効果を高めるためには数字を上手に使いたいところです。
例えば、会社の業歴の長さをアピールするなら、単に「長年の実績と経験」とするよりも「創業68年の実績」「施工件数2000件の実績」などのほうが重みが伝わります。
「ビタミンCたっぷり」よりも「レモン50個分のビタミンC」のほうが「ビタミンたっぷり入ってそう」とイメージしやすいですよね。
数字で表現することのメリットについては、こちらの記事でも触れていますので、よろしければご覧ください。
ブログご担当者必見！思わず1度クリックしてしまう「記事タイトル」のつけ方
4.次にとってほしい行動を明確にする
ファーストビューで貴社のサイトに興味関心を持ったユーザーが、引き続きサイトに滞在して、閲覧や購入・申し込みなどのアクションをとってもらうためには、そのアクションにつながる要素をファーストビューに入れておく必要があります。
具体的には次のようなものがあります。
コンバージョンボタン
商品購入や資料請求、参加申し込み、アプリのダウンロードなどを行うためのボタンです。サイトの目的をストレートに伝えるとともに、購入意欲の高いユーザーを逃さない効果があります。
アンカーリンク
同じページ内の、別の場所にジャンプするためのリンクボタンです。情報量が多く長いページで、真っ先にユーザーに見せたい・読ませたい内容の書かれている場所にショートカットさせることができます。
「簡単に8kg痩せの秘密はここから」みたいなキャッチーな文言を添えて、ユーザーがクリックしやすい工夫をしましょう。
スクロールを促す要素
「続きを見る」といった文言や下向きの矢印、アニメーションなど、ページ下へのスクロールを促す要素です。ちょっとしたことですが、ファーストビューからの離脱率を下げるのに効果があります。