見出しタグ(hタグ)の使い方とは?SEOと読みやすさの両方に影響

見出しタグ(hタグ)の使い方とは?SEOと読みやすさの両方に影響

ウェブコンテンツの見出しは、ただフォント数を大きくして太字にすればよいというものではありません。対象の文章が見出しであることを検索エンジンに認識してもらうためには見出しタグを利用する必要があります。見出しタグ(hタグ)はウェブページのコンテンツを作る上で意識すべき重要なタグです。使い方をしっかりと覚えて、コンテンツ制作の際には必ず使うようにしましょう。

見出しタグとは

見出しタグは、ウェブページを作成する言語であるHTMLにおけるタグの1つです。タグとはページの構造を指定するときに使われる文字列のことですが、見出しタグはその名の通り見出しを指定するために用いられます。
見出しタグは<h1>、<h2>といった文字を用いて記述し、hタグと呼ばれることもあります。実際にこのタグで重要な文章を指定すると、ブラウザーでコンテンツを見た際、対象の文章は太く、大きな見出しとして表示されます。h1が最も大きな見出しとなり、h2意向、数字が大きくなるほど文字のサイズは小さくなります。

実際に目で見て比較してみましょう。

ーーーーーーーーーーーーーーーーーーーーーー

これはh2の見出しです

これはh3の見出しです

ーーーーーーーーーーーーーーーーーーーーーー

いかがでしょうか。通常の文章の筆記と同じく、重要な見出しほど、大きく太くします。
タグは<h1>から<h6>まで6種類使うことができ、数字が大きいものになるにつれ、見出しとしては小さくなっていきます。つまり、<h1>が最も大きな見出しで、次に大きい見出しが<h2>、その次に大きい見出しが<h3>…といった具合です。

見出しタグはテキストコンテンツ(文章)を読みやすくする

見出しタグを使うメリットの1つは、見出しを作ることでページに書かれたテキストコンテンツ(文章)が読みやすくなり、ユーザビリティが向上することです。
ウェブ以外の文章でもいえることですが、見出しが全く無いと、特に長い文章の場合は読みづらくなります。見出しで構造を明確にすることで、情報の整理が容易になり、文章が読みやすくなります。読みづらい文章は、ユーザーが簡単に離脱してしまう可能性があるため、見出しで文章を整える必要があります。

見出しタグとSEO

SEOとは主にページを検索エンジンの検索結果で上位表示させるための最適化のことで、見出しタグにはSEOへの良い影響があります。

検索エンジンは検索順位を決める過程でロボットに各ページを読み込ませています。ページ側はロボットにコンテンツの情報を正確に伝えることが重要ですが、見出しタグはこの情報の伝達において効果を発揮するのです。ロボットは見出しの内容を読み取りながら、そのコンテンツにはどのようなことが書かれているかをデータとして蓄積します。そして、その読み取った内容がユーザーが求める情報と合致していると判断した際に、検索結果として表示をしています。しっかりとした見出しをつける事で、検索エンジンにコンテンツの情報をしっかりと伝えることができます。

見出しタグと階層構造

見出しタグで見出しを指定する意義は、ページのコンテンツ構造を明確にしてユーザーと検索エンジンの両方にとって読みやすくすることです。そのため、見出しタグを用いる際はその階層構造を意識する必要があります。

これはそんなに難しい話ではなく、見出しの順序に気をつけるということです。見出しはまず大きな見出しを使用し、その次に小さな見出しが来るようにします。つまり、<h1>をまず使い、次に<h2>、その次に<h3>というように使っていくということです。最初から<h3>を使ったり、<h1>を使った後にいきなり<h3>を使ったりすると階層構造が崩れるため、読みにくいコンテンツとなります。このような方法はあまり推奨されません。

見出しタグの記述方法

見出しタグの記述方法は簡単で、見出しとして表示させたい箇所を囲うだけです。例えば「見出しタグの記述方法」という文を<h1>の見出しとして表示させたい場合は、以下のように記述します。

<h1>見出しタグの記述方法</h1>

見出しタグを使うときに気を付けること

見出しの順序以外にも、いくつか気を付けることがあります。

<h1>の使用は一度だけ

見出しタグの中で最も大きな見出しを表示させるタグ<h1>は、その使用を1ページにつき一度だけにとどめるのが基本ルールです。

見出しにはできるだけキーワードを含めるようにする

SEOにおいては検索エンジンに主要なキーワードを伝えることが重要です。見出しにキーワードを含めることで、検索エンジンのロボットが認識しやすくなります。特に大きな見出しは重要度が高いといわれているため、意識してキーワードを含めることが推奨されます。ただし、過剰な詰め込みはしないようにしましょう。

見出しタグは見出し以外に使用しない

見出しタグで見出しを指定した部分を実際にページ上で見ると、多くは太字になっています。さらにページによってはその部分にさらに特別なデザインが施されることもあります。そのため、見出しと関係のない文中の特定の箇所を強調したり目立たせたりするため使っているサイトがまれに見受けられます。
しかし、見出しタグの大きな目的はあくまでコンテンツの構造を明確化して読みやすくすることです。見出し以外の箇所でタグを乱用して階層構造を崩してしまっては元も子もないため、そのような使い方は避けるようにしましょう。

ページを読むユーザーにとっても、SEOの観点からも、見出しタグは重要です。構造を意識し、適切な見出しタグを使うことは、読みやすさにもつながるため、コンテンツライティングには重要なタグです。
使いどころがまだ理解しづらいという方は、いろいろなページをチェックしてどのように見出しが使われているかを参考にしてみましょう。



サイトエンジンかくたま編集部は、企業様のコンテンツ制作やインタビュー記事制作、オウンドメディア運用やディレクションサポートなどを承ります。 コンテンツ制作にお悩みのWEB担当者様は専用サイトからご相談ください!
かくたまライティング法人申し込みサイト


ライターさん絶賛募集中です!
〇ライター応募サイト
一覧

かくたまブログは、サイトエンジン株式会社が運営するWebライター応援メディアです。
オウンドメディア や自社サイトの運用に悩むディレクション担当者やライターの悩みを減らすための情報をお届けしています。