SEOで効果を発揮するHTMLタグの置き方を解説
スマートフォンの利用が当たり前になってきた昨今、多くの方がインターネットですぐに情報収集できる時代となりました。情報収集にはGoogle検索がよく使われるため、企業ではGoogleのSEO対策をしてユーザーの訪問数を増やすことが求められています。
SEO対策の一つに、HTMLタグを適切な記載が挙げられます。しかし、「HTMLタグといっても、サイト作りをしたことがないから分からない」と悩む方が多いでしょう。
そこで今回は、SEO対策の一つとして効果的なHTMLタグの記載方法を解説します。
HTMLタグ最適化はSEO内部対策に重要
HTMLタグの最適化がSEO内部対策に効果的なのは、Googleが「ユーザーファースト」のWebサイトを高く評価すると公表しているためです。
HTMLタグは、サイトの構成やコンテンツの見た目を決めるもので、ユーザーが直接目にするものです。
したがって、HTMLタグが適切に設定されていない場合、ユーザーにとって見にくいコンテンツとなってしまいます。Googleが評価するときにはユーザーファーストでないコンテンツである、と判断されてしまってSEOの評価も上がりにくくなってしまうのです。
また、Googleが評価するときにはクローリングと言われる技術を使い、機械が自動的に判定していきます。そのとき、クローリングではHTMLタグを解析しながら判定をしていくため、適切な判定結果を得るためにも最低限の設定をしておかなければなりません。
HTMLタグはSEO対策に効果があるだけではなく、ユーザーを第一に考えたコンテンツ作りという点において重要だと言えるでしょう。
SEOに影響するHTMLタグの種類
続いて、SEOに影響する具体的なHTMLタグの種類が気になるところです。ここでは、以下のHTMLタグをご紹介します。
- titleタグ
- hタグ
- metaタグ
- alt属性タグ
- canonicalタグ
- 強調タグ
titleタグ
titleタグはコンテンツの顔となる部分のため、非常に重要なタグです。
Google検索をすると、表示されるコンテンツはtitleタグに設定された文字で表示されます。ユーザーによっては、titleタグを見て訪問するかどうかを決める場合もあるため、アクセス数を稼ぐ上で必要な要素となります。
また、titleタグにはSEOの上位表示を狙っているキーワードを含めるのが基本です。SEOでは、どのキーワードで上位表示を狙うのかを明確にした上で、対策を進めていきます。
例えば、「ダイエット やり方」というキーワードで狙っているのであれば、titleタグには「ダイエットのやり方を徹底解説！メリットやデメリットも合わせて紹介します」のように、キーワードを含んだtitleタグにすべきです。そうすることで、ユーザーが検索したときに良質なコンテンツであればSEOで上位表示されやすくなるでしょう。
hタグ
hタグとは、コンテンツ内の見出しを表す部分です。hタグを有効に活用することで、ユーザーが見やすいコンテンツ作りができます。
hタグにはh1からh6までのレベルがあり、h1が最も強調したいタイトルなどに使われます。そのため、コンテンツ内で使用されるのはh2からが多いです。
具体的には以下のように記載します。
<h1>ダイエットのやり方を徹底解説！メリットやデメリットも合わせて紹介します</h1>
<h2>ダイエットには大きく二つの方法がある</h2>
<h3>脂質制限ダイエット</h3>
<h3>糖質制限ダイエット</h3>
ポイントは、h2タグの直下にh3タグを記述していることで、h2でダイエット方法について解説することを示唆し、その後h3タグで具体的な方法を解説しています。
逆にやってはならないhタグの書き方としては、
<h1>ダイエットのやり方を徹底解説！メリットやデメリットも合わせて紹介します</h1>
<h2>ダイエットには大きく二つの方法がある</h2>
<h4>脂質制限ダイエット</h4>
<h2>糖質制限ダイエット</h2>
のような形です。いきなりh4タグに飛んでいるだけではなく、h2タグ内に含めるべき内容を新たなh2タグとして記載してしまっています。
ユーザーにわかりやすい情報を提供するためにも、hタグを適切に設定しましょう。
metaタグ(description、keyword)
metaタグとは、コンテンツ内の付加情報を設定できるタグです。直接的にコンテンツの表示部分に影響があるわけではありませんが、記載することでSEO対策に有効となります。
SEO対策に有効なmetaタグとしては、「description」と「keyword」が挙げられます。それぞれ、設定しておくことでGoogleがクローリングするときに該当のテーマだと認識させやすくするのです。
例えば、「ダイエット やり方」のキーワードで上位表示を狙っている場合、以下のように記載すると良いでしょう。
alt属性タグ
alt属性タグとは、コンテンツ内に画像を掲載するときに使用されるタグで、画像に情報を持たせる効果があります。
alt属性タグに画像の情報を持たせることで、該当のキーワードで検索したときに、画像検索としてヒットするのです。画像検索でヒットした場合、画像をクリックすると画像の掲載元に移動するため、ユーザーが訪問するきっかけにもなります。
alt属性タグの具体例としては、以下の通りです。
設定することで、ダイエットをしている女性の画像を検索している場合、上記の画像がヒットしてサイトへの流入につながります。
canonicalタグ
canonicalタグとは、サイト内で同じ内容のコンテンツがあったときに、コピペではないことを伝えるタグです。
GoogleはSEOの評価をするときにクローラーで評価をしており、同じサイト内でも重複したページがあればコピペコンテンツと判断する可能性があります。コピペと判断されてしまった場合、サイトに対するSEOの評価が下がってしまうため、設定しておきたいところです。
canonicalタグを設定する場面としては、以下のケースが考えられます。
- 同じ商品の色違いやサイズ違いのページがある
- 違うURLで同様のページが存在する
- サイトリニューアルの関係で一時的にページを並行稼働している。
また、記載例は以下の通りです。
<head>
<link rel=”canonical” href=”対象ページのURL”>
</head>
サイトの見直しをするときには、重複したページがないかの確認もしっかりとおこないましょう。
強調タグ
強調タグは、重要な部分を太字にして目立たせるためのタグです。
ユーザーは、基本的にコンテンツの文章を流し読みして必要な情報だけを得たい人が多い傾向にあります。そこで、強調タグを使ってユーザーにはここを読めば情報を得られることを伝えるのです。
強調タグを効果的に使うことで、ユーザーは欲しい情報をすぐに得られるためユーザーファーストとなり、GoogleのSEO評価が上がるでしょう。
記述の方法としては、以下の通りです。
HTMLタグ設定時のポイント
適切なHTMLタグを設定することで、ユーザーファーストにつながってSEOの評価向上につながることが分かりました。ここからは、HTMLタグを設定するときのポイントを解説していきましょう。
- 正しいHTMLの記述する
- hタグは適切な階層構造にする
- CSSも正しく記載する
正しいHTMLの記述する
HTMLタグを設定するときは、間違えずに正しく記述しましょう。HTMLタグを正しく記述することで、伝えたい内容をしっかりと発信できます。
もし、HTMLタグの記述方法が間違っていた場合、意図していない形で情報が伝達するかもしれません。例えば、太字の部分を間違えたがために本来強調すべきでない部分を強調してしまったり、metaタグに関係ないキーワードを入れてしまってSEOの評価に影響が出てしまったりすることです。
また、文法ミスなどをしてしまうとブラウザによって正常に動かないケースもあるので、事前に動作確認を念入りにしておく必要があります。
正しいHTMLタグの記述は、SEOの評価を得るうえで最低限達成しておかなければならない項目です。
hタグは適切な階層構造にする
hタグは、コンテンツの階層構造を表しています。hタグを適切な階層構造にすることで、ユーザーは文章の構造を理解しやすくなります。
hタグは、書籍の章立てに似ている部分があります。書籍では、1章・2章・3章といったように大きな枠組みがあり、1章の中にも詳しく細分化されていることが多いです。読者の中には、章立てをみて面白いと思った部分から読んでいく人もいるでしょう。
Webコンテンツも同様であり、ユーザーはコンテンツの全体を見て得たい情報や面白い情報が書いてありそうな見出しから読むケースが多いのです。したがって、適切なhタグを設定することでユーザーが読みやすいコンテンツが実現でき、Googleの評価も上がりやすくなります。
CSSも正しく記載する
Googleの評価においては、CSSの記載方法も影響してきます。
具体的には、CSSの記載方法というよりも、CSSによって処理速度が遅い場合に評価が低くなってしまうのです。
サイトが表示されるときは、ユーザーからサイトへのリクエストがあり、レスポンスとしてHTMLとCSSのコードを渡します。したがって、それぞれのコードで複雑な処理をしていたり、記述量が多い場合に処理時間がかかってしまい、サイトが表示されるまでに多くの時間を要してしまうのです。
特に、CSSでは動的な動きを再現できるため、内容を盛り込みすぎると処理速度が遅くなってしまう傾向にあります。CSSを記述するときには、処理速度も考えてコーディングをするように注意しましょう。
HTMLタグ以外の内部対策関連記事
まとめ
今回は、SEO対策の一つとして効果的なHTMLタグの記載方法を解説しました。HTMLタグは、正しく記載することでユーザーにとって見やすいコンテンツを実現できます。その結果、ユーザーファーストを理念に掲げているGoogleの評価も高くなりやすく、SEOの評価につながりやすいのです。もし、今までHTMLタグの修正に取り組んでこなかった方は、今回の記事を参考に適切なタグ設定をしてみてはいかがでしょうか。
