これだけは知っておいた方が良い！見出しタグ（h1、h2タグ…）の使い方

コンテンツの要所にhタグを使用する

コンテンツの要所にhタグを使用sることでユーザーがコンテンツ内の認識をしやすくなります。

例えば本に目次がなければ、わかりにくいですよね。逆に多すぎても読みにくいです。

コンテンツの要所、切り替え部分を意識することで適切に使用できるようになります。

h2タグについてはこちらから↓

hタグは順番に使用する

複数の見出しサイズを正しい順序で使用すると、コンテンツの階層構造が作成され、ユーザーがドキュメント内を移動しやすくなります。

※引用元：検索エンジン最適化（SEO）スターター ガイド – Search Console ヘルプ

h2の中に必要であればh3タグを入れて細かく説明できるようにします。h1タグは毒しているタグではありません。ｈ１タグで書いたものをｈ2タグで細かく説明できるようにします。

h1＞h2＞ｈ３＞ｈ４＞ｈ5＞ｈ6がhタグの大きい順番です。

h1タグは複数使用可能？

ページ全体で控えめに見出しを使用する
見出しタグは意味のある場所で使用してください。ページ上の見出しが多すぎると、ユーザーがコンテンツを読みにくくなり、1 つのトピックがどこで終了して次のトピックがどこから始まっているのか判断しにくくなります。

• 避けるべき方法:
  • ページ内で見出しタグを過度に使用する。

※引用元：検索エンジン最適化（SEO）スターター ガイド – Search Console ヘルプ

h1タグは記事内で1つである必要はありません。ただし見出しタグが多すぎると良くないとGoogleもいってます。

h1タグは記事上と記事のまとめ部分にh1タグを入れると良いでしょう。記事のまとめ部分はh1タグが必須とは限りません。

厳選して適切な見出しタグを使用しましょう。

hタグの改行方法

hタグの改行は<br>タグで改行することが可能になります。

このようにHTMLを入れることでhタグでの改行を行うことができます。ただしhタグはあくまでも本文の見出しです。見出しが長すぎるとユーザーにとって見づらくそれをGoogleも認識することになります。

• 避けるべき方法:見出しが非常に長い。

※引用元：検索エンジン最適化（SEO）スターター ガイド – Search Console ヘルプ

hタグをCSSやHTMLでデザインする

hタグには大きさを変更したり、色を変えたりすることができます。

これで見出しタグを変更することができます。最初のh2は変更したいタグで文字色や背景色に関しては自分で色を選んで数字を入れる仕組みになります。

ページ内リンクを設定する

見出しタグにはページ内リンクを設定しておくことでユーザーが目次からコンテンツを探さなくても良くなります。ページ内リンクは適切に設定を行いましょう。