COLUMNコラム

canonicalタグとは?使い方や使用する際の注意点などを解説

ライティング

SEOにおいて、検索エンジンからマイナスの評価を受けるのは避けたいところです。

WEBコンテンツが重複または類似しているページURLを正規化するHTMLタグをcanonicalタグといいます。

正規化が必要な状況では、canonicalタグが正しく設定できているかどうかは検索エンジンの評価に大きく影響し、SEO効果にも期待できるでしょう。

そこで、この記事ではcanonicalタグの意味や設定する理由、使い方や使用する際の注意点などを解説します。

「canonicalタグ」とは?

canonicalタグはカノニカルタグと読み、類似・重複コンテンツを解消して、1つのページにリンク評価を集約させるHTMLタグのことをいいます。canonicalとは直訳すると、「標準的な」、「基準的な」を意味する形容詞です。

WEBサイトを運営していると、やむを得ない理由で類似コンテンツや重複コンテンツが発生します。canonicalタグを活用すれば、ページごとに分散していた評価を一つのページに集約させることが可能です。

canonicalタグを設定する理由

ここではcanonicalタグを設定する理由を2つ紹介します。

重複コンテンツを防ぐため

重複コンテンツが存在すると、Googleはコピーコンテンツとみなし、ページ評価を下げる可能性があります。

重複コンテンツの対策として、canonicalタグを設定しクローラーにどのページがメインページなのかを教える方法があります。

canonicalタグでURLを1つにまとめると、Googleは正規化されたメインページだけをインデックス登録します。同じ内容のページが複数のURLでインデックス登録されている場合は、canonicalタグが設定してあるページのみインデックス登録されます。

Googleが重複コンテンツとみなすページとしては、端末ごとにサイトを持っている場合やECサイトでサイズや色が違うページ、AMPを使用しているページなどがあります。

リンクの評価を集約させるため

canonicalタグの設定によってメインページを正規化することで、被リンク評価の分散を防ぐことができます。

被リンクされているページは評価をが高い傾向にありますが、重複したコンテンツがあると被リンク数が分散しする可能性があります。

その結果、ページが受ける評価は下がってしまい、大きなダメージを受けてしまうでしょう。

canonicalタグを設定することでURLを正規化し、評価をメインページに集約できるでしょう。

canonicalタグを使った方が良いケース

ここではcanonicalタグを使った方が良いケースを6つ紹介します。

PCサイトとスマートフォンサイトでURLが異なる場合

PCサイトとスマートフォンサイトでは、同一内容で異なるURLを設定している場合、canonicalタグを使用しないと重複ページとしてみなされる可能性があります。

このような場合は、2つのURLサイトの関係性を検索エンジンに正しく教える必要があります。このことを、アノテーションを設定するともいいます。

PCサイトのURLがhttps://hoge.com、スマートフォンサイトのURLがhttps://hoge.com/spの場合
PCサイト https://hoge.comは

<head>
  <link rel="canonical" href="https://hoge.com">
  <link rel="alternate" media="only screen and (max-width: 640px)" href="https://hoge.com/sp">
</head>

となり、
スマートフォンサイトhttps://hoge.com/spには、PCサイトのURLを設置するため、

<head>
  <link rel="canonical" href="https://hoge.com">
</head>

となります。

ECサイト内に類似ページがある場合

ECサイトでは商品ごとに色やサイズのバリエーションがあるため、1つの商品について複数の類似ページができます。

そのため、重複コンテンツとみなされる可能性が高いです。

ECサイトにおける正規化では、メインの商品ページ以外にcanonicalタグを設定しましょう。

例えば、サイズがS・M・Lの商品があるとき、Mをメインのページにしたいときは
次のようになります。

  • 商品A(サイズM):http://www.example.com/size_middle.html
<head>
  <link rel="canonical" href="http://www.example.com/size_middle.html">
</head>
  • 商品B(サイズS):http://www.example.com/size_small.html
<head>
  <link rel="canonical" href="http://www.example.com/size_middle.html">
</head>
  • 商品C(サイズL):http://www.example.com/size_large.html
<head>
  <link rel="canonical" href="http://www.example.com/size_middle.html">
</head>

記事が転載されている場合

記事を転載する場合やされる場合、どちらも重複ページのペナルティを受けるリスクがあります。

外部サイトからの転載はタグ付けすることで対処できますが、外部サイトに自分の記事が転載された場合は、外部サイトにcanonicalタグの設定を依頼する必要があります。

ただし、すべての外部サイトが依頼を受けて適切に設定してくれるとは限らないので注意が必要です。

AMPページがある場合

AMPとはAccelerated Mobile Pagesの略で、GoogleとTwitter社が共同で開発したオープンソースです。

AMPページはモバイルページの表示を高速化します。AMPを実装すると、サイト内には同じ内容のAMPページが新たにできるため、コピーコンテンツとしての判定やリンク評価が分散するリスクがあります。

AMPページがある場合は、リスクを防止するためにcanonicalタグを使用しましょう。

通常のページにはcanonicalタグと一緒にamphtmlタグを付けます。
// 通常のページ

<head>
  <link rel="canonical" href="https://通常のページのURL">
  <link rel="amphtml" href="https://AMPページのURL" />
</head>

// AMPページ

<head>
  <link rel="canonical" href="https://通常のページのURL">
</head>

URLにパラメータが付いている場合

WEB広告の効果計測など、データ収集のためにURLの末尾に付与する係数をパラメータといいます。Googleのクローラーはパラメータの有無を判断できないため、パラメータがついていてもコピーコンテンツとみなされる恐れがあるので注意が必要です。

パラメータが付与されている場合でも、canonicalタグの使用が推奨されます。

ABテストをする場合

ABテストとは、一部分が異なる2種類のページを用意して、コンバージョン数やアクセス数などのデータを比較し、どちらが良い結果を出せるかを検証するテストです。

ただし、ABテストのページ内容はほぼ同じため、コピーコンテンツと判断されてしまうリスクがあります。

そのため、ABテストを実施する際はcanonicalタグを使用してURLを正規化しておきましょう。

canonicalタグの設定方法

ここではcanonicalタグの設定方法を3つ記載します。

HTMLで設定する

HTMLでタグを設定する場合、前述したように、<head>タグ内に専用のlink属性をマークアップします。正規のURLがhttps://www.hogehoge.com/A.html 重複URLがhttps://www.hogehoge.com/B.htmlの場合、具体的には下記のようになります。
正規のページhttps://www.hogehoge.com/A.html

<head>
<link rel="canonical" href="https://www.hogehoge.com/A.html">
</head>

重複ページhttps://www.hogehoge.com/B.html

<head>
<link rel="canonical" href="https://www.hogehoge.com/A.html">
</head>

HTTPヘッダーで設定する

HTTPヘッダーは、HTTPリクエストに入っている情報のことです。HTTPリクエストとは、サーバーに対するWEBブラウザからの命令を意味します。

HTTPヘッダーでcanonicalを設定する場合は.htaccessファイルを変更する必要があり、変更できない場合、HTTPヘッダーでcanonicalは設定できません。

記述方法は下記の通りです。

Link:<https;//正規化したいページのURL>; rel="canonical"

WordPressで設定する

WordPressで設定する場合は「All in One SEO Pack」を使ってcanonicalタグを設定します。

まず、All in One SEO Packをインストールして有効化しましょう。

次に、WordPressの管理画面の左側にあるメニューからAll in One SEO Packを開き、一般設定のCanonical URLという項目をチェックします。

また、カスタム Canonical URL を有効化にチェックを入れると固定ページや投稿ページにcanonicalタグを設定することもできます。

canonicalタグを設定する際の注意点

ここではcanonicalタグを設定する際の注意点やポイントを5つ紹介します。

URLの記述ミスに注意する

canonicalタグの設定では、URLを1文字間違えただけでページが検索結果に表示されなくなります。

設定ミスにより検索順位が下がる可能性もあるので注意してください。下がってしまった場合、すぐに修正したとしても検索順位が元に戻る保証はありません。

canonicalタグで設定するURLは、サーチコンソールのrobots.txtテスターだけでなく目視で何回も確認することが大切です。

head要素に記述する

HTMLで設定をする場合は、<body>要素に記述しないように注意しましょう。

<body>要素内に記述すると、クローラーが認識しない恐れがあります。せっかくcanonicalタグを設定しても、正規化したいURLが認識されなければサイト評価は上がりません。

canonicalタグは必ず<head>要素内に記述しましょう。

指定先のURLを全て同じにしないようにする

canonicalタグで指定先のURLを全て同じにすると、WEBサイト内の全てのページが1つのコンテンツとして判断される可能性があります。

canonicalタグを設定するときは、対象のページにURLが向いているか確認する必要があります。

また、コンテンツを複数ページに分割した場合、正規化する必要はありません。

記事のページ数が異なればコンテンツ内容も異なりますので、canonicalタグは使わないようにしましょう。

URLの記述は絶対パスを使う

絶対パスとは、https://を含む全ての文字列のことを指します。

一方、相対パスは、/about.htmlのようにファイルの位置だけを指定する文字列のことです。

canonicalタグの設定は相対パスでも記述可能ですが、記述ミスの可能性が高くなります。

また、相対パスで設定すると検索エンジンが正しく認識せず、別サイトとして評価してしまうことがあります。
canonicalタグのURLの記述は必ず絶対パスを使いましょう。

正規化するページは1つのURLを使用する

canonicalタグで正規化するページは1つのURLを指定します。
1つのページにcanonicalタグを複数指定すると、クローラーはがどちらを正規化するか判断でません。

例えば、WordPressテーマがcanonicalタグを自動設定している場合、canonicalタグを設定するプラグインを入れると、1つのページにcanonicalタグが2つ設定されてしまいます。

canonicalタグを設定するときは大切です。

まとめ

この記事ではcanonicalタグの概要や使い方、注意点について解説してきました。

canonicalタグは分散していたページ評価を集約できる便利なタグです。

しかし、使用法を間違えると検索順位への悪影響が出る可能性があります。

この記事を参考にして、canonicalタグを適切に設定し、SEO評価を上げ認知拡大や売上向上につなげましょう。