現役Webデザイナーが、初心者のホームページ自作を応援!

ホームページ自作ガイドトップページの役割を理解して構成を考えよう

トップページの構成を考えよう

トップページはホームページの顔であり、最初にユーザーが訪れることが1番多いページです。
どのような構成にするかを、大まかに決めてから作り始めましょう。

こちらの記事を読むことで、トップページの役割を理解し、トップページの構成を決めることができます。

トップページの3つの役割とは?

トップページには、大きく3つの役割があります。
それぞれの役割について解説します。

「目的のホームページかどうか」を直感的に判断させる

GoogleやYahoo!などで検索してアクセスした場合、まず「自分が探している情報が載っているホームページなのかどうか」が気になります。

検索結果に表示されるページは、トップページだけではありません。
検索ワードに関連しているページが、下層ページの場合も多々あり、下層ページが検索結果に表示されることもよくあります。

とは言え、ユーザーが最初に訪れることが一番多いページであるトップページは、「このホームページをこのまま閲覧し続けるかどうか」判断される、勝負の場でもあります。

ユーザーが「目的のホームページかどうか」を判断するのは7秒以内と言われており、じっくり見た上で判断してくれる訳ではありません。
トップページをパッと見て「このホームページな違うな」と判断されてしまうと、「他を探そう」となり離れてしまいます。

長い文章でアピールできていたとしても、じっくり読む前に離れてしまいます。
直感的に「探していたのはこのホームページだ!」と思ってもらえるように、キャッチフレーズや画像を上手く使うと良いでしょう。

ユーザーが必要とする情報へスムーズにたどり着けるようにする

トップページは、ホームページを見るときの入口になることが多いです。
しかし、トップページに載せられる内容は限りがります。
そこで、トップページ以外の下層ページに様々な内容を載せます。

そのため、ユーザーが本当に見たい情報は、トップページ以外の下層ページにあることが多いです。
ユーザーが知りたい情報を載せているページへ、スムーズに誘導できるトップページにする必要があります。

お知らせなどの情報を目立つようにして周知させる

ユーザーが知りたい「お知らせ」「イベント情報」「キャンペーン情報」「最新の商品情報」など、時事性のある情報を周知させることもトップページの役割です。

トップページに最新情報が掲載されていると、「ちゃんと運営されているホームページ」という印象を与え、ユーザーに信頼されるでしょう。

トップページは見栄えより「解りやすさ」を重視

トップページのデザインを考えるとき、つい見栄えの良い「カッコいいデザイン」を目指しがちです。
しかし、ホームページを作る目的は「カッコいい」と思ってもらえることでしょうか?

ホームページを訪れたユーザーにとって大事なことは、自分が知りたい情報を得ることができるかどうかであり、カッコいいかどうかではありません。
ユーザーが知りたい情報をしっかり提供できることが大切です。

そのためには、上記で説明した「トップページの3つの役割」を果たせるレイアウトやデザインであることを重視しましょう。
ユーザーにとって、どのような「配置」「配色」「文言」が良いのか、じっくり考えてください。

とは言え、一定以上のデザインクオリティは大事

先程の「トップページは見栄えより『解りやすさ』を重視」という話と矛盾しているように聞こえるかもしれませんが、一定以上のデザインクオリティは大事です。

もし、あなたが訪れたホームページが、素人感満載のダサいホームページであったら、どう感じるでしょうか?
「ここの会社大丈夫かな?」などど不安になりませんか?

今は、ユーザーがデザイン性の高いホームページを見慣れているので、他のホームページと比較されがちです。
めちゃめちゃカッコいいホームページである必要はないですが、「ダサくはない」レベルはキープしましょう。

信頼感のあるデザインかどうかがボーダーラインと言えます。
ユーザーが見たときに「ちゃんとしている」感があるデザインであれば大丈夫です。

ただ、業種によっては単に信頼感があるだけでなく、「オシャレ感」も大事である場合もあります。
例えば、美容関係、アパレル関係などのホームページです。

ホームページ作成サービスでは、豊富なテンプレートが用意されており、オシャレなデザインのものも多いです。
そういったデザインのテンプレートを選んでおけば問題ないでしょう。

トップページのメインコンテンツに入れるコンテンツ例

具体的には、どのようなコンテンツをトップページのメインコンテンツに入れると良いのか、例をリストアップしました。
あくまで参考としてご覧ください。

ちなみに、同業他社のホームページを見てみるもの参考になると思います。

  • お知らせやブログの新着記事一覧
  • 新着商品一覧
  • キャンペーン情報 / イベント情報
  • あいさつ文
  • コンセプトの紹介
  • 下層ページへの誘導箇所

それぞれについて簡単に解説します。

お知らせやブログの新着記事一覧

お知らせやブログなのどの投稿記事で、新着記事のタイトルを載せます。
5件前後の記事タイトルが載っていることが多いです。
記事タイトルにはリンクを設定しておき、クリックすると記事の詳細ページへ移動できます。

また、リンク付きのタイトルだけでなく、その記事が投稿された日付、カテゴリー名、アイキャッチ画像などが一緒に配置されていることも多いです。

自動的に、決められた件数の新着記事がトップページに表示されるようにしておくと、記事を投稿する度にトップページを変更しなくて済みます。

新着商品一覧

新商品は、いち早く既存のお客様にも知ってもらい販売につなげたいのではないでしょうか。
商品を販売している業種であれば、新しく販売された商品の情報を載せておきましょう。
飲食店などの店舗であれば、新メニューであったりします。

新商品の情報を求めてホームページを訪れたユーザーが、どこに情報があるのかスムーズに見付けられることが大切です。

キャンペーン情報 / イベント情報

期間限定のキャンペーンやイベントの情報を、トップページに分かりやすく載せましょう。
案内の全てをトップページに載せる必要はなく、バナーなどを設置しておいて、クリックしてもらい詳細ページに誘導する方法もあります。

あいさつ文

会社・店舗からユーザーに向けての挨拶文です。
初めて訪れたユーザーに好感を持ってもらえ、会社・店舗のイメージアップにつながるような文章にしましょう。

コンセプトの紹介

会社・店舗が大切にしているもの、理念などを紹介する箇所です。
具体的な商品やサービス以前に、どのような姿勢で取り組んでいるのかを伝え、ユーザーに好感を持ってもらえるようにしましょう。

下層ページへの誘導箇所

「トップページの3つの役割」の1つである「ユーザーが必要とする情報へスムーズにたどり着けるようにする」ための箇所です。

ユーザーが求めていると考えられるページへ誘導できるよう、どのような内容が載っているページなのか解りやすくしましょう。
ページタイトル以外にも、イメージ画像、ページの紹介文があると良いですね。

まとめ

トップページの良し悪しは、ホームページの成果に大きく影響します。
トップページの役割を理解した上で、自分のホームページであれば何が必要なのか、よく考えてレイアウトを決めてください。

こちらの記事もチェック!

このページのトップに戻る