そんな疑問にお答えします。
今回は、見出しタグの正しい書き方をご紹介します。
「みなさん、何となく見出しを付けていませんか？」
この記事を読めば、読者が読みやすい記事を作ることができます。
また、見出しタグはSEOに効果があるため、正しい書き方を知っておきましょう。
見出しタグとは？
見出しタグとは、記事において見出しの役割があるタグです。
本や新聞にも見出しがあるように、Webページにも見出しをつけることができます。
見出しタグの種類と記述方法
見出しタグは、＜h1＞〜＜h6＞の6種類あり、数字が小さいほど重要度の高い見出しを意味します。
見出しタグの種類と記述方法は下記の通り。
<h1>見出し1</h1>
<h2>見出し2</h2>
<h3>見出し3</h3>
<h4>見出し4</h4>
<h5>見出し5</h5>
<h6>見出し6</h6>開始タグ＜h1＞と閉じタグ＜/h1＞の間に文章を入れることで見出しを作ることができます。
＜h1＞〜＜h6＞の見出しの違い
実際に、＜h1＞〜＜h6＞までコードを記述して、表示させてみました。
このように、＜h1＞が一番文字が大きく、一番重要度の高い見出しになります。
ポイント
＜h1＞が一番重要度が高く、＜h6＞が一番重要度が低い
実際に使用した見出しのデザイン
先ほどの見出しは、cssの編集を加えていないものになります。
ここで、cssで指定するとどのようになるのかご紹介します。
＜h1＞タグ
- メモ
- ＜h1＞タグは、記事のタイトルに使用されることが多いです。
＜h2＞タグ
- メモ
- ＜h2＞タグは、一番使用される多い見出しタグです。
＜h3＞タグ
- メモ
- ＜h3＞タグは、＜h2＞タグの補足説明をする際に使用します。
ポイント
cssでデザインすることで、一気にオシャレな見出しにすることができます。
見出しタグのSEO効果
見出しタグには、3つのSEO効果があります。
見出しタグのSEO効果
- 読みやすい記事が作れる
- 検索エンジンにページの内容を伝えることができる
- 見出しは目次欄に表示される
それでは、見ていきましょう。
読みやすい記事が作れる
見出しがあることで、読みやすい記事を作ることができます。
↓ 下記は、見出しがない記事です。
↓ 下記は、見出しがある記事です。
ご覧いただいて分かるように見出しがあることで項目ごとに区切ることができ、読みやすくなります。
では、「読みやすい記事がSEOにどう影響があるのか」
それは、ページの滞在時間に関わりがあります。
Googleは読者満足度の高いページを評価します。
仮に、ページ滞在時間が短いと「読者満足度の低いページ」とGoogleが判断し、Googleの評価を落とすことになります。
詳しくは、ブログの滞在時間を伸ばす方法5選【滞在時間はSEOにどう影響する？】で解説しています。
読者にとって、使いやすいサイトを提供する意味で導入しましょう。
読みやすい記事の書き方についてはこちらをご覧ください。
検索エンジンにページの内容を伝えることができる
見出しを入れることで、検索エンジンにページの内容を伝えることができます。
クローラーと呼ばれるプログラムがサイト内を巡回し、サイトの内容を把握する際に役立ちます。
詳しくは、クローラー、インデックスとは？検索結果に記事を表示させるためには？をご覧ください。
見出しは目次欄に表示される
WordPressのプラグインを入れることで、見出しタグに書かれた内容を目次欄に表示することができます。
目次を見ることで、「どのような内容が書かれている記事なのか」把握することができます。
目次は、ユーザビリティを高める項目なので、SEOの効果があります。
目次の作り方は、【目次作成】Table of Contents Plusの設定方法・使い方で解説しています。
見出しタグの理想的な使い方
続いて、見出しタグの使い方を紹介します。
見出しタグの使い方
- 適切な順番で記述する
- 見出しタグを多用・見出しタグのみの構成はNG
- タイトルと関係のない見出しはつけない
- 見出しに強調タグを使わない
- キーワードを詰め込みすぎない
それでは、見ていきましょう。
適切な順番で記述する
見出しタグは、＜h1＞〜＜h6＞の6種類あり、段階的に重要度が異なります。
見出しタグは適切な順番で記述しましょう。
<h1>見出し1</h1>
<h2>見出し2</h2>
<h3>見出し3</h3>
<h4>見出し4</h4>
<h5>見出し5</h5>
<h6>見出し6</h6>↓ こちらは誤った並び順です。
注意ポイント
＜h2＞がないのに＜h3＞を記述するのはNG
＜h2＞の前に＜h3＞を記述するのはNG
＜h＞タグを使うときは、＜h1＞から順に記述しましょう。
見出しタグを多用・見出しタグのみの構成はNG
「見出しタグを多用する」「見出しタグのみで記事を作る」ことはNGです。
↓ 例
見出しを使いすぎると、読みづらい記事になります。
実際、Googleも「見出しタグを多用することを避けるべき」だと名言しています。
避けるべき方法: ページで見出しタグを過度に使用する。
検索エンジン最適化（SEO）スターター ガイド（https://developers.google.com/search/docs/beginner/seo-starter-guide?hl=ja&visit_id=637599452944887309-263589743&rd=1#headingtags）より引用
タイトルと関係のない見出しはつけない
タイトルと全く関係のない見出しはつけないようにしましょう。
例えば、「2週間で1kg痩せるダイエット方法」というタイトルに対し、見出しが
- ＜h2＞鎌倉のデートスポット＜/h2＞
- ＜h2＞表参道でおすすめのカフェ＜/h2＞
のような見出しはNGです。
「2週間で1kg痩せるダイエット方法」というタイトルであれば、
- ＜h2＞毎晩食事を抜く※＜/h2＞
- ＜h2＞毎日30分ジョギングする※＜/h2＞
のような見出しをつけると関連性があり有効です。
（※例として挙げたので実際に効果があるかは分かりません）
見出しに強調タグを使わない
見出しに強調タグ＜strong＞を使うことはNGです。
見た目では差がないので分かりづらいですが、＜h＞タグに＜strong＞タグを入れてしまっている場合は削除しましょう。
strongタグについては、strongタグを使いすぎるとペナルティ？strongタグの正しい使い方で解説しています。
キーワードを詰め込みすぎない
キーワードは詰め込みすぎないようにしましょう。
例
＜h2＞韓国料理が美味しい韓国料理屋5選！韓国料理が好きな方必見です＜／h2＞
キーワードは、＜h＞タグにつき一つです。
まとめ 見出しタグは適切な順番で記述しよう
今回は、見出しタグの正しい書き方をご紹介しました。
見出しタグの使い方
- 適切な順番で記述する
- 見出しタグを多用・見出しタグのみの構成はNG
- タイトルと関係のない見出しはつけない
- 見出しに強調タグを使わない
- キーワードを詰め込みすぎない
上記の5つの点には注意して見出しをつけましょう。
SEOについての詳細は、【保存版】SEO対策とは？SEO対策の基本から今すぐできる対策を解説で解説しています。
本日は、以上です。
