WEB用語「ファーストビュー」って聞いたことあるけど知らない人！

WEBサイトを作るにあたってたくさんの用語があります。どれもカタカタであまり聞き慣れない単語ばかりではないでしょうか。この用語集ではWEBサイトについてよくわからないという初心者に向けてわかりやすく解説をしていきます。

ファーストビューとは

単語からイメージできるかもしれませんが、「ファーストビューFirst View」とは、ファーストが（最初に・初めて）をあらわし、ビューが（見る）をあらわしています。読んで字の如く、サイト訪問者がWebサイトに訪れた時に、スクロールせずに最初に見える範囲のことを指します。

サイト訪問者が初めて見る範囲、つまり導入部分になるので、伝えたい事が簡潔にわかりやすくデザインされているかどうかで、興味を引けるか引けないかが決まるといわれている、とても重要な要素となっております。
 

01｜ファーストビューで大切なポイント

・ターゲットを明確にする
・端末サイズに合わせる
・サイト内の導線を考える
・表示速度を改善する

・ターゲットを明確にする

「誰に」伝えるのかによって、訴求する内容が変わってきます。逆に「誰に」がないと、「何を」伝えたいサイトなのかがわからずに直帰率が爆上がりのファーストビューおよび、Webサイトになってしまいます。

サイト訪問者に対して、このサイトを見ることで得られる「メリット」を表現することが重要です。

例）
　・高い施工技術で〇〇ように仕上がります。
　・これまで5つの工程が1つに！
　・高いダイエット効果を実証済み

「気になる！」「どういうこと？詳しく知りたい」といった、興味と関心をひき、スクロールしてさらに情報を見てみたいと思わせることができればバッチリです！

・端末サイズに合わせる

端末にはデスクトップパソコン・ノートパソコン・タブレット（iPadなど）・スマートフォンなど大きく分けて4種類あります。
例えばパソコンのデザインレイアウトをそのままスマートフォンで表示すると、「文字が小さくて読めない」などユーザーにとって使いにくくなるので端末に合わせたデザインを準備することは必須となっています。

・サイト内の導線を考える

ユーザーがページを閲覧していく中で、どのように見ていくのかを想定してさまざまな誘導施策を行っていきます。ファーストビューをみて興味を持ってもらえたら、次のコンテンツを読みたくなるはずです。

・問い合わせをして欲しいなら、ボタンを設置
・次のコンテンツの誘導には、矢印を設置

・表示速度を改善する

これは基本的なことですが、ページに入ってローディングの時間が長いと、戻るボタンを押して次のサイトを閲覧してしまうという経験があるのではないのでしょうか？
またGoogleの調査によると、ページの読み込みスピードが5秒遅れるだけで、直帰率が90％上昇するというデータが出ています。

画像の容量の大きさや過度なアニメーションの使用はさけて、表示速度をあげることでサイトに訪れたユーザーが、すぐに離脱するのを防ぐことが可能になります。

---

02｜ファーストビューの失敗例

・情報が多すぎる
・ターゲットが定まっていない
・見た目だけにこだわり過ぎる

・情報が多すぎる

あれも入れたい！この情報も必要！など欲張ると、「結局何が強みのサービスなの？」だったり「言いたいことがよくわからない・・・」などユーザーになにも伝わらずにサイトから離脱してしまうことになります。

情報を絞ったり、シンプルにすることは怖いと感じるとこもありますが、ユーザーが興味をもつ情報をシンプルに入れて、その他の下層ページで伝えていくとサイトに訪れた人の理解度も上がっていくと思います。

・ターゲットが定まっていない

ターゲットが定まっていないケースもよくあります。例えば女性なのか男性なのかによって、使う色、書体、書体の大きさ、余白の取り方などそれぞれが違ってきます。
商品やサービスが誰のためのものなのか？を改めて整理しキャッチコピーに落とし込んであげることで、魅力的なファーストビューの作成に繋がります。

・見た目だけにこだわり過ぎる

目的やサイト訪問者の事を忘れ、見た目だけがおしゃれなサイトにしようとして英語表記のテキストが増えたり、アニメーションを過剰につけたりなど、知らないうちにユーザーを困らせてしまっているケースがよくあります。バランスがめちゃめちゃ重要ですが、「伝わること」「わかりやすいこと」を最優先にしながらも、「おしゃれ」なサイトになるよう工夫が必要です。

---

03｜WEBサイトは改善ができる

WEBサイトは、印刷物（チラシやパンフレット）と違い、反応が悪いクリエイティブは、すぐに修正や変更など調整をすることができます。なのでユーザーのことを研究して検証と改善を繰り返していくことで、魅力的なサイトに仕上がっていきます！