- 公開日： 最終更新日：
ホームページのヘッダーとは？役割やSEO効果を高める作成法、注意点
ホームページ制作において、ヘッダーの作成はどの会社も力を入れて取り組んでいると思います。
ホームページのヘッダーを適切に作成することによって、ホームページにどんな内容が書かれているかを伝えることや、適切なナビゲーションの役割を果たすことで、多くのコンバージョンを獲得できるようになります。
当ページでは、ホームページのヘッダーとは何かや、役割、SEO効果を高める作成法、入れるコンテンツ、参考サイト、作成の注意点を解説します。
目次
ホームページのヘッダーとは
ホームページのヘッダーとは、ページの上部に配置されているロゴや社名、内部リンク、電話番号などのコンテンツのことを言います。
ホームページのヘッダーは、ファーストビューに配置されるコンテンツになり、ユーザーはページを開いた瞬間にヘッダーを確認して、どんなテーマのホームページかを予測したり、ホームページの印象を決めています。
また、ユーザーに魅力的なヘッダーであるほど、グローバルナビゲーションのリンクを利用してくれたり、電話をかけてくれるようになるので、ホームページのコンバージョン率の向上を見込むことが可能です。
ホームページのヘッダーは、全ページ共通で利用されることが一般的で、1つのファイルを更新すればサイト全体が改善できます。
ホームページのヘッダーの役割
ホームページのヘッダーの役割を解説します。
どの会社のホームページかを伝える役割
ヘッダーにロゴを掲載することで、どの会社がそのホームページを運営しているかを伝えることができます。
ユーザーは、Z字の順にページを閲覧（Z字の法則）しており、左上→右上→左下→右下の順に確認しています。
つまり、ヘッダーの左にロゴを設置することで、すべてのユーザーに対して、このホームページを運営している会社がどこになるのかを打ち出すことができるのです。
ホームページの訪問者は、コンテンツの品質を評価する際に、どんな会社が作成したコンテンツかも含めて評価をしているので、ヘッダーにロゴを打ち出して、どの会社のホームページかを伝えることの重要性は高いです。
サイト内の重要なページへと訪問者を誘導する役割
ヘッダー内にはサイト内で重要なページへとリンクを掲載することが一般的で、このリンクは訪問者にクリックされる可能性が高いです。
さらに、ヘッダーメニューを見ることで、ユーザーはホームページが何を目的として制作されているのかを予測することができるので、コンバージョン率の向上にも役立ちます。
すべてのページで訪問者に重要な内容を伝える役割
ホームページのヘッダーは、全ページ共通になり、さらにはページの上部のコンテンツになるので、すべての訪問者に対して重要な内容を閲覧してもらうことができます。
こちらは、制作実績の渋谷区恵比寿の鍼灸師のホームページになり、鍼灸師であるため最寄り駅の恵比寿駅から徒歩何分かや、完全予約制であることと電話番号を打ち出しています。
もちろんコンテンツ量が多すぎてはいけませんが、本当に重要な内容であれば、ヘッダーに打ち出すことで、確実にユーザーに伝えることができます。
SEO効果を高めるヘッダーの作成法
SEO効果を高めるヘッダーの作成法を解説します。
トップページへの内部リンクを含める
ヘッダーにはトップページへの内部リンクを掲載しましょう。
下層ページを見ているユーザーが、グローバルナビゲーションを見たときに、HOMEなどのリンクボタンがあると、トップページへと訪問してくれる可能性があります。
さらに、Googleは、サイト内で重要なページには内部リンクが集まると考えているので、トップページの内部リンク数を増やすことは、トップページのSEO効果に良い影響があります。
フッターリンクと同じリンク先は控える
同じページに対して内部リンクを行うことは、SEOで見るとあまり良い状態ではありません。
Googleの解説では、1ページに同じページへのリンクを掲載すると、どちらのリンクからもページランクは流れるそうですが、奇妙なことであると解説をしています。
また、海外SEO情報ブログにはGoogleは最初のリンクだけを評価するとも記載があります。
さらに、ソースは見当たりませんでしたが、あるSEOコンサルタントのXでの投稿を紹介します。
現在のGoogleの仕様として、1ページに同じページへのリンクがあると、1つであればリンク先ページが1ポイントを獲得できていたけれども、2つあることで、重要性が高いリンクは0.6、重要性が低いページは0.1というように、少しだけ低めにページランクが譲渡される仕様になっている。
つまり、Googleの発言を加味すると、1ページに複数同じページへのリンクは奇妙なので回避した方がSEO効果が高く、フッターにはないリンクだけに限定することが大切です。
アンカーテキストを分散させる
グローバルナビゲーションのアンカーテキストは、フッターやパンくずリストとは、異なるアンカーテキストを用意しましょう。
アンカーテキストが同じだと、Googleはテンプレートとして処理してしまうので、グローバルナビゲーションとフッター、パンくずリストに内部リンクがあったしても、1つと認識してしまう恐れがあります。
またホームページのフッターって何？と思いの方は、ホームページのフッターとは？のページをご覧ください。
ホームページのヘッダーに入れるコンテンツ
ホームページのヘッダーに入れるコンテンツを解説します。
また、ヘッダーに入れるべき要素については、ホームページのヘッダーに入れたい要素の考え方のページで詳しく解説しているので、興味があればご確認ください。
会社名（ロゴ）と電話番号
ホームページのヘッダーには、そのホームページがどの会社が運営しているかを伝えるために、会社名やロゴを掲載しましょう。
また、電話での問い合わせが多い会社であれば、電話番号も掲載することで、ホームページのコンバージョン率が高まる可能性があります。
重要なページへの内部リンク
ホームページのヘッダーには重要なページへの内部リンクを掲載しましょう。
グローバルナビゲーションのクリック率は、高い傾向が見られるので、サービスページや実績ページなど、ユーザーがコンバージョンに繋がる可能性が高いページへの内部リンクを掲載することで効果を発揮します。
すべての訪問者にアピールしたいコンテンツ
ホームページのヘッダーはすべての訪問者が目にするコンテンツになるので、どのページに訪れたユーザーにも見て欲しいコンテンツがある場合は掲載しましょう。
ヘッダーデザインの参考サイト
参考サイトとして、ヘッダーデザインが優れている大手サイトを紹介します。
| 無印良品 | 一般的なヘッダーだが、グローバルナビゲーションが多く、言語設定まであるのに、窮屈さを感じないヘッダーデザイン。 |
| サクラクレパス | ページを下にスクロールするとオンラインショップと問い合わせのリンクボタンのサイズが動き、ユーザーの目を引くヘッダーデザイン。 |
| ルーヴル美術館展 愛を描く | ページのコンテンツの邪魔にならない小さなヘッダーだが、枠囲いすることでユーザーの目を引く。またページを最下部までスクロールするとヘッダーが表示されるのも面白い。 |
| ニンテンドーシステムズ | サイドに表示されたヘッダー。コンテンツがより見やすくなるので、当社も定期的に使うヘッダーのパターン。 |
| AZABU DEI 麻布大学DEI推進センター | ヘッダーなのにページの下部にあり、面白いと思った。 |
ホームページのヘッダー作成の注意点
ホームページのヘッダーを作成する際の注意点を解説します。
グローバルナビゲーションの数を厳選する
一般論として、グローバルナビゲーションの数は7つ以内にしましょう。
あまりに多くのリンクを掲載してしまうと、1つ1つのリンクサイズが小さくなってしまい、ユーザーがクリックしづらくなってしまいます。
コンテンツ幅が広いホームページであれば、もう少し数を多くしても問題はありませんが、ユーザーがクリックしやすい数の設置を意識しましょう。
掲載コンテンツを絞る
ヘッダーのコンテンツ量が多いと、訪問者にホームページがごちゃごちゃしてそうと感じられてしまい、直帰される可能性が高くなります。
そのため、重要なコンテンツが多い場合でも、ヘッダーに掲載するコンテンツを厳選しましょう。
ホームページのヘッダーのまとめ
ホームページのヘッダーを解説しました。
ホームページのヘッダーを最適化することで、コンバージョン率やSEO効果の向上が見込めます。
ホームページのヘッダーって何？と思いの方の参考になれば幸いです。
