2015/10/10

h1 h2 h3などの見出しタグの重要性と正しい順序

区切り線

htag_01

文章構成をユーザーに見やすいように調整したり、検索エンジンにキーワードをアピールするときに使える「hタグ」主に見出しや段落を整理するために使われるタグで数字によって種類も様々です。

hタグには、「h1」「h2」「h3」….と数字がいくつもありますが、見出しの重要度によって数字によって振り分けて使うのが一般的と言われています。

記事ページを作るうえで順序が重要

このhタグをページ内に組み込みページを生成する場合は、hタグの数字の順序を考慮して配置する必要があります。

あらかじめcssにデザインを組み込んでおくとかなり使い勝手が良いタグなだけに、数字の順序が守られてないサイトを見ることもしばしば。

SEO対策を施すうえで検索エンジンがわかりやすいようにページを構成するためにも必要なものになるため、今一度順序についてはSEO対策をする上で知識を入れておく必要がありそうです。

具体的な正しい順番は?

使用するタグの数字がページ内に順番に配置されることを目安に使用すると簡単に正しく配置することができます。

例えば…..

<h2>h2の見出し</h2>

テキストテキストテキストテキストテキストテキストテキストテキスト

<h3>h3の見出し</h3>

テキストテキストテキストテキストテキストテキストテキストテキスト

<h3>h3の見出し</h3>

テキストテキストテキストテキストテキストテキストテキストテキスト

 

というようにページ内に、「h1 ⇒ h2 ⇒ h3 ⇒ h4」というような順序になるように配置をすれば正しい状態になります。

避けたい例は「h1 ⇒ h3 ⇒ h3 ⇒ h4」と歯抜けになっていたり、「h1 ⇒ h3 ⇒ h2 ⇒ h4」と順序が逆になっていたりする場合です。

ブログなどを書く場合は、ほとんど記事タイトルがh1タグに振り分けられるため、記事内で使う一番最初の見出しは「h2」から使えばまず間違いはないです。

もし、心配であればソースを確認しページ内にh1とh2などが、現状で何個あるのかを確認しておくようにしましょう。

hタグを使用する回数に制限は?

hタグを使用する回数に制限は?

h1タグ以外は、特に使用回数に制限はありません。h2やh3などは大きな見出しとなることが多いためたくさん使われると思います。

「h1タグは1ページで一回の使用で抑え、数字の順序をしっかり守ること」これを守っていれば使用になんら問題はありません。ただ、html5の場合は1ページにh1タグが複数あっても問題ありません。

記事タイトルがh1になっている状態で、ロゴの部分がh1になっていても問題ないということです。

ちなみに僕が一番好きな形は「h1 ⇒ h2 ⇒ h2 ⇒ h3 ⇒ h3 ⇒ h3 ⇒ h2 ⇒ h3 ⇒ h3 ⇒ h2」こういった具合の記事構成です。

自分の好きな段落構成で考えると文章も必然的にそういった方向になりがちかもしれません。

Googleのマット・カッツさんは「気にする必要はない」と言っている

youtubeの動画でも公開されているのですが、Googleのマット・カッツさんは

「WEBサイトを作っていてh1タグがh2タグの次に来てしまうのですが問題ありますか?」という質問に対して「順番は気にする必要はない」と発言しています。

この見解には納得です。WEBサイトの運用にあまり慣れてない管理者だった場合は、特にhタグの順序など気にせずにサイトを展開してしまうことがほとんどだと思います。

しかし、順序がいくらバラバラだとはいえど、ユーザーに閲覧されるべき情報が眠っている可能性があるのは明白で検索エンジンは有益な情報を検索結果に表示させるために、そういったサイトも評価することが考えられます。

現に僕が様々なキーワードで検索しhタグの順序がバラバラになっているサイトに行きついているところを考えても、検索結果に多大な影響を与える部分とは考えにくいといえるからです。

神経質になりすぎなくていい

マット・カッツさんの回答を見ると「あ、なーんだ、じゃあ気にせずやりたいようにやろう」と思ってしまいがちですが

実際には、hタグの順番が整理されているサイトと、されてないサイトでは検索エンジンと閲覧ユーザーが見やすいと感じるのは整理されている方なのは明白なので、たとえ有益な情報が載っていたとしても、順位が上昇する動きの初速が変わってくるのは間違いないと推測することができます。

つまり、神経質に整理しまくらなくても大丈夫だけどできるだけ気を付けよう。という気持ちぐらいがちょうど良い加減といえます

hタグの順序についてのまとめ

いかがでしょうか?

自身の執筆した記事を見てみると、意外とこの順序がバラバラになっていることがあるかもしれませんが、ほとんどがSEO対策を過剰に気にするあまり、タグにキーワードを入れ込み、変に配置をしてしまった場合に起きていると考えられます。

「タイトル ⇒ 大見出し ⇒ 小見出し ⇒ 大見出し」(本のような使い方のイメージをするとわかりやすいです)

閲覧するユーザーのことを考え執筆していくことで、自然と記事や段落はこの順序になるはずです。上記で検索結果にはあまり影響がないと書きましたが、初速に影響していくることは間違いないので、もし「あっ!」と感じた人は今一度自身の記事構造を見直してみては?

閲覧者のことを考えた段落区切りで、記事ページを更新していくように心がけましょう。

  • このエントリーをはてなブックマークに追加

区切り線

コメント

  1. […] 参考サイト ・divとsectionとarticle要素それぞれの特徴、使い分けと組み合わせ方 -HTML5のセクショニング コンテンツ ・h1 h2 h3などの見出しタグの重要性と正しい順序 […]

  2. […] h1 h2 h3などの見出しタグの重要性と正しい順序 […]

コメントをどうぞ

メールアドレスが公開されることはありません。