見出しタグHタグ)の意味と重要性について解説します。

SEOライティングにとってHタグは極めて重要です。使い方を間違えると、逆効果とまでは言いませんが、SEO効果を弱めることになるかもしれません。

Hタグの意味

Hタグとは、googleロボットにWEBページに書いてある内容を伝えるために、HTMLでマークアップする見出しタグのことです。

Hタグには、h1,h2,h3,h4,h5,h6まであります。

※マークアップとは?

Webサイトを作成する時に使用するhtmlという言語でサイト内の文書に意味づけをしていく作業のことです。

htmlでマークアップしなければ、機械は意味を理解できません。

<h1>大見出し</h1>

こうしてマークアップすることで、検索エンジンは<h1></h1>で囲まれている部分を「ああ、大見出しね」と理解します。

Hタグのほかにも例えばPタグというものもあります。

<p></p>で囲んだ部分を段落(paragraph)と理解します。

Hタグは検索エンジンだけではなく、ユーザーにとっても重要です。

Googleは「検索エンジン最適化(SEO)スターター ガイド」で次のように述べています。

見出しタグはタグに囲まれているテキストをページ上の通常のテキストよりも大きく表示するため、ユーザーにとってはそのテキストが重要であるという視覚的な手がかりとなり、見出しテキストの下に続くコンテンツの内容について理解しやすくなります。

(引用:検索エンジン最適化(SEO)スターター ガイド

このようにHタグには、ユーザーと検索エンジン双方に、ページの重要部分を伝えるという意味があります。

Hタグの重要性(SEO効果)

Hタグの重要性について解説する前に、そもそも「見出し」とはどういう役割を持っているのか確認しておきましょう。

なぜなら「見出し」の使い方を間違っている人をときどき見かけるからです。

見出しとは、デジタル大辞泉の解説によると次のように説明されています。

見出しとは?

1 新聞・雑誌などで、記事内容が一見してわかるように、文章の前に示す簡単な言葉。標題。タイトル。

(出典:コトバンク

つまり、見出しとは、その後に続く文章の要約的な内容になります。

逆に言うと、見出しの後の文章は、見出しを説明するものということです。

それにも関わらず、見出しタグを次のように使っていることを見かけることがあります。

<h2>Hタグの重要性</h2>

<h3>見出しとは?</h3>

上記のようにh2の後にすぐh3タグを使っているのです。

これでは<h2>Hタグの重要性</h2>について何の説明もないことになってしまいます。

ブログにおいて見出しタグを使ったあとには、それを説明する<p>タグが必要です。

<h2>Hタグの重要性</h2>

<p>Hタグの重要性について解説します。</p>

<h3>見出しとは?</h3>

<p>しかしその前に、そもそも見出しとは何かについて確認しておきましょう。</p>

簡単に言うと、本来は上記のようにするべきです。

なぜHタグにSEO効果があるのか?

HタグにSEO効果があると考える理由は2つあります。

①Googleのロボットに記事の内容を伝える

②Hタグを目次にすることで滞在時間が長くなる

それぞれ説明します。

①Googleのロボットに記事の内容を伝える

先ほども書いたように、htmlでマークアップせず、テキストだけを並べても、ロボットは見出しも本文も区別がつきません。

HTMLタグの中でもHタグは検索エンジンとユーザーの両方にWEBページの中で重要なことを伝える働きがあります。

②Hタグを目次にすることで滞在時間が長くなる

ワードプレスでブログを運営する場合は、Hタグで作った見出しがブログの目次になります。

HTMLで目次を作る場合も多くはHタグを元に作ることが多いでしょう。

つまりHタグはその記事の「目次」として使うことが多いのです。

下記の記事でブログ目次の作り方を解説しました。

この記事の中で解説しているように、目次には大きなSEO効果がありいます。

目次をつけるかどうかで滞在時間に大きな差が出るのです。

その記事(もしくはWEBサイト)の滞在時間はSEOに大きな影響を与えると考えられます。

滞在時間が長い=しっかり読んでいる=読者満足度が高い

一般的にはこのように考えられるからです。

Hタグの正しい使い方&意識すること

ここからはHタグの正しい使い方とHタグを使う上で意識したいことを具体例とともに解説します。

①順番に使う
②重要な箇所だけに使う
③Hタグには狙うキーワードを含める
④H1タグの使い方
⑤画像にHタグを使ってもOK?
⑥Hタグで論理構造を作る
⑦Hタグだけで記事の内容がわかる

それぞれについてみていきましょう。

①順番に使う

Hタグはh1~h6まであります。実際にはh5、h6を使うことはほとんどないと思います。

また、h1はWordPressを使っている場合、ほとんどのテーマで、自動的にタイトルに<h1>が付くようになっています。

ですので、実質的に記事内で使うHタグはh2~h4であることが多いでしょう。

そしてh2~h4は順番に使うことをおすすめします。

つまり、下記のような使い方はしないということです。

間違った使い方

h3 → h2 → h4 という順番になっています。

正しい使い方

正しくはこうですね。

Googleの見解

ここまで書いておいて言うのも気が引けますが、実はグーグルは公式的にはHタグの順番はどうでもいいと言っています。

(出典:見出しがh1→h2→h3の順でないと、SEOに悪影響あったりします?

Hタグの順番についての質問に、Googleのジョン・ミュラーは次のように答えています。

実際には問題にならない。ページの内容を理解するために見出しタグを多少は使っているが、厳密に正しい順番である必要はない。

(出典:見出しがh1→h2→h3の順でないと、SEOに悪影響あったりします?【SEO記事12本まとめ】


本当のところは?

上記のような回答がありましたが、本当のところはわかりません。

ただ、思うのはグーグルって論理的な美しさを重視するのではないかということです。

だって、創業者のひとり、セルゲイ・ブリンは天才的な数学者ですからね。

数学って論理そのものですから。

順番が違っていると、違和感があるし、論理的に美しくないですよね。

これは、Googleに対してというだけでなく、ユーザーに対しても同じです。

論理的に階層構造がキッチリしている文章と、あちらこちら話が飛ぶ文章はどちらが読みやすく、理解しやすいかという話です。

私自身は、Hタグは多くの方が述べているように階層構造を意識して、順番を守って使っています。

②重要な箇所だけに使う

Hタグは重要な箇所だけに使いましょう。

学生さんでよく教科書の重要な部分にマーカーで色を付ける人がいますが、ページ中マーカーだらけで、結局重要なところがわからない、っていう教科書ありますよね。

それと同じで、ブログ記事内でHタグを使いまくると、結局重要なところがわからなくなってしまいます。

Hタグは重要な箇所にだけ使いましょう。

③Hタグには狙うキーワードを含める

では、重要な箇所とは何でしょうか?

記事を作成する上で重要な箇所とは狙うキーワードのことです。

この記事の見出しは以下のようになっています。

そしてこの記事で狙っているキーワードは次の3つです。

・Hタグ 意味
・Hタグ 効果
・Hタグ 使い方

それぞれのキーワードをH2タグに含めています。

このように、Hタグには狙うキーワードを含めることで、ユーザーにも何について書いた記事なのかわかりやすくなります。

しかし、無理にキーワードを詰め込んで不自然な日本語になることは避けるべきです。

④H1タグの使い方

H1タグは1ページにつき一つだけ使うようにします。

これについてもGoogleのジョン・ミュラーは「好きなだけ使ってOK」と回答しています。

しかし、やはりH1タグは1ページにひとつがおすすめです。

H1タグは、そのページでもっとも重要なテキストに対して使用するものです。

そのページで最も重要なテキストとは、「タイトル」のことです。

ワードプレスの多くのテーマでは、タイトルに<h1>が設定されます。

したがって、記事内ではh2から使い始めるのが良いでしょう。

⑤画像にHタグを使ってもOK?

見出しタグは主にテキストで使用されますが、画像にもhタグを適用することはできます。

しかし、Googleはウェブマスター向けガイドラインで次のように述べています。

重要な名前、コンテンツ、リンクを表示するときは、画像ではなくテキストを使用します。テキスト コンテンツの代わりに画像を使用する必要がある場合は、alt 属性を使用して簡単な説明テキストを組み込みます。

(出典:ウェブマスター向けガイドライン

画像にHタグを使う意味はないということです。

⑥Hタグで論理構造を作る

「①順番に使う」のところでも書きましたが、Hタグを使うことで、論理構造をはっきりさせるように意識します。

論理構造をはっきりさせるとは、同じHタグには同じレベルの概念を入れるということです。

例えば次のような構造は間違ってはいませんが、直感的におかしいと感じるでしょう。

これならどうでしょう?

何が言いたいかというと、同じ階層には同じレベルのものを並べるべきだということです。

これを意識すると、記事は論理的に作りやすくなります。

h2、h3、h4にそれぞれ同じレベルの概念を入れるようにします。

⑦Hタグだけで記事の内容がわかる

上記の「⑥Hタグで論理構造を作る」とも関連しますが、Hタグを順番に見ていっただけで、記事の内容がわかるように作ることが重要です。

ワードプレスの場合は、Hタグが目次になりますので、目次を見ただけで記事の内容がわかり、さらに読者が目次を見て、本文を読み進めたいと思ってもらわなければなりません。

WEB記事の場合、目次がなければ、サーっとスクロールして、知りたいことが書いてありそうかどうか判断されることが多いです。

スクロールしてザっと見る場合、目につくのは「見出し」つまりHタグです。

目次を設置しようとしまいと、記事を読んでもらえるかどうかの最重要ポイントが見出しと言えるでしょう。

例えば、この記事は目次が次のようになっています。

「ああ、だいたいHタグの使い方とかについて書いてありそう」というのはパッと見てわかっていただけると思います。

これが次のような見出し(目次)だったらどうでしょう。

SEOライティングの知識が少しでもある人が、こんな見出しを作ることはないと思いますが、まあ読みたくはならないですよね。

これで読んでもらえるのは人気芸能人のブログだけです。

また、次のような見出し(目次)も読みたくならないですよね。

見出しは「文章にしない」「改行が必要なほど長くしない」というのも重要なポイントです。

見出し(目次)は読んでもらうものではなく、見てもらうもの、と思っておきましょう。