よく「人は初対面の印象でその人をほぼ判断してしまう」と言いますが、Webサイトについても似たようなことが言えます。
それはWebサイトへの訪問者は最初に目にするページの印象でサイト全体に対する感想を形成することが多いことです。
この記事では、Webサイト運営において重視されるべきファーストビューの詳細とその重要性について説明します。
ファーストビュー（FV）とは
ファーストビュー（FV）は、Webサイトを開いた際に最初に目に入る画面範囲を指します。人々が他人の第一印象を数秒で形成するように、ファーストビューも訪問者のサイトに対する印象を瞬時に決定します。このため、ファーストビューの最適化は、コンバージョン率（CV）や離脱率に直接的な効果を及ぼし、Webサイト設計の重要なステップとなります。
また、ファーストビューをデザインする際に考慮すべき重要な要素があり、それはパソコンとスマートフォンなどのデバイスによって表示範囲が異なることです。
この違いを把握し、多様なデバイスで効果的に表示されるファーストビューを作成することが、サイト構築におけるポイントとなります。
Webサイトのファーストビューで意識したい5つのポイント
ファーストビューを作成する場合、以下の点を意識しましょう。
- 訴求内容を絞る
- 導線を考える
- 表示速度の見直し
- 過剰な宣伝は控える
- アイキャッチ画像を工夫する
これらを明確に行わないと、ターゲットが定まらず直帰率が上がる傾向になりますので注意してください。
ファーストビュー（FV）の作り方
訪問者は、WEBサイトにアクセスした瞬間に、自分が必要とする情報や商品が含まれているかを判断しますので、ファーストビューのデザインにおいては、サイトの内容や提供サービスを直感的に理解できるような工夫が必要になります。
そのためには、伝えたい情報を絞り込み、理解しやすいシンプルなデザインが望ましいでしょう。
多くのWEBサイトでは、訪問者に対して豊富な情報を提供しようとして、画面に情報を満載しがちですが、ファーストビューの作成において大事なことは、視覚的な要素（画像や動画など）を駆使し、訪問者の関心を引きつけるキャッチコピーを効果的に配置することが求められます。
また、ファーストビューには閲覧者が見たい情報にすぐに飛べるような分かりやすい導線を作ることも重要で、スマートフォンで開くことも考慮されて作ることも必要でしょう。
ファーストビューを作成する場合は、PCで閲覧したとき同様、サイト内容が直感的に伝わるようにしつつも、閲覧者が知りたい導線を確保する必要があります。
キャッチコピー
ファーストビュー作成において、キャッチフレーズの作成は最も重要な過程の一つで、キャッチコピーは短い言葉でサイト制作者が伝えたいメッセージを表現します。
そのため、ファーストビューを作成する際にはその方向性を定めるためにキャッチコピー作りを写真やイラスト作成前に行うといいでしょう。
また、キャッチコピーを作成する際は瞬間的にサイトの内容を認知させるために、お客様のメリットを明確に示し、サイト全体の情報を要約しましょう。
写真・イラスト
キャッチコピーが完成したら、次は写真やイラストの選定と作成に移りましょう。
これらのビジュアル要素は、キャッチコピーのメッセージを補完し、強化するために選ぶと良いでしょう。重要なのは、写真やイラストのサイズ設定で、一般的にPCは画像の幅が1000px、高さが550pxのものがよく使われますが、スマートフォンでは幅360px、高さ600pxが多く見られる画面サイズです。
この違いを考慮し、両方のデバイスで適切に表示される写真やイラストを選んでください。
また、近年では動画を用いるWEBサイトも増加しています。動画は、写真やイラストよりも豊富な情報を伝えられるので、メッセージをより臨場感ある形で表現することができるというメリットがあります。
CSSの書き方
画像・イラストの選定や作成が終了したら、次はその画像をウィンドウの高さに合わせるためにコードを調整します。この際にプログラミング言語の一つであるCSSを変更すると簡単に調節することができますが、場合によっては「JavaScript」も調節する必要があります。
以上の工程が簡易的ではありますが、ファーストビューの作り方になります。
クオリティーの高いファーストビューを作ろうとすれば、さらに複雑な作業が必要となってしまいますので、自社だけで対応できない場合は、業務委託をするか、ショッピングカートASP型を使いECサイトを構築するなどの対応が必要となるでしょう。
まとめ
今回はファーストビューについてご紹介致しました。
ファーストビューとは、Webサイトを表示した際に最初にスクロールせずに見える範囲のことを指す言葉であり、サイトの離脱率とも深く関わります。
ファーストビューを作成する際は、PCとスマートフォンで閲覧した場合でも、サイト訪問者にサイトの内容が直感的に伝わるようにレイアウトを整える必要があることを踏まえて、これからのサイト作りのお役に立てば幸いです。
この記事を書いた人
ECマーケティング事業部マネージャー コンサルタント/コンテンツ編集担当/通販エキスパート資格
元システムエンジニア。BtoBからBtoC案件、動画制作スタッフとしてクライアントの売上改善や業務改善をサポート。
社内では営業改善、マーケティングを担当。多くのスキルと幅広い経験を活用してWEB業界に従事。
様々なジャンルにチャレンジしています。
EC運営に役立つ資料が満載！
EC運営に役立つセミナーを毎月開催中！
当社のEC運営代行サービスについて
