今回は、SEO対策でこれまた重要なタグの使い方を説明するケロ。

titleタグと違って、明確にどこにどう使えばいいかわからなくて、使い方を悩むんですよ～T T

その気持ち、よーーーくわかるケロ！
いろんなサイトを見ていると、使われ方が違うことが多く、どれが正解なんだ～ってなるよね。

ロゴ画像に設定していることも多いですよね？

うん。
トップページはそれでもいいけど、他のページも全部一緒だとちょっともったいないケロね。

h1タグを効果的に使おう！

h1タグは、大見出しの意味合いを持つため、とても重要なタグになります。
なので、効果的に使いたいですよね。
h1タグの使い方の注意点や、使い方の例を紹介します。

① h1の内容は、ページごとに変えよう

よく、ヘッダーのロゴ画像にh1タグを設定しているサイトを見かけますが、全ページそれだとちょっともったいないです。

トップページはそれでも大丈夫ですが、他のページは出来るだけ各ページの大見出しをh1に設定してあげましょう。

参考までに、このページのh1は下記です。
内部施策4（h1タグ編）

何のことを書いたページかすぐわかりますし、このページは「h1タグ」というキーワードを入れたいので上記のように設定しています。

② h1の内容は簡潔に！文字数は少なめに。

訪問者にとってわかりやすい見出しであれば、h1タグの文字数に特に
決まりはありません。

でも、文字数を入れすぎると、狙いたいキーワードの効果が薄まったり、長すぎる大見出しは、ページを読む気がなくなることもありますよね。

訪問者目線でわかりやすい見出しにすること心掛け、簡潔な見出しにした方がそのページを読もうって思う人も増えると思います！

③ h1タグの位置は重要？

h1タグの位置は、h2やh3よりも必ず上にしないといけない！と仰る方もいますが、GoogleのJohn Mueller氏によると、

「ページ上の構造が明確であれば、hタグの順番は正しく使用すると手助けになるが、間違っているからといって不利に働くことはない」
※説明文を省略して訳したため、細かい部分の誤訳は許してね。

といった回答をしています。

なので、
基本的にh1タグの位置はh2等より上にしておきましょう。

どうしてもh2の下に置きたいときは、cssで表示位置を変更してあげればO.Kです。

↓こういうやり方

④ h1は、画像かテキストどっちがいいの？

出来ればテキストの方が好ましい。
でも、ロゴなど画像にh1を設定したい時もありますよね。
なので、
画像をh1にする際は、必ずalt属性にテキストを記述しましょう。

画像だけだと、検索ロボットはその画像が何を示しているかを読み取ることが出来ません。

alt属性にテキストを入れていると、検索ロボットがh1の内容を読み取れるため、必ずaltにはテキストを入れておきましょう！

余談ですが最近は、画像の意味も読み取れるように開発を進めているらしい…
すごいね^^;

h1だけでなく、画像には「alt」をきちんと記述した方がGoodです。

⑤ h1は、1ページに出来れば1～2個にしよう。

昔は、h1は1ページに必ず1つって言われていましたが、現在ではセクションで区切る等、構造をきちんと作っていれば何個使ってもいいようです。

W3Cのサイトでも、HTML5ではH1タグの個数制限はありませんといった解説がされています。

とはいえ、あまりにもh1が多いと、「どれがメインの見出しなの？」となり、
h1タグの効果が薄まることはあるそうです。

なので、出来ればh1タグは1ページに1つにしましょう。

⑥ h1にはキーワードを入れた方がいいの？

出来れば入れた方がいいです。
キーワードの位置は特に気にする必要はないので、読みやすさを優先して記述しましょう。

キーワードの数によって順位が影響されることはありませんが、意図的に同じキーワードを何度も繰り返し使用したり詰め込み過ぎるとガイドライン違反になることもあるので気をつけてくださいね^^;

↓おそらくこんな見出しを書く人はいないと思いますが。。。ダサすぎる^^;
「SEO講師直伝！SEOのためのSEOテクニックを使ったSEO的表現」

トップページでロゴ画像ではなく、テキストでh1を入れたい時はどうしたらいいでしょうか？

社名等をh1にしたいのであれば、
・ページ上部にh1をテキストで書く
・cssでフッターの住所の上などに配置
とか、cssで好きな位置に設定する手もあるケロ☆

あ、なるほど！
③の説明のパターンですね。

h1の使い方については、吾輩もずっと勉強中ケロ！
Googleのアップデートにあわせて、また授業できればと思ってますゞ