HTML言語の知識がなく、タグを直接触ることを避けているという方もいらっしゃるでしょう。SEO対策に有効なHTMLタグはそう多くはないので、注意深く行えばレイアウトが崩れることもありません。

ここではSEO対策に有効なHTMLタグをご紹介いたします。

HTMLとは?

ネオンのHTMLの文字

HTMLとは、WEBページを作成するための言語です。

WEBページには画像やテキストがレイアウトされていますが、すべてはHTML言語の指示どおりに表示されています。

HTML言語では、「タグ」で命令がなされます。始まりのタグと終わりのタグでテキストを囲み、レイアウトを整えます。タグの選択や使い方を間違ってしまうと、表示されない、レイアウトが崩れるなど、不具合が生じます。

HTML言語が開発された当初は、タグを直接打ち込むことで、WEBページは作られていました。現在では、HTML言語を理解していなくても、ソフトやアプリを利用することで、簡単にWEBページが作られるようになっています。

そのため、HTMLについて知識に乏しくても、WEBやSNSなどの情報担当となる方も少なくありません。ですが、SEO対策を行う際、以前ほどではなくても、HTMLタグを意識した対策が必要とされることがあります。

HTMLに苦手意識を持つのは、

  • 「レイアウトが崩れてしまうかもしれない」
  • 「崩れてしまっても元に戻せない」
  • 「プログラムなどに不具合がでるのではないか?」

と、不安に思っているからではないでしょうか。

SEO対策に有効とされるHTMLタグはごく一部であり、注意深く行えば問題のない程度です。タグは日本語ではなくアルファベット表示ですが、パターンを知れば誰でも問題なく使いこなせるでしょう。

今までHTMLを避けてきた方も、これを機にぜひトライしてみてください。

HTMLのタグはSEO対策に有効か?

タブレットにキーボードを使って入力する手元

SEO対策においてHTMLタグの設定は有効といえます。

その理由は、検索エンジンのクローラーがHTMLタグを読み取ってWEBサイトの情報を収集しているためです。

現在のSEOは、CWV(コアウェブバイタル)やMFI(モバイルファーストインデックス)といった、ユーザーの利便性を重視した対策が評価されています。つまり、ユーザーの目に留まりやすい「titleタグ」や「h1タグ」などを適切に設定することは、SEOにおいても有効であると考えられるのです。

その際、SEOで上位表示を狙いたいからといってむやみに対策キーワードを詰め込むことはしないように注意してください。一昔前のSEOであれば有効であったかもしれませんが、現在のSEOではその手法は通用しません。

ユーザーへ適切に内容を伝えることを優先し、その中で自然にキーワードを入れられるように工夫することが大切です。

SEO|対策キーワードの使用回数は上位表示と関係があるか

SEO|対策キーワードの使用回数は上位表示と関係があるか

SEO対策で上位表示させるため、コンテンツ内に意識してキーワードを入れ込んでいる方は多いと思います。上位表示しているサイトはどのくらいの割合キーワードを含めているのか、調査しました。

コアウェブバイタル(Core Web Vitals)とは

コアウェブバイタル(Core Web Vitals)とは

コアウェブバイタル(Core Web Vitals)を構成する3つの指標と有効なツールについて解説していきます。また、簡単に指標を改善させる方法も紹介しますので、ぜひ概要を理解してサイトの改善に活用しましょう!

SEO対策に外せない基本のHTMLタグとは?

様々なHTMLタグと歯車

HTMLタグといってもその種類は様々ですが、ここではSEO対策において外せない基本のものをご紹介します。

【titleタグ】

titleタグは、WEBページそのもののタイトルにあたる部分です。

検索エンジンの結果に表示されるページのタイトルは、titleタグ内に記載された内容になります。

WEBページの表紙であり、顔にあたる部分のため、しっかりとページの内容を表現する言葉を選びましょう。titleタグ内にキャッチーな言葉が入れば、訪問者数アップにも繋がります。

ポイントは、

  • 文字数が長過ぎず35文字程度まで
  • サイトの特徴に合わせたキーワードを盛り込む
  • ファーストビューの内容に合わせる

ことです。

ただし、

  • タイトルと内容がかけ離れている
  • タイトルにキーワードを詰め込み過ぎて長い

などには気をつけましょう。

▼記載方法

<title>ここに題名</title>

【metaタグ】

metaタグは、<head></head>内にページの概要について記されものです。

公開ページでは確認できませんので、記載漏れに注意しましょう。metaタグにはdescriptionとkeywordがあり、descriptionは検索された際、タイトルの下に内容として紹介されます。

ポイントは、

  • 120文字程度にまとめること(長すぎると途中で表示が切れるため)
  • ページに内容を的確に表すこと

です。

Keywordは、検索されたいキーワードを何点か記入することができます。

以前はSEOに重要な項目でしたが、内容と異なるキーワードを設定する悪用が増えたこと、検索エンジンがページの内容を正しく把握できるようになったことなどから、現在ではSEO対策効果は無くなっています。

ただし、設定する意味が全くないわけではありませんので、適切に設定されていれば削除する必要はありません。

▼記載方法

<meta name="description" content="ここにテキスト">

メタディスクリプションとSEOの関係

メタディスクリプションとSEOの関係

メタディスクリプション

SEO|メタキーワードと検索表示順位の関係について

SEO|メタキーワードと検索表示順位の関係について

メタディスクリプション

【hタグ】

hタグは見出しを表します。
h1は大見出し、h2は小見出し、h3は孫見出しというように数字が上がるほど見出しのレベルは低くなります。

h1は大見出しのため、デフォルト設定では目立つよう文字は大きく太字になっています。

見出しに狙ったキーワードを設定することは、SEO対策に重要です。

ポイントは、

  • h1タグは必ず設定すること
  • タグはh1から数字を飛ばさず順番を守ること
  • 文字サイズの強調目的にhタグは利用しない
  • 見出しは内容に合ったもので簡潔に

などがあります。

▼記載方法

<h1>大見出し</h1>
<h2>小見出し</h2>

【aタグ】

aタグでは、テキストや画像にリンクを設定します。

他ページの他、ページ内リンクも可能であり、設定することでサイト内のリンクを集約化し、ユーザーにとっても利便性のよいページとなります。

▼記載方法

<a href="リンク先のURL">リンクテキスト</a>

この時に、target属性をさらに設置すれば、リンク先のページを同じ窓で開くのか、もしくが新たな窓に表示するのかも設定可能です。

リンク先のページがSEOの評価を受けたくない場合は、「rel="nofollow"」を使用しましょう。

▼記載方法

<a href="リンク先のURL" rel="nofollow">リンクテキスト</a>

【altタグ】

altタグは、画像や動画にテキスト情報を追加するものです。

▼記載方法

<img src="images/01.gif" alt="画像の内容テキスト" width="200" height="150">

となり、imgタグ内に設置されます。
ちなみに「width」は画像の幅、「height」は画像の高さを示しています。

altタグを画像に設定していると、読み上げソフトでも内容がわかる、表示速度が遅い時や画像のリンク切れのときにも何の画像があるのかがわかります。

検索エンジンは、クローラーが巡回することでサイトの内容を確認していますが、画像や動画に関しては中身を確認することができません。

altタグを設定しておけば、クローラーはテキストから中身を知ることができます。ただし、画像と関係のない言葉や内容と無関係の画像ファイルに設定しないよう気をつけましょう。

無関係のテキストを張り付けても、評価されるものでは決してありません。それどころか場合によってはネガティブ要因にもなり得ます。

【リストタグ】

リストタグは、文章を箇条書きにする際に利用します。
リストタグにも種類があり、

▼記載方法

順番を付けたい場合は<ol>を使います。

<ol>
<li>箇条書きの内容</li>
<li>箇条書きの内容</li>
<li>箇条書きの内容</li>
</ol>

右向きの矢印

▼コンテンツ上の表記

  1. 箇条書きの内容
  2. 箇条書きの内容
  3. 箇条書きの内容

▼記載方法

順不同の場合は<ul>を使います。

<ul>
<li>りんご</li>
<li>みかん</li>
<li>ぶどう</li>
</ul>

右向きの矢印

▼コンテンツ上の表記

  • りんご
  • みかん
  • ぶどう

リストタグを使うメリットは、ユーザーが読みやすい、ページ制作時にリスト化が容易になるほか、検索エンジンのクローラーも「重要な部分」と判断するため、SEO対策にも有効です。

リストタグは、あえてインデントを設定することで、見た目にもリストと分かるように設定されています。SEO対策としてはリストタグの使用をおすすめします。

【pタグ】

pタグのpはParagraphの略で、段落を表します。

▼記載方法

<p>ここにテキスト文。</p>

というように、<p></p>でテキストを挟み使用します。HTML言語の中でも、最も利用されるタグであり、テキストの他、画像の前後にも利用します。

一般的なブラウザで表示される際、段落と段落の間は一行分改行されます。

場合によっては改行の幅が広すぎると、pタグではなく改行のbrタグを利用されることもありますが、検索クローラーに正しくページ内の構造を理解されるためにも、段落が分かれる際はpタグを使うようにしましょう。

デフォルトのpタグの改行幅が気になる場合は、細かく設定することも可能です。

また、リストタグもpタグと混同されがちです。見た目の好みで使い分けるのではなく、リストなのか、段落なのか、中身に合わせて選択しましょう。

【strongタグ】

strongタグは、テキストを強調したい際に利用します。

▼記載方法

<p>文章内で<strong>強調したい</strong>ところに使います。</p>

文章内で強調したいところに使います。

WEBページ上では太字になり強調され、何を伝えたいのかが分かりやすくなります。

同じく太字になるものにbタグがあります。見た目は同じですが、ユーザビリティを高めたい場合はstrongタグを、単純に太文字にしたい場合はbタグという風に使い分けてください。

さらにSEO対策にこだわりたい場合は

HTMLが記載された画面と3体の人形

HTMLタグを正しく使いこなすことは、ユーザーにとっても見やすいページになるだけでなく、検索エンジンクローラーにとっても巡回しやすく、内容を確認しやすいメリットがあります。

基本的なタグはもちろん、さらに細部にこだわったSEO対策を行いたいという場合は、以下のタグも覚えておきましょう。

【blockquoteタグ】

blockquoteタグは「引用」を表す際に利用します。

他サイトに記載されている内容を自サイトに掲載する際は、必ずblockquoteタグが必要です。

▼記載方法

<blockquote cite="引用元URL">
<p>引用コンテンツ</p>
引用元:<cite><a href="引用元URL">ページタイトル</a></cite>
</blockquote>

引用であることが分かるように、引用元のタイトルにリンクも設定しましょう。

引用とせず、コピーすることはモラルの問題以外にも、検索エンジンクローラーに重複サイトとみなされる危険があります。

【Canonicalタグ】

Canonical(カノニカル)タグはあまり聞き慣れないHTMLタグの1つかもしれませんが、サイトを運営する上で知っておくと便利です。

Canonicalタグは、サイト内で重複しているページを取捨選択し、評価を集約したい時に利用します。

サイトが大きくなると、似たような内容のコンテンツが発生することがあります。また、色違いの商品紹介を行う際は、必然的に内容が似てしまいます。

この時、どのページを検索エンジンクローラーに評価してもらいたいのか、Canonicalタグの利用で設定可能です。

▼記載方法

<link rel="canonical" href="評価されたいページのURL">

このように、評価されたいページのURLを示すことを、Google公式ではURLの正規化と定義しています。

Canonicalタグが必要とされるパターンには、

  • 同サイトで「httpとhttps」、「wwwの有無」がある
  • 商品の色違いやモデル違いごとにURLが分かれている
  • PC版とスマートフォン版でURLが異なる
  • 他サイトに自社の記事が転載されている
  • 計測用のパラメータがURLの末尾につく

などがあります。

「httpとhttps」、「wwwの有無」はサイトの仕組み上自動生成されることがあるため、Canonicalタグを活用しましょう。

計測用のパラメータを設定している場合、同じサイトでもURLの末尾が異なることがあります。人の目には同じでも、検索エンジンクローラーにとっては別物とみなされてしまいます。

その他、自社サイトの内容が他サイトの転載されている場合は、他サイト側にCanonicalタグの利用を依頼しましょう。同じく、自社サイトで他サイトを転載する際も忘れず設置しましょう。

注意点としては、

  • 評価されたいページのURLは必ず絶対パスにすること
  • 指定先を全て同じにしないこと
  • URLを間違えないこと

などがあります。

URLを絶対パスにすることで正規化のリンクミスを防ぎましょう。絶対パスにすることは、Google公式からも推奨されています。

また、指定先を全て同じにしてしまうと、サイト内に1ページしかないと思われてしまいます。もちろん、URLを間違ってしまうと、SEO対策にはならないので注意しましょう。

まとめ

SEO対策を行う上で、HTMLタグを意識することは大切です。

ページの見た目だけでなく、HTMLタグのチェックも行いましょう。ただし、単純にタグを濫用し、キーワードを不自然に差し込むことではありません。

以前はそのような手法が通用したこともありましたが、現在の検索エンジンクローラーはさらに進化しているため、内容がそぐわないと効果がないばかりか、評価を下げられる危険もあります。

HTMLタグから考えるSEO対策は、ユーザーと検索エンジンクローラーにとって価値のあるコンテンツかどうかです。中身のあるページをHTMLタグで整えて正しく表示することが、もっとも効果を期待できるでしょう。

GMOソリューションパートナー株式会社では、SEOに関する相談を無料で承っています。

20,000社以上のサイト分析から得た圧倒的なノウハウを武器に、SEOのお悩みを解決へと導きますので、「なかなか順位が上がらない…」と苦戦しているWEB担当者様がいらっしゃれば、お気軽にご相談ください。

\GMO順位チェッカーでSEO対策!/

    お問い合わせフォーム

    下記フォームよりお問い合わせください

    お名前

    お名前(フリガナ)

    会社名

    会社の所在地

    サイトURL

    メールアドレス

    お電話番号

    現在のご契約状況

    お問い合わせサービス

    お問い合わせ種別

    お問い合わせ内容

    PAGE TOP