ユーザーに見られるコーポレートサイトのファーストビュー とは？デザイン例も紹介

企業のサイトを担当している方の中には、どのようなデザインにすればいいか悩んでいる方も多いのではないでしょうか。コーポレートサイトは企業とユーザーを繋ぐ重要な役割を持つので、効果的なサイトにしたいですよね。

この記事では、

• ファーストビュー（FV）とは
• コーポレートサイトにおけるFVのパターン
• FVのポイント
• コーポレートサイトのFVデザイン例

について紹介していきます。この記事を読むことで、コーポレートサイトにふさわしいファーストビューに仕上げることができるでしょう。ぜひ参考にしてみてください。

そもそもファーストビューとは

ファーストビューとは、WEBサイトでユーザーが初めに見るエリアのことを意味します。トップページ全体ではなく、スクロールしないで表示される上部の部分にあたります。

ファーストビューの重要性

ファーストビューが重要である理由は、ユーザーがサイトを閲覧するかどうかを決めるエリアであるからです。ある調査では、ユーザーがそのサイトを見るかどうかは3秒で決まると言われています。さらに、コーポレートサイトの場合50％前後のユーザーがファーストビューで離れてしまうのだそうです。

こうした理由から、より多くのユーザーに自社サイトを閲覧してもらうにはファーストビューでユーザーを惹きつけなければならないのです。

コーポレートサイトにおけるファーストビューのパターン

コーポレートサイトでは、6つのパターンが採用されていることが多いです。

会社の特色に合わせて取り入れることで、会社のイメージをユーザーに伝えることができます。ここからは、それぞれのパターンについて紹介していきます。

キャッチコピーを載せる

キャッチコピーを載せることで、ユーザーの心を掴むことができます。コーポレートサイトの場合、いかに企業に興味を持ってもらうかが重要となります。そこで企業の特色を取り入れたり、将来のビジョンなどを盛り込むことによって、企業について知ってもらうことができます。

キャッチコピーを作成する際は、訴求内容を考えましょう。ユーザーに何を伝えたいのか明らかにすることで、的確なメッセージを伝えられるようになります。

写真を用いる

多くのWEBサイトにおいて、写真を用いるのは有効な手段です。写真は多くの情報を凝縮して伝えることができます。

また、写真の選び方や制作方法によってはインパクトを持たせることができるため、他社との違いを出すことができるでしょう。差別化を行うことによって、企業のオリジナリティを理解してもらうことができます。

イラストを用いる

コーポレートサイトにおいても、イラストを用いるのは効果的です。イラストは優しい雰囲気を演出したり、親しみやすさを持ってもらったりできます。

特にエンタメ関係の企業やメーカー企業など、BtoC企業にはイラストの挿入が向いています。ターゲットユーザーの興味に沿ったイラストを用いれば、より惹きこむことができるでしょう。

アニメーションを施す

サイトにアニメーションを施すことで、ユーザーに興味を持ってもらえます。静止画のサイトは一目見て興味を失われがちですが、動きを付けることで最後まで見たくなる気持ちにさせることができます。

するとサイトの滞在時間が長くなり、企業について興味を持ってもらえる可能性が高まります。アニメーションは簡単な動きからつけられるので、予算に余裕がある場合はおすすめの手法です。

動画を掲載する

動画の掲載は、効果的な方法の1つです。動画を用いることで、より企業について知ってもらえます。

オフィスの様子や働いている社員の様子を映すことで、企業の雰囲気を感じ取ってもらえるはずです。企業の内部が見えるようになると、信頼感を与えられるでしょう。

スライドショーにする

コンテンツが多い場合は、スライドショーにするのも効果的です。複数のコンテンツがある場合、ユーザーはどれを読めばいいか迷ってしまいます。また、読んで欲しいコンテンツがあったとしても、ユーザーがたどり着かない場合もあるでしょう。

そこでファーストビューにキービジュアルを掲載することで、導線を確保できるようになります。さらにスライドショーにすることで一度に複数のコンテンツを掲載できるので、サイト回遊率も高くなります。

コーポレートサイトのファーストビューのポイント

ファーストビューを作成する際のポイントは4つあります。

これらのポイントを意識することで、より効果的なサイトにすることができるでしょう。ここからは、それぞれのポイントについて解説していきます。

ターゲットを明確にする

ターゲットを明確にしておきましょう。そもそも誰に向けたサイトなのかが決まっていないと、効果的なデザインを作成することができません。

一般的にコーポレートサイトに訪れるユーザーはいくつかのタイプがあり、それぞれニーズが異なっています。

こうしたユーザーニーズに対し、どのユーザーを優先するのか考えましょう。売り上げを拡大したいなら見込み顧客に刺さるデザインが必要です。一方、求職者を募集するなら企業の内面について伝えるデザインにするといいでしょう。

ゴールを明確にする

コーポレートサイトのゴールを決めておきましょう。WEBサイトではサイトの目的のことをKPIとも呼び、初めに設定しておきます。

コーポレートサイトの場合、「企業の認知拡大」や「ファンの育成」などがKPIに設定されることが多いです。企業の存在がまだ世間に知られていない場合は認知拡大に努めるべきです。一方、ある程度認知されているなら、さらに上の段階を目指してファンを育てていくことに徹底しましょう。

テーマを絞る

ファーストビューに掲載するメッセージのテーマは1つに絞りましょう。伝えたいことはいくつかあるかもしれませんが、あれこれ詰め込んでも「結局何が言いたいのかわからない」と思われてしまい、離脱されてしまいます。

そこで候補の中から1つだけを選び、確実にメッセージを伝えられるようにするといいでしょう。

ユーザーのアクションを意識する

ファーストビューを作成する場合は、ユーザーのアクションを意識してデザインするとより効果的なサイトになります。ファーストビューからユーザーを誘導することでKPIの達成に努めたり、サイト回遊率の向上に繋がったりします。

コーポレートサイトの場合、以下のように誘導することができるでしょう。

このような情報を読んでもらうことで、より多くのユーザーに企業について知ってもらえます。これらはファーストビューにボタンを掲載したり、カルーセルで表示させたりすることで違和感なく導線を確保できます。

コーポレートサイトのファーストビューデザイン例

最後に、コーポレートサイトのファーストビューデザイン例を紹介していきます。自社に似ている企業のコーポレートサイトを参考にすることで、デザインを考えやすくなるでしょう。

ベクスト株式会社

出典：ベクスト株式会社

ベクスト株式会社は、東京都目黒区にオフィスを構える企業です。「テキストマイニング」というテキストのデータ分析を行っています。

ベクスト株式会社のサイトの特徴は、アニメーションを施していることです。動きを付けることによってユーザーの目を引くので、どんな企業なのか興味を持ってもらえます。

また、アニメーションが終了すると上部のグローバルメニューがゆっくりとスライドされるという細かい演出も施されています。こうした演出により、違和感なくメニューを見せることができます。メニューには企業情報や製品情報などを表示しているので、気になるユーザーはすぐにアクセスすることができます。

株式会社UZUZ

出典：株式会社UZUZ

株式会社UZUZは、第二新卒やフリーターなどの求職者に対して就職サポートを行っている企業です。

株式会社UZUZのサイトの特徴は、目を引くキャッチコピーを掲載していることです。「本当の私はウズウズではじまる」という特徴的なフレーズで、その意味を考えさせられます。このキャッチコピーは社名である「ウズウズ」と、就職活動で悩んでいるユーザーのうずうずとした気持ちを掛けており、よく考えられている例です。

また、ファーストビューにはYouTubeやTwitterなどのSNSボタンが設置されています。これをクリックすると各媒体のアカウントに繋がるので、ユーザーと繋がることもできます。

グリーンカルチャー株式会社

出典：グリーンカルチャー株式会社

グリーンカルチャー株式会社は、東京都千代田区に本社を構える小売企業です。大豆を中心とした動物性原料不使用の商品を開発し、販売しています。

グリーンカルチャー株式会社のサイトの特徴は、イラストを用いていることです。緑を中心としたデザインなので、健康や環境などのイメージを彷彿とさせます。また、親しみやすさがあるため「どんな企業何だろう？」とユーザーの興味を引くことができるでしょう。

また、上部のグローバルナビゲーションでは事業紹介や商品の購入ページへと繋ぐボタンも設置しています。デザインのカラーを踏襲しているので、違和感がありません。

株式会社Sigfoss

出典：株式会社Sigfoss

株式会社Sigfossは東京都千代田区に本社を構えるIT企業です。ソフトウェアやサービスの開発・販売を行っています。

株式会社Sigfossのサイトの特徴は、動画を掲載していることです。これは画像に表示されたものを認識するAI技術をイメージした映像です。一目で最新技術を表現していると分かるので、企業の認知拡大にも有効です。

右上にはハンバーガーメニューが設置されています。メニューを折りたたんで表示することで、ファーストビューのデザインをすっきりさせることができます。もしメニューを設置してみてイメージが崩れるようであれば、ハンバーガーメニューを活用するといいでしょう。

また、右下にはスクロールを促すバーが設置されています。さりげないデザインですが、ユーザーの行動を促す効果があります。

まとめ

この記事ではコーポレートサイトのファーストビューについて紹介していきました。ユーザーから見られるためには、キャッチコピーや写真を用いるなどの工夫が必要です。また、アニメーションや動画を掲載することで動きが付くので、インパクトを出すことができます。

ユーザーから見られるコーポレートサイトになると、企業の認知拡大に繋がったり、ファンとして育てたりすることができるでしょう。コーポレートサイトを制作する際は、ぜひこの記事でご紹介したポイントを取り入れてみてください。