Webページを作るとき、「見出し」を何となく使っていませんか？
デザインを整えるためにh2やh3を使っているケースをよく見かけますが、実はそれがSEO上のミスになっていることがあります。見出しタグはGoogleがページの構造を読み取るためにも使うもので、正しく設定するだけで評価が改善することも珍しくありません。
この記事では、見出しタグの基本からSEOへの影響、よくある間違いまでをわかりやすく解説します。
見出しタグとは？
見出しタグとは、HTMLの <h1> <h2> <h3> … <h6> のことです。数字が小さいほど重要度が高く、ページの構造を階層的に表します。
<h1>ページのメインタイトル</h1>
<h2>大見出し（章）</h2>
<h3>中見出し（節）</h3>
<h3>中見出し（節）</h3>
<h2>大見出し（章）</h2>
<h3>中見出し（節）</h3>
本の目次のように「何について書かれているページか」をひと目で伝えられる構造を作ることが基本です。
Googleにとっての役割
Googleのクローラーは見出しタグを読んで、ページの主題・構成・キーワードを把握します。適切な見出し構造があることで、ページの内容が正確にインデックスされやすくなります。
h1タグの正しい使い方
h1はページ全体のタイトルを示すタグです。SEO上、特に重要なルールがあります。
h1は1ページに1つだけ
h1は「このページは何についてのページか」を示す最重要の見出しです。1ページに複数のh1を使うと、Googleがページの主題を判断しにくくなります。
<!-- NG: h1を複数使用 -->
<h1>SEO対策の方法</h1>
<h1>初心者向けガイド</h1>
<!-- OK: h1は1つだけ -->
<h1>初心者向けSEO対策の方法｜基本から実践まで</h1>
h1にはメインキーワードを含める
ユーザーが検索しそうなキーワードを自然な形でh1に入れましょう。ただし、キーワードを詰め込みすぎると逆効果になります。
| 悪い例 | 良い例 |
|---|---|
| SEO SEO対策 SEOキーワード 上位表示 | SEO対策の基本｜初心者が最初に読むべきガイド |
| h1が存在しない | ページの内容を表す自然なh1を設定する |
h2〜h6の使い方
h2はページ内の大きな章の見出し、h3はその中の節、という形で階層を作ります。
階層を飛ばさない
h1の次にいきなりh3を使うのは避けましょう。Googleや読者がページ構造を把握しにくくなります。
<!-- NG: h2を飛ばしてh3 -->
<h1>サイト改善の方法</h1>
<h3>ページスピードの改善</h3>
<!-- OK: 階層どおりに使う -->
<h1>サイト改善の方法</h1>
<h2>パフォーマンス改善</h2>
<h3>ページスピードの改善</h3>
見出しにもキーワードを意識する
h2・h3にも、そのセクションに関連するキーワードを自然に含めると、ページ全体のテーマが伝わりやすくなります。ただし、無理に詰め込む必要はありません。
よくある間違い
見出しをデザイン目的だけで使う
「文字を大きく・太くしたいから」という理由でh2やh3を使うのは正しくありません。見た目の調整はCSSで行い、見出しタグは意味のある構造に使いましょう。
全ページで同じh1を使い回す
「サービス名」や「トップページ」をすべてのページのh1にしてしまうケースがあります。各ページはそれぞれ固有の内容を持つため、h1もページごとに変えるべきです。
| ページ | h1の例 |
|---|---|
| トップページ | 無料でSEO診断ができるツール |
| 会社概要ページ | 株式会社〇〇について |
| サービス紹介ページ | SEO改善サービスの内容と料金 |
h1とtitleタグを完全に一致させる必要はない
titleタグは検索結果に表示され、h1はページ本文の冒頭に表示されます。内容は近くて構いませんが、文字数や表現を少し変えることも問題ありません。
合わせて読みたい
- titleタグとSEO：h1タグとtitleタグの関係・違いを理解しておくとページ設計が整います
- 構造化データのSEO効果：見出し構造が整ったページに構造化データを追加するとリッチリザルトにも対応できます
- SEOチェックリスト20項目：見出し構造を含むオンページSEOの全チェック項目を一覧で確認できます
まとめ
- h1は1ページに1つ、メインキーワードを含めた自然なタイトルにする
- h2〜h6は階層を守って使い、ページの構造を分かりやすくする
- 見出しはデザインのためではなく意味のある構造を作るために使う
- 各ページ固有のh1を設定し、内容と一致させる
見出し構造はHTMLを直接見ると分かりやすいです。ChromeのF12で開発者ツールを開き、h1〜h3タグを検索してみると、意外な使われ方をしていることに気づくかもしれません。