HTML・CSS:見出しを作るh1,h2,h3,h4,h5,h6

h1,h2,h3,h4,h5,h6タグとは

h1,h2,h3,h4,h5,h6、これらのタグは見出しを意味するタグで、まさに今いちもんじも使っています。
このページを例に言うと一番上にある見出し「HTML・CSS:見出しを作るh1,h2,h3,h4,h5,h6」というのが<h1>タグを使った見出しになっていて、その下にある「h1,h2,h3,h4,h5,h6タグとは」というのが<h2>タグを使った見出しになっています。

値が小さければ小さいほど重大な見出し

<h1>が一番大きな見出しで、<h2>が<h1>よりも少し小さな見出しという感じに、数字が大きくなるにつれてだんだんとその重大さが薄くなっていきます。パワーバランスとしてはこんな感じ↓

<h1> >>> <h2> >>> <h3> >>> <h4> >>> <h5> >>> <h6>

そのコンテンツの内容によって、重要か重要でないかを判断し、この内容ならこのくらいの重大さかな~?と言った感じで設定していきましょう。

同じ見出しタグを何度でも使用できる

例えば本当に大事な見出しを2カ所に付けたいんだ!という場面があったとして、<h1>を2つ付けることもできます。しかしそうなるとすると、逆にページを分けたほうがいいのでは…?といちもんじは思います。<h1>を同じページで複数使うことはほとんどなく、<h2>以下ならば頻繁にいくつも使用します。現に今も使用してます。何度も使えるのは<h1>だけでなく<h6>までしっかりと使うことができます。ご安心ください(?)

見出しタグの使い方

<h1>ここが見出しになるよ~</h1>
<h2>そんでここがサブ見出し的な~?</h2>

と言った感じで、<h●>開始タグと</h●>終了タグで、見出しにしたい文字を囲うだけで使うことが可能です。

SEOの観点

この見出しを示すタグはSEOの観点から言っても大きな意味を持つといわれてきました。タイトル部分にキーワードを埋め込むと、Googleさんが巡回をしているときにどういった内容なのかわかりやすいということで、この見出しを有効に使うことがSEO対策にも役立つと思われます。(まあ時代は変化していくのでなんとも言えないところはありますけどね。)
ページの内容に沿っていないタイトルを付けるよりも、そのページに合った見出しを付けることをお勧めします。

タイトルとURLをコピーしました