H1タグの正しい書き方：完全ガイド

H1とは何か、検索エンジンに必要な理由

H1は、HTMLの第1レベルの見出しタグです。ページのメイン見出しを示し、そのページが何について書かれているかを表します。<title>タグはブラウザのタブと検索スニペットにしか表示されませんが、H1はページ上にそのまま表示されます。ページを読み込んだ直後に、ユーザーが最初に目にする要素です。

zoom_in

検索クローラーにとって、H1はオンページで最も強いシグナルの1つです。文書の主題を伝えます。titleが検索結果で「これは何のページか」に答えるなら、H1は、ユーザーがページに着いたあとで同じ問いに答えます。両者の意味が近いほど、検索エンジンに届くシグナルは明確になります。

数字で見るH1

構文は単純です。<h1>タグを<body>内に置き、メイン見出しのテキストを入れます。通常はページで最初に目立つ要素になります。WordPress、Webflow、ShopifyなどのCMSは、ページや投稿のタイトルからH1を自動生成することが多いですが、それが常に適切とは限りません。

<body>
  <h1>Buy Winter Welders' Workwear Wholesale</h1>
  <p>Catalogue of fire-resistant suits and gloves from the manufacturer...</p>
</body>

1ページにH1は1つ、常に

このルールは単なる推奨ではなく、正しいコンテンツ階層の土台です。ページにH1が複数あると、検索エンジンはどれがメインか判断できません。その結果、シグナルが分散して関連性が下がり、最悪の場合はどの見出しも主題として認識されなくなります。

ページの見出し構造は、本の目次に似ています。H1が1つ（本のタイトル）、H2が複数（章）、各章の中にH3（節）が並びます。この階層を崩すと、機械による読み取りやすさが下がり、クロールも複雑になります。

良いH1の書き方

良いH1は、広告のキャッチコピーでも、キーワードの羅列でもありません。ユーザーがそのページで何を見つけられるかを、正確かつ具体的に書いたものです。実際のプロジェクトでも通用する原則を紹介します。

H1とtitleタグの違い

H1とtitleは混同されがちで、どちらの書き方も誤りやすくなります。違いを理解すれば、それぞれを正しく使い分けられます。

最善の方法は、H1とtitleの意味を揃えつつ、表現は変えることです。titleは短くして、検索結果でのCTRを意識して整えます。H1はやや長めにして、すでにページに着いたユーザーに向けて書きます。両者の差が大きいと、GoogleがH1を使ってtitleを書き換える最大の要因になります。

良いH1と悪いH1の例

10個のルールより、並べて比べたほうがよくわかります。以下はSEO監査で実際に見かける場面で、それぞれの案がなぜ有効か、なぜ失敗するかを説明します。

パターンに注目してください。悪いH1はページの種類（「カタログ」「サービス」）を述べているだけで、良いH1は具体的な内容を述べています。クローラーは「カタログ」という言葉から内容を推測できません。具体性が求められます。

よくある間違いと避け方

数百のサイトの監査で、同じ間違いが繰り返し見つかります。原因と対処を添えて、短くまとめます。

• H1がない。 H1のないページは、オンページの主要なシグナルの1つを失います。独自テンプレートや、サイト移行後によく起こります。Screaming Frogの「H1 → Missing」で見つけます。
• ページにH1が複数ある。ビジュアルビルダーが、見た目を整えるためにブロックをH1で囲むことが主な原因です。Screaming Frogの「H1 → Multiple」で見つけます。対処：H1は1つにして、残りはH2かdivに置き換えます。
• H1がサイト名になっている。 CMSのテンプレートが、全ページのH1にサイト名を入れてしまいます。サイト全体で重複が発生し、関連性もゼロになります。対処：ページの種類ごとにテンプレートを設定します。
• H1がページの主題と合っていない。内容は溶接の安全基準なのに、H1が「作業服を購入」になっている状態です。クローラーはずれを検知します。対処：H1は、文書の内容を正確に反映させます。
• キーワードの詰め込み。「作業服 購入 作業服 卸売 価格 作業服」はSEOではなく、フィルターに引っかかる原因です。自然な形でキーワードを入れるのは、多くても1回です。
• H1が画像の中にある。画像内のテキストはクローラーに見えません。デザインされた画像のように見せたい場合でも、H1は必ずHTMLマークアップに書きます。
• H1を非表示にしている。 display: noneやvisibility: hiddenは、Googleが操作とみなし、タグを無視したりページを減点したりすることがあります。

FAQ

H1タグについて、監査や相談でよく寄せられる質問に答えます。