Webサイトの運用に携わっていると、このような悩みがあるのではないでしょうか。こうした悩みについては、h1タグの基本や設定方法について理解できると解決できます。
そこでこの記事では、h1タグの概要やSEO効果のある設定方法について詳しく解説します。また、h1タグを使用する上で注意するべきことにも触れます。
この記事を読めば、h1タグの使い方について分かるので、効果的なSEO対策ができるようになります。Webサイトの運営を行なっている方は、ぜひ参考にしてください。
監修者
Twitter:@te2319
株式会社ニュートラルワークス 取締役CMO。1984年生まれ。高校卒業後にISD株式会社を起業。その後、株式会社オプトでWebマーケティングを学び、株式会社メタップスなど複数のベンチャー企業にて事業立ち上げを経験。前職はワンダープラネット株式会社でゲームプロデューサーとしてスマホゲームアプリの制作に従事。2018年に地元の神奈川へ戻り、ニュートラルワークスに入社。SEO/Web広告運用/サイト分析・改善など、Webサイトの運用改善~ゲームアプリ制作や数十万フォロワーのSNSアカウントの運用経験などWebビジネス全般を守備範囲とする。
■経歴
2003年 ISD株式会社/起業
2009年 株式会社オプト/SEMコンサルタント
2011年 株式会社メタップス/シニアディレクター
2013年 ライブエイド株式会社/執行役
2016年 ワンダープラネット株式会社/プロデューサー・BizDev
2018年 株式会社ニュートラルワークス/取締役CMO
■得意領域
Webサイト改善
SEO対策
コンテンツマーケティング
リスティング広告
■保有資格
Google アナリティクス認定資格(GAIQ)
Google 広告検索認定資格
Google 広告ディスプレイ認定資格
Google 広告モバイル認定資格
執筆者
株式会社ニュートラルワークス
QUERYY(クエリー)編集部
QUERYY(クエリー)は、株式会社ニュートラルワークスが運営するデジタルマーケティング情報メディアです。
目次
h1タグとは、Webページの最上位の見出しを記述するHTMLタグのことです。見出しタグにはいくつか種類があり、h1から始まってh2,h3と数字が大きくなっていきます。数字は大きくなるほど重要度が下がるため、h1タグはそのなかでも一番重要なタグとなっています。
h1タグは以下のように記載します。
例)
<h1>見出し</h1>
「見出し」の部分に表示させたい見出しのテキストを入れます。h2,h3と組み合わせると、以下のような構成になります。
【h1】<h1>h1タグとは?SEO効果のある設定方法や使用時の注意点を解説!</h1>
【h2】<h2>h1タグとは最上位の見出しを記述するHTMLタグのこと</h2>
【h3】<h3>h1タグとSEOの関係性</h3>
【h3】<h3>h1タグのSEO効果</h3>
【h2】<h2>h1タグの効果的な設定方法5つ</h2>
h1タグはSEOに関係のあるHTMLタグです。Googleでは見出しの積極的な使用を推奨しているため、Webサイト運営には欠かせない存在となっています。その理由は、h1タグを用いることで、検索エンジンのクローラーがWebサイトの情報を認識できるようになるからです。
h1タグを適切に設定することで、Webサイトの情報が整理されます。ユーザーがコンテンツを理解しやすくなるので、ユーザビリティを意識した内容にできるでしょう。Googleはユーザーファーストのサイトを評価しているため、検索エンジンにも正しくSEO評価をしてもらえるようになるのです。
h1タグを利用すると、Googleを始めとした検索エンジンのクローラーが、Webサイトの内容やコンテンツ構造を理解しやすくなります。それによって、SEOに間接的な影響を与えると考えられるのです。
通常、ユーザーがWebサイトを閲覧する際は、文字サイズが大きいだけでも見出しが書かれていることを認識できます。しかしクローラーはHTMLを読み込むため、文字サイズだけでは見出しだと認識できません。そこでh1タグのようなHTMLタグを活用することで、ページの構造を理解できるのです。すると見出しを積極的に使用していると判断できるので、サイトの評価が高まります。
h1タグは以下のように設定すると効果的です。
なかでも対策キーワードをh1タグ内に入れるのは重要です。
ここからは、それぞれの方法について詳しく解説していきます。
h1タグには対策キーワードを入れましょう。対策キーワードとは、SEO対策による流入を狙ったキーワードのことです。例えば「h1 使い方」というキーワードでの流入を狙っているなら、h1タグに記載する見出しにも入れましょう。
対策キーワードを入れるメリットは、対策キーワードを使用していることをクローラーに理解してもらえることです。繰り返しになりますが、クローラーHTMLを読み込んでいるため、テキストだけでは理解してもらえません。そこでh1タグに対策キーワードを盛り込むことで、そのキーワードの関連性のあるページだと認識してもらえます。
注意点としては、なるべく左側に対策キーワードを入れることです。ユーザーは左から文字を読むため、右側にあるとユーザーに気が付いてもらえない可能性があります。そこでキーワードが盛り込まれていると気が付いてもらえるように、なるべく冒頭に入れるように工夫しましょう。
見出しにタグを使用する際は、h1タグから順番に使うようにしましょう。順番を守らないと、クローラーにコンテンツの構造を理解してもらえません。ユーザーの視点で考えれば、タグを順番通りに使っていなくても、文字サイズやスタイルなどを編集すれば、見た目を変えることはできます。しかし、クローラーはタグの大きさで判断しているので、装飾を駆使しても問題は解決できません。
また、タグを使用する際は、ユーザーにとって読みやすい構造になるようにしましょう。例えば、「h1タグの効果的な設定方法5つ」という見出しをh2タグにした場合、後に続く5つの方法を示した見出しは、h3タグを使うことが望ましいです。
画像を使う場合はalt属性を記述しましょう。alt属性というのは、掲載している画像にどんなものが表示されているのかをテキストで示したものです。alt属性を記述すると、以下のような2つの効果があります。
1つ目の効果は、画像が表示されない場合にユーザー理解を助けることです。ファイルサイズが重い場合や、速度制限がかかっている場合は、画像が表示されないことがあります。alt属性が記述されていると、そこにどんな画像が表示されているのかが分かります。これは「画像の代替テキスト」とも呼ばれ、いくつかのシーンで役立つ場合があります。
例えば、視覚障害を持った方や高齢者の方がWebサイトを利用する際、画像が見えにくい場合があります。このような場面で画像の代替テキストがあると、ユーザーに対して幅広く利用してもらえるようになるのです。
2つ目の効果は、クローラーに認識してもらえることです。alt属性が記述されていると、画像もコンテンツやキーワードに関連性があると認識されます。すると画像にalt属性が記述されていないサイトに比べて、SEO評価が高くなります。
h1タグに記載する見出しの文字数は、短く簡潔に書いていきましょう。見出しはあくまでも要約です。長すぎるテキストは嫌われる傾向にあるので、ユーザーが離脱してしまう可能性があります。そのため、必要な部分だけを取り出して見出しを作成するようにしましょう。
また、タグはセクションごとに活用しましょう。h1タグは本でいうところの章のような役割を果たしています。セクションごとに活用することで、テキストをまとまりごとに読むことができます。短く分けることで、ユーザーの理解を助けます。
Gooole検索エンジン最適化スターターガイドによると、h1タグの使い方やポイントが載っています。効果的にWebサイトを運用するには、このような指標も取り入れるといいでしょう。ここではGoogleが紹介している、以下の2つのポイントについて触れていきます。
1つ目のポイントは、コンテンツのポイントを考えることです。見出しを考える際は、そのコンテンツの重要性を取り出すことが大切です。また、コンテンツとは関係のないテキストは用いてはいけません。
2つ目のポイントは、ページ全体を通して見出しタグは慎重に利用することです。見出しの数が多すぎると、読みにくくなってしまいます。また、ページにあるテキストを全て見出しにしてしまうのもよくありません。
h1タグを使用する際は、以下の5つの注意点を理解しましょう。
ここからは、それぞれの注意点について解説していきます。
h1タグは必要以上に使用しないようにしましょう。h2,h3タグの場合は、見出しの数によって複数存在することはあります。しかしh1タグは基本的に1つであることが望ましいです。その理由は、Webサイトにおいて1つのコンテンツに掲載するテーマは、1つであることが一般的だとされているからです。
h1タグが複数あると、クローラーは1つのコンテンツに複数のテーマが存在していると認識します。実際、テーマが複数に渡っているコンテンツは読みにくいため、ユーザーにとって不親切なサイトだと考えられます。すると結果的に順位も下がってしまうでしょう。クローラーから低評価をつけられてしまうことを避けるためにも、h1タグは複数使わないようにしましょう。
コンテンツを作成したら、プレビュー画面などでh1タグがどのように表示されているのか確認しましょう。特に、テキストの大きさやフォントの色に注目してみてください。テキストの文字サイズが小さいと読みにくいですし、大きすぎると不自然です。
また、フォントの色が背景や本文テキストと似ていると、あまり目立ちません。全体のバランスを考えながら、見出しにふさわしいデザインかどうか確認しましょう。
プレビュー画面でデザインの変更が必要だとわかった場合は、CSSで設定しましょう。CSSとは、HTMLで記述した要素をどのように装飾するかを指示するものです。CSSで設定するべき理由は、まとめて反映できるからです。
HTMLはページごとにしか反映できないため、コンテンツを制作するたびに調整しなければならなくなってしまいます。これまで作成していたコンテンツも修正するとなると、記述する手間が増えるだけでなく、変更によってミスが発生してしまう原因にもなってしまいます。
一方CSSを変更することで、変更するファイルは1つだけで済みます。そこで何かミスが発生する可能性も低くなるため、CSSの変更がおすすめです。
hタグを使用する際は、強調タグを使用しないようにしましょう。強調タグとは、<strong></strong>のようなタグのことで、テキストを太字で表示することができます。強調タグを使用しない方がいい理由は、使いすぎるとペナルティが発生するおそれがあるからです。
強調タグはテキストを目立たせることができるので、ユーザーに読んでもらいたい箇所には効果的です。しかし使いすぎてしまうとかえって読みにくくなるので、ユーザーにとって使いにくいサイトだと検索エンジンに思われてしまうのです。ペナルティを受けないためにも、強調タグはなるべく本文に用いるようにしましょう。
メインコンテンツはh1タグ内に置くようにし、それ以外の場所には置かないようにしましょう。コンテンツには以下のようにさまざまな要素が掲載されています。
そこで、本来サイト名や投稿日、フッターが記述される箇所にメインコンテンツが記載されていると不自然です。また反対に、h1タグにサイト名や投稿日、フッターが記述されているのも問題です。場合によってはペナルティが発生することもあるので、h1タグは正しく使用しましょう。
ここまでh1タグに関する注意点を紹介してきました。ポイントをおさえていても、本当に正しく使用できているのか不安に思う方もいるのではないでしょうか。その場合は、h1タグ評価チェックツールを活用してみてください。
h1タグ評価チェックツールとは、h1がどれだけ適切に利用できているかを判断してくれるツールです。h1タグ評価チェックツールを使うことで、h1タグの「文字数」「キーワード出現率」「先頭キーワード状況」などが客観的にわかります。
また、サイトのタイトルが競合と比べて適切か判断することも可能です。h1タグの使い方に自信がない場合や、サイトを改善していきたい場合には、ぜひh1タグ評価チェックツールを活用してみてください。
Googleなどの検索エンジンからのSEO評価を高めるには、正しくh1タグを設定することが重要です。検索エンジンのクローラーはHTMLを読み込んでサイトを評価しています。そのため、h1タグを用いているサイトとそうでないサイトでは、クローラーの認識が変わるのです。まだh1タグを設定していない場合は、サイト改善としてまずタグの設定から始めてみてください。
ただし、h1タグを正しく設定しただけでSEO評価が上がるわけではありません。h1タグの設定は、あくまで数あるSEO対策の一部です。Googleが評価しているのはユーザーファーストのサイトであり、h1タグを設定するのはユーザーファーストを実現するための一部に過ぎません。その点には注意しましょう。
この記事では、h1タグについて紹介していきました。h1タグは、Webページの最上位の見出しを記述するHTMLタグのことです。クローラーにコンテンツ内容を認識してもらえるという意味で重要です。h1を設定する際は、コンテンツの趣旨を考え、ページ全体を通して見出しタグは慎重に利用することがポイントとなります。
Webサイトをより効果的に運用したい場合は、ぜひh1タグを活用してみてください。