SEO

h1タグとtitleタグの違いは?wordpressのテーマを利用していると分かりにくい。

こんにちは。この記事ではSEO対策で大変重要な項目とされているh1タグとtitleタグってそもそもどう違うんや!という話をまとめていきます。

アイキャッチ画像は、いつものようにせっせと記事を書いている時の画面。でここでふと疑問に。Lion blogの見出しに「見出し1」がないではないか!!

H1タグとTitleタグの違いとは?

H1タグ=Titleタグであり、記事タイトルなのか?これ分かりにくくないですか?

答えから言うとそういう場合もあるし、違う場合もある。です。

 

一昔前のようにHTMLでゴリゴリホームページを書いていた時は、タグ類もほとんど自分で設定していたので特に気にもならなかったのですが。

特にWordpressのようなCMSを使用していると、どこでどのタグが自動設定されているのか分かりにくかったりします。

・titleタグはブラウザー上部に表示されるタブのタイトルになる。また検索結果にも反映される。

・H1タグは大見出しとされており、基本的には本文中の一番上に設置される。検索結果にも反映されるがタイトル優先

つまり記事タイトル=H1タグ=titleタグになることもあれば、別々の文字が設定されることもあると。

もっと分かりやすく具体的に言うと

Titleタグは検索エンジン向けの情報で、検索結果に表示される記事タイトル情報。つまりそのページに何が書かれているか。

H1タグは実際そのページを観覧してくれている人向けの情報で、何について書いているかを見やすくする見出し。

ということになる。実際に、検索結果に表示される記事タイトルと、実際にページを閲覧したときの大見出しが全く違うということは、基本的にありえない話なので記事タイトル=H1タグ=Titleタグとなっているサイトも多い。

 

では、TitleタグとH1タグが違う場合はどういう場合なのか?

検索結果にはハッとクリックしたくなる魅力的な内容を表示させて、実際にページを見てくれた人には、具体的にその記事には何が書かれているのかを一見で伝える。こういうことですね。H1とTitleタグって似ていても使う目的が結構違う!

例えば記事タイトル(titleタグ)には「必見!もっとも稼いでいるYoutuberは誰だ!?」と表示させ、ページ大見出しのH1タグには「Youtuberの所得ランキングBest5」などと記述する場合かと思います。

WordPress無料テーマのLion BlogはTitleタグ=H1タグ

では当ブログで使用しているテーマはどういう設定になっているのか、早速調べてみました。

h1タグとtitleタグの違い002

ネットブラウザはchromeを使用しているので、サイト上で右クリック、検証を押すとCSSやHTMLが見れます。これは便利w

早速記事タイトルに当たる部分にマウスをもってきて検証してみると、「h1.heading~~」とある。LionBlogではデフォルトだと記事タイトルにH1タグが付与されている模様。

 

h1タグとtitleタグの違い003

念のためタイトルタグには何が入っているか、確認してみる。「ページのソースを表示」してみるとTitleタグにも記事タイトルと同じ内容が入っていた。

 

h1タグとtitleタグの違い004

ここからが自分でタグ付けした内容となる項目のチェック。見出し2として挿入していた部分にはh2タグが適用されている。

Lion Blogテーマでは、記事タイトル部分にh1が自動挿入されていることにより、自分で記述する記事本文の見出しは必然的にh2から始めることになる模様。

一応今までの書き方でタグの使い方は間違えていなかったようだ。

Lion BlogではTitleタグとH1タグの内容を分けることもできる

以上のように、検索結果に表示させる記事タイトルと、大見出しのH1タグは似ているけど使用する目的が違うということです。

当ブログでも使用しているwordpress無料テーマのLion Blogではその切り替えがワンタッチでできるように設計されています!

 

h1タグとtitleタグの違い005

実際記事本文の下の欄にSEO対策という欄があり、title設定というところで記事タイトルを設定することができます。ここは検索エンジンに表示したい記事タイトル。H1タグには別の内容を記述することで、titleタグ=H1タグとならないようになるはずです。

■まとめ

・H1タグとTitleタグは同じこともあるし違うこともある。

・titleタグは検索エンジン検索結果表示画面用。

・H1タグは実際にページを見ている読者に内容を一見で伝えるもの。

・H1タグの複数回使用はGoogleにも認められているが、どこが重要なのかが分かりにくくなるため1ページにつき、1つのH1タグの使用を推奨

・H1、H2、H3と順番に使いましょう。H1を使ってH2タグを飛ばしてH3タグから使うのはNGです!

・H1タグの見出しがデカすぎる!という場合は自分のサイトに合わせてH1~H6タグのCSSを変更することにより見やすくしましょう!(SEO的にH1の見た目はこれしかダメということはない)

-SEO

© 2020 ソロ学