ホームページのヘッダーはなぜ重要？

はじめに

ほとんどのホームページの上部にある、ヘッダー。これ、何気なく付いているのではありません。実は重要な役割を果たしているのです。

この記事ではホームページのヘッダーがどれほど重要かについて解説します。

ヘッダーとは？

ヘッダーとは、ホームページの上部に帯状に表示されている箇所を指し、サイトタイトルや画像、グローバルメニューなどが表示されます。 ヘッダーの中でもトップページの画面最上部では使用される画像の多くが、大きなものが配置され、目を引くとともにネットユーザーに最も訴求したいキャッチコピーが添えられます。メインビジュアルあるいはファーストビューと呼ばれることもあります。

明確に定義されているわけではありませんが、ホームページのトップ画面上部に配置したロゴマークと、グローバルメニュー、そしてメインビジュアルを合わせた場所をヘッダーと言います。

多くの企業や店舗、自治体のホームページではこのようなデザインのヘッダーが取り入れられています。

ヘッダーには何がある？

上にもご説明したとおり、多くのホームページのヘッダーには、サイトタイトル、グローバルメニューのほか会社ロゴが設置されています。サイト訪問者が最初に目にする場所であるため、検索サイトなどから行き着いた人にロゴと発信内容が認知されることになり、その会社や店舗のブランド力を高めることができます。

また、この場所にはそのほかにも、サイトに追加した機能、たとえばサイト内の検索機能や言語切り替え、ショッピング用カート、会員用ログインボタンなどの設置も多くのホームページでされています。このようなパーツをヘッダーに追加することにより、サイト訪問者はどのページにいても常に重要な情報にアクセスすることが可能になります。

ヘッダーはなぜ重要？

ヘッダーはサイト訪問者が最初に目にする場所であるため、会社や店舗、自治体などそのブランドやビジネスに合わせて最適化させることが重要です。これを行う最も効果的な方法の一つが、そのサイトに関連する情報やパーツをグループ化しグループ化した項目をグローバルメニューに設定することです。

ただし、単にパーツを配置するだけでなく、サイトのイメージに合うようにデザインすることをおすすめします。会社、店舗のカラーがあればそれをヘッダーに用いることで視認性が高まり、離脱防止やサイト訪問者のファン化につながります。

検索サイトからあるサイトのあるページに最初にたどり着いたとします。ヘッダーからこの会社のサイトだな、ということが訪問者に容易に認識させることができます。どの会社のサイトのものであるかについての手がかりを得る方法はいくつかありますが、ヘッダーからは容易にその情報が得られます。

ホームページの「３秒ルール」とは？

ところで、ホームページを閲覧していくネットユーザーの特性を示す表現として「3秒ルール」が語られることがあります。

これは、ユーザーがあるページを見て、閲覧するかブラウザバックするかをわずか3秒に判断するという行動パターンを表したものです。

「３秒以内に判断」ということについての事実関係が確認されているかどうか不明ですが、サイト訪問後、わずか数秒のうちにそのページを閲覧するかどうか判断していることはご自身の体験でも当てはまるのではないでしょうか。

そのため、ホームページを設計するときには、ユーザーに立ち止まって閲覧を継続してもらえるようなヘッダーをデザインし、「3秒ルール」でのブラウザバックを防ぐことを意識することが重要と言えます。

さらに、「このヘッダーということはこの会社」としての認知を広げること、そして、サイト訪問者がヘッダーを見ただけで「ここは自分の興味・関心の情報を提供してくれるサイトだ」、「自分の不安払拭や疑問解決につながるサイトだ」、「自分に関係のあるサイトだ」と、どのページでも思ってもらうような情報発信をすることで短時間でのブラウザバックを防ぐことができます。またこれと同時にブランドイメージの向上の役割を果たすことができます。

キービジュアルの選び方

メインビジュアルは、インパクトのある画像を使うことで、ウェブサイトを開いたときに、一瞬で会社や商品のイメージを印象づけて表現することができます。 そして、サイト訪問者をサイトの中へと引き込むことで、見てほしいコンテンツへも誘導しやすくなります。

メインビジュアルはそのホームページの雰囲気やメッセージ、世界観を伝える重要な要素です。

一方で、先ほどお話ししたことの裏返しですが、画像や動画の画質が悪かったり、扱う題材や表現するイメージが悪かったりすると、ホームページ全体の印象も悪くする恐れがあります。そうならないように、 高画質で会社や店舗のイメージに合う画像や動画選びが必要不可欠となります。

また、トレンドを追いかけたものを選ぶと、時間が経過したときに古びた印象を持たれるため、最低でも５年程度は飽きられない素材を選ぶことが重要です。

そのほか、スマホサイトでメインビジュアルに動画を使用した場合は、閲覧できないケースや表示に時間がかかるケースがあります。スマホサイトで動画がストレスなく、正しく再生されるか公開前に必ず確認しましょう。

メインビジュアルを作成する際は、そのホームページの運営者が打ち出したいメッセージや世界観を元に選ぶことも重要ですが、その一方で、サイト訪問者は何に興味があるのか、どんな目的でこのホームページを訪問するのかなど、訪問者の興味・関心を意識しなければなりません。

つまり、メインビジュアルの素材選びでも管理者と訪問者双方の目的を明確にし、両者の目的を同時に達成させるものを選ぶことが必要と言えます。

情報を入れすぎない

ここまではヘッダーの重要性やどのような内容を入れるかについてご説明してきました。その一方で、モバイル端末では、ヘッダー領域に使用できるスペースはPCと比べて大きくありません。モバイルユーザー向けにヘッダー部分に多くの要素を詰め込む事は、見た目によくないだけでなく、操作しづらくなってしまいます。サイト訪問者が混乱したり、リンクボタンを押せないことがないよう、ヘッダーに配置するパーツの数は最低限に抑えましょう。そして、モバイル端末でも閲覧可能なよう、PC版サイトのヘッダーも設計しましょう。