HTML hタグの使い方

今回はSEOにおいても重要な見出しタグ（以降hタグ）のナナサン流と言うか一般的な使い方について書いていこうと思います。ホームページ制作に当たって必須事項なので、要チェックです。

hタグとは

hタグは、h1・h2・h3・h4・h5・h6の６種類あります。数字の少ない方が重みのある見出しになります。

ホームページでは各ページ、h1は１回しか利用しません。各ページで１度の記述になります。

• トップページ：サイトのタイトル
• 下層のページ：ページのタイトル

上記がh１となります。このブログでは、最初の見出し「HTML hタグ」がh1になります。

h2・h3・h4・h5・h6　は複数回使いますが、利用の多いのはh2・h3・h4あたりになります。適当にhタグを使うのではなく、きちんと順番を考慮して記述するよう心がけています。

コーディング例

どう言うことかというと、以下の例のようにh2の次はh1・h4とかではなくh3ということです。（sectionとarticleの使い方はまたの機械に）

<article>
　<h1>タイトル</h1>
　<p>概要概要概要概要概要概要概要概要概要</p>
　<section>
　　<h2>見出し（大）</h2>
　　<p>本文です本文です本文です本文です本文です</p>
　　<section>
　　　<h3>見出し（中）</h3>
　　　　<p>本文です本文です本文です本文です</p>
　　</section>
　　<section>
　　　<h3>見出し（中）</h3>
　　　<p>本文です本文です本文です本文です</p>
　　</section>
　</section>
　<section>
　　　<h2>見出し（大）</h2>
　　　<p>本文です本文です本文です本文です</p>
　　　<section>
　　　　<h3>見出し（中）</h3>
　　　　<p>本文です本文です本文です</p>
　　　</section>
　　　<section>
　　　　<h3>見出し（中）</h3>
　　　　<p>本文です本文です本文です</p>
　　　</section>
　　</section>
</article>

hタグはSEOに効くからといって、hタグだらけのページや無駄に長い見出しはあまりおすすめいたしません。ユーザーから見て理解しにくいサイトになるからです。また、Googleの検索エンジン最適化（SEO）スターターガイドでも似たような内容が記載されています。

https://support.google.com/webmasters/answer/7451184?hl=ja

hタグを適切に使って、人もに検索エンジンにも優しいサイトを心がけていきましょう。