h1・h2タグの正しい使い方とよくある間違い｜SEO効果を高める見出しのルール

「h1は1回だけ」「h2の次はh3」……そんな見出しのルールに縛られすぎていませんか？実は、間違った使い方はSEO評価を下げるだけでなく、読者の離脱を招く原因になります。本記事では、最新のHTML標準に基づいた『正解』と、プロが必ず避ける『致命的なミス』を分かりやすく解説します。

見出しタグ（h1〜h6）の役割とSEOに与える影響

Webページにおける見出しタグ（h1〜h6）は、単なるデザイン上の飾りではありません。SEO（検索エンジン最適化）とUX（ユーザー体験）の両面において、ページの「骨格」を形成する極めて重要な要素です。

まずSEOの観点では、Googleのクローラー（検索ロボット）に対して、ページの階層構造やトピックの重要度を正確に伝える役割があります。検索エンジンは、hタグに含まれるテキストを解析し、そのページが「何のテーマについて書かれているか」を判断しています。つまり、適切な見出しを設定することで、インデックスの精度を高め、狙ったキーワードでの上位表示をサポートする土台となります。

また、ユーザーにとっては、見出しは「流し読み」をする際の道しるべとなります。多くのWebユーザーは記事を一言一句読みません。見出しをスキャンして、自分に必要な情報があるかどうかを判断します。論理的で分かりやすい見出し構造は、ユーザーの直帰率を防ぎ、滞在時間を延ばす効果（SEOへの間接効果）も期待できます。

【図解】h1・h2タグの正しい使い方と階層構造のルール

見出しタグを正しく使うための基本原則は、「書籍の構成」と同じだと考えてください。h1〜h6の数字は、階層の深さを表しています。

h1（大見出し）：ページの主題

原則として、そのページで最も伝えたいメインテーマです。書籍で言えば「本のタイトル」にあたります。検索結果に表示されるタイトルタグと一致、またはそれに準ずる内容を設定し、ユーザーと検索エンジンの双方に「このページは何についての記事か」を宣言します。

h2（中見出し）：記事の主要なセクション

h1を支える大きな章立てです。記事をいくつかの主要なトピックに分割する際に使用します。検索意図（ユーザーが知りたいこと）を網羅する構成要素となります。

h3（小見出し）以降：詳細な解説

h2の内容をさらに掘り下げて解説する場合に使用します。h2の中にh3が含まれ、さらに詳細が必要ならh4を使う、という「入れ子構造」になります。

【正しい階層構造のイメージ】

• h1：SEO対策の完全ガイド
  • h2：SEOとは何か？
    • h3：SEOの定義
    • h3：SEMとの違い
  • h2：SEOのメリット・デメリット
    • h3：3つのメリット
    • h3：2つのデメリット

このように、情報は大きい単位から小さい単位へと整理されていなければなりません。h2の中にいきなりh4が登場したり、h2とh2の間に独立したh3が存在したりする構造は、論理的に破綻しており、クローラーの混乱を招きます。

初心者がやりがちな「h1・h2タグの間違い」ワースト5

私が多くのWebサイトを診断する中で頻繁に目にする、避けるべき典型的なミスを5つ挙げます。これらは「HTMLの文法違反」というだけでなく、SEO評価を損なう要因となります。

1. 階層のスキップ（h2 → h4）
   デザインの都合などで、h3を飛ばしてh4を使ってしまうケースです。見出しは見た目の調整ツールではなく、文書構造を示すものです。必ず「h2 → h3 → h4」と順序を守ってください。
2. デザイン目的の使用
   「文字を太く大きくしたいから」という理由だけで、本文中の強調したい箇所をhタグで囲うのは間違いです。見た目の装飾はCSSで行い、意味的に見出しである箇所にのみタグを使用します。
3. キーワードの過剰な詰め込み
   「SEO 東京 格安 おすすめ」のように、単語を羅列しただけの見出しはスパム判定を受けるリスクがあります。自然な文章として成立させつつ、キーワードを含めるのが鉄則です。
4. alt属性のない画像h1
   トップページのロゴをh1にする場合、画像に alt='サイト名' などの代替テキストが設定されていないと、検索エンジンにh1の内容が伝わりません。
5. 長すぎる、または内容のない見出し
   3行にもわたる長い見出しや、具体性のない「はじめに」「まとめ」だけの見出しは、検索エンジンにとって情報の価値が低いと判断されがちです。見出しだけで内容が推測できる簡潔さを意識しましょう。

「h1タグは複数使ってもいい？」最新のHTML標準とSEOの真実

ここが多くの担当者が混乱するポイントです。結論から言うと、Web標準仕様（HTML Living Standard）において、h1タグを1ページに複数回使用することは文法的に間違いではありません。

かつて（HTML4以前）は「h1は1ページに1回」が絶対ルールでしたが、HTML5以降は、section や article といったセクションタグで区切られていれば、各セクション内にh1が存在しても構造として正しいとされています。

しかし、SEOの実務においては話が別です。

Googleのジョン・ミューラー氏なども「h1を複数使っても問題はない」と発言していますが、同時に「システムがページの主テーマを理解しやすくする」ことの重要性も説いています。h1が乱立していると、結局「そのページで一番言いたいこと」が分散してしまい、検索エンジンが重み付けに迷う可能性があります。

また、WordPressなどの主要なCMSやテーマの多くは「h1は1回」を前提に設計されています。あえて複数使うメリットよりも、構造が複雑化するリスクの方が大きいため、「h1はページ全体の主題として1回のみ使用する」という従来の運用を続けるのが、最も効率的で安全な戦略です。

検索順位に貢献する「見出しのライティング」3つのポイント

見出しタグの設置ルールを守った上で、さらにSEO効果を高めるためのライティング技術には3つの鉄則があります。

1. キーワードは「左寄せ」の法則
   人は左から右へ文字を読みます。検索エンジンも文頭の単語を重要視する傾向があります。例えば「SEOにおけるh1タグの重要性」よりも「h1タグの重要性とは？SEOへの影響を解説」のように、重要な単語を左側に持ってくる工夫が有効です。
2. 検索意図（インサイト）の網羅
   見出しを見ただけで、ユーザーが「自分の知りたいことがここに書いてある」と確信できるようにします。「h1タグについて」という曖昧な見出しではなく、「h1タグの正しい書き方と文字数」のように、具体的なベネフィットを提示してください。見出しだけで記事の要約になっている状態が理想です。
3. 簡潔さとインパクトの両立
   スマホでの閲覧を考慮すると、見出しが長すぎると改行が増えて読みづらくなります。30文字〜40文字程度を目安に、冗長な表現を削ぎ落としてください。

装飾目的の見出しはNG？CSSとの使い分けを徹底解説

Web制作の現場では「構造（HTML）」と「表現（CSS）」の分離が鉄則です。

初心者がやりがちなのが、ブログの編集画面で「文字を大きくしたいから」という理由で、本文中の注意書きをh2タグに設定してしまうミスです。これを行うと、検索エンジンは「ここから新しい章が始まった」と誤認してしまいます。

• HTML（h1〜h6）： ここは大見出し、ここは小見出し、という「意味」をマークアップする。
• CSS（スタイルシート）： 見出しの文字サイズ、色、背景、余白などの「見た目」を指定する。

もし特定の段落を目立たせたい場合は、<p class='highlight'>...</p> のようにクラスを付与し、CSSで装飾を行うのが正解です。見出しタグは、あくまで文書のアウトラインを作るためだけに使用してください。

公開前にチェック！見出し構造のセルフ診断リスト

最後に、記事を公開する前に必ず確認すべき「即効チェックリスト」を提示します。これらをクリアしていれば、見出しに関するSEOの技術的な要件は満たしています。

【見出し構造 セルフ診断リスト】

• [ ] h1タグはページ内に1つだけ設定されているか？
  （特別に意図した設計でない限り、1つに絞る）
• [ ] h1タグに「対策キーワード」が含まれているか？
• [ ] 見出しの階層順序は正しいか？
  （h2の中にh3があるか。h2 → h4のように飛んでいないか）
• [ ] 見出しだけで記事の内容がおおよそ理解できるか？
  （目次生成プラグインなどでプレビューしてみる）
• [ ] デザイン調整のためだけに使われているhタグはないか？
• [ ] 各見出しの下に、十分な本文コンテンツが存在するか？
  （見出しだけが連続していないか）
• [ ] h1とtitleタグの内容に矛盾はないか？

このリストを社内の運用マニュアルや、ご自身の執筆フローに組み込んでください。迷ったときは「書籍の目次として自然かどうか」に立ち返ることで、大きく外すことはなくなります。論理的な構造は、AIやアルゴリズムだけでなく、何より画面の向こうにいる読者のための「おもてなし」であることを忘れないでください。