canonical

canonicalタグの使い方・書き方 | SEOで必須なURLの正規化をご紹介!

キャノニカルタグ?カナニカルタグ?
意味も全く想像出来なければ、読み方もわからない!
僕が初めて「link rel=”canonical”」のことを知った時の印象は、こんな感じでした。
実際、読み方や意味を知らない方にタグの説明をした際も、
「このキャノニカルタグ?はそんな重要なの?」みたいな返しをいただいた記憶があります。笑

そんなlink rel=”canonical”ですが、実はSEO上では避けて通れないhtmlタグの一種。また、使い方をちゃんと把握しておかないと、サイト内のページが正しくGoogleなどの検索エンジンに表示されないなんて事も・・・。
今回はそんなSEO・WEB担当者を悩ませる「link rel=”canonical”」についてご紹介します!

link rel=”canonical”タグとは?読み方や意味について

まず、link rel=”canonical”タグの読み方についてご説明します。
読み方は、「リンク レル カノニカル」。一般的な読み方としては、
「カノニカルタグ」です。
「リンク レル」は「link属性」「rel属性」のhtml属性のことなので、これらは省略して「カノニカルタグ」と呼ぶことが多いのです。※ここから本記事では統一してcanonicalタグと記載していきます。

canonicalタグとは、「weblio辞典」に基づくと
「認められた」「基準的な」「標準的な」
といった意味が記載されておりますが、SEO対策上で使うcanonicalタグはこれらの意味とは少しニュアンスが異なります。

canonicalタグの意味は、
「正規化」
という意味です。

なるほど、わからん

・・・はい、じゃあ正規化ってなんやねん!って言うのと、そりゃ別物の意味じゃあすぐに理解出来ないのも納得の理由ですね。実際僕も初めに意味を知った時はそうでした。Googleもそうですが、ITってなんか難しい言葉を使いがちですからね。かっこよく見えるからか知らんけど。中学の際に英語の通知表で1を取り続けたyajiにとっては基本何も読めないので迷惑でたまらないですよ。

はい。そんな1ミリも需要のない話は置いといて、ここから「正規化」についてご説明していきます。
かなり難しい内容で、出来るだけわかりやすく説明出来るように努めていきますが、それでもわからない部分がありましたら、直接ご説明させていただきますのでお問い合わせくださいませ。。。

まず、canonicalタグの正規化と言うのは、
「URLの正規化」を表しています。

URLの正規化というのは、例えばファッションを取り扱うECサイトを運営している場合、3色のカラーを取り扱うTシャツのページを例に挙げますと、このようなページが存在することがあります。※最近はボタンを押せばページは変わらずに色だけが切り替わることが多いので、あくまで例です。

  1. Tシャツ 赤色
    https://aaa.com/tshirt/red
  2. Tシャツ 黄色
    https://aaa.com/tshirt/yellow
  3. Tシャツ 青色
    https://aaa.com/tshirt/blue

上記のように、3つのページに分かれます。この場合、SEOを既にある程度ご存知の方であれば分かると思いますが、基本的に色違いだけのページというのは
「コンテンツが重複している」
ことが一般的です。

  • https://aaa.com/tshirt/redのページのコンテンツ
    赤色は明るい印象を与えてくれているので、この夏にピッタリなカラーです!
  • https://aaa.com/tshirt/blueのページのコンテンツ
    青色は爽やかでクールな印象を引き出すので、大人なコーデを求めた方にピッタリ!

といったように各ページでコンテンツの内容が被っていなければ問題ありませんが、
基本的には色違いのTシャツだけが載せられ、それ以外の内容は同一であるということが多く見受けられます。(yajiの経験則)

この場合、Googleは各ページのコンテンツを
「重複コンテンツ」
とみなす可能性があります。

この重複コンテンツ、実はサイト内に大量に存在してしまうと、
「同じようなページが沢山ある」→「ユーザーにとってどのページが重要なのかわからない」→「このサイトはユーザーにとって使いづらい部分がある」となり、(イメージです)結果、Googleなどの検索エンジンのアルゴリズムに引っかかってしまい、ページ及びサイトの評価が下がってしまう可能性があります。

また、同じようなページが沢山存在してしまうと、Googleは

「どのページが重要なページなんだ?どれを評価すればいいんだ?内容が同じでわからん!もういいやリンクとかがよくあってアクセスとかもよくあるこのページ評価しとくわ!クレームは受け付けません!」


となってしまい(あくまでイメージです)、せっかく対象となるページに対してSEO対策を行なっても、各ページで評価が分散してしまい、検索エンジンが正しくページを評価出来ない可能性もあります。

これらの「重複コンテンツ」や「評価の分散」を防ぎ、適切に検索エンジンに対して評価してほしいページを認識させ、重複コンテンツの発生を抑えてページの評価を下げない為にはURLの正規化を行う必要があり、その役割を果たすのがcanonicalタグなのです。

canonicalタグの使い方・書き方

では、実際に上記の例を元に、canonicalタグの使い方や書き方についてご説明します。まず、書き方は「headタグ内に下記の内容を記述してください。bodyタグに記述しても、canonicalタグは機能しないのでご注意を。

<link rel="canonical" href="https://aaa.com/tshirt/red" />

実際に上記のhtmlタグを使用する際に書き換える箇所は、
href=”https://aaa.com/tshirt/red”
のURLの部分のみです。

次に、canonicalタグの使い方ですが、上記の色違いページでコンテンツ内容が重複しているTシャツサイトを元にご説明すると

  • https://aaa.com/tshirt/yellow
  • https://aaa.com/tshirt/blue

のページを、

  • https://aaa.com/tshirt/red

に対して正規化を行いたい場合、下記のcanonicalタグを、

  • https://aaa.com/tshirt/yellow
  • https://aaa.com/tshirt/blue

のheadタグ内に設置してください。

<link rel="canonical" href="https://aaa.com/tshirt/red" />

上記の対応を行うことにより、2つのページを検索エンジンは

https://aaa.com/tshirt/yellowのページとhttps://aaa.com/tshirt/blueのページは、https://aaa.com/tshirt/redのページにcanonicalタグで正規化しているから、このページを評価すれば良いのね! 

と判断してくれます。
これで評価の分散と重複コンテンツの発生を防ぐことができます。

もう少し補足を加えますと、
canonicalタグで黄色と青色2つのページを

  • https://aaa.com/tshirt/yellow
  • https://aaa.com/tshirt/blue

赤色のTシャツページである

  • https://aaa.com/tshirt/red

に正規化すると、上記2つのページは検索エンジン上に表示されなくなります。
検索エンジンに表示されるのは、canonicalタグで正規化された
赤色のTシャツページのみとなります。
canonicalタグは非常に強力なhtmlタグである為、
正規化するページを誤ってしまうと、対象とするページが表示されなくなることにより、サイトの流入に影響を及ぼしてしまう可能性がある為、注意してください。
もちろん、使い方を正しく把握すればサイトにとってプラスの評価を与えてくれるので、設置する際はURLに誤りがないかどうか必ず確認するようにしてください。

自己参照canonicalタグを設置しよう

サイト内に特に重複しているページも無いし、正規化するページも無い。ということはcanonicalタグは設置しなくても大丈夫だね! 

上のおっちゃんが言うように、確かにcanonicalタグを設置しなくても大きな影響はありません。但し、そのようなページが無かったとしても、基本的には自分のページのURLを記載したcanonicalタグを設置しておくべきだと言えます。これを自己参照canonicalと呼びます。

その理由は、少し専門的な話になってしまいますが、
広告のパラメータを使用していたり、動的ページが生まれるシステムをサイト内で使用していたとします。この場合、意図していない箇所で重複ページが発生している可能性もゼロではありません。

例えば、自社サイトで管理できていない

  • https://aaa.com/tshirt/red?=123456

上記のようなパラメータのページが存在していて、

  • https://aaa.com/tshirt/red

のページと内容が同一だった場合、予め上記のURLに

<link rel="canonical" href="https://aaa.com/tshirt/red" />

のcanonicalタグを設置しておくことにより、Googleの検索エンジンは

https://aaa.com/tshrt/red?=123456とhttps://aaa.com/tshrt/redのページの内容が同一だな。ちょっと制裁を加えてやろう・・。あ、よく見たらhttps://aaa.com/tshrt/redにはcanonicalタグは入っとるな。じゃあ今回は見逃しといたろ。 

となり(何回も言いますがイメージです)、例えパラメータ付きのURLにcanonicalタグが入っていなかったとしても、上記のように処理を行なってくれます。もちろん、処理を行うとはいえ100%の保証は出来ないので、パラメータ付きのURLにもcanonicalタグを設置しておくのがベストです。いわば自己参照canonicalタグは保険的な扱いです。保険には入っておいて損はないですし、設置しておいて損は無いということですね。

www.やindex.htmlのページにもcanonicalタグを!

下記のように、「www.あり・なし」「index.htmlあり・なし(拡張子の有無」のページの内容は基本的に同一ですが、実は同じ内容のページが存在しているとGoogleは判断します。

  • www.aaa.com
  • aaa.com
  • www.aaa.com/index.html
  • aaa.com/index.html

これらのURLに関しても、正規化を行う必要があります。
例えば、
「www.aaa.com」にcanonicalタグを正規化する場合、

  • aaa.com
  • www.aaa.com/index.html
  • aaa.com/index.html
<link rel="canonical" href="www.aaa.com" />

のcanonicalタグを記載しておくことにより、正規化が行われます。
但し、最近では301リダイレクトを用いて正規化を行うのが一般的ではあるので、.htaccessが使えない場合のみcanoncialタグで正規化を行いましょう。
※301リダイレクトに関しては別記事でご紹介させていただきます。

ドメイン跨ぎもcanonicalタグは利用可能

実はcanonicalタグはサイト内だけでは無く、ドメインを跨いで外部サイトに対して設置しても効果を果たします。基本的に使用する機会は無いとは思いますが、豆知識程度に覚えておいてください。

canonicalタグが効かない!

canonicalタグを正しく設置したはずなのに、URLが正規化されない・・・。何故だ?!

もし上記のケースが起きた場合、それはGoogleが
「このURLは正規化するべきでは無い」
と判断している可能性が高いです。

canonicalタグは、重複コンテンツや評価の分散を防ぐものであり、
内容が全く別のURLに対して正規化を行っても、効かないことがあります。
実際にyajiも内容がある程度似通ってはいるが、それぞれ独立したコンテンツが存在するページに対して実験を行いましたが、正規化されませんでした。
特に、上記に記載しているドメインを跨いだcanonicalタグの設置に関しては正規化されないことが多かったです。

その為、canonicalタグが効かない現象が起きたとしたら
それは正規化するべきでは無いと言うGoogleからのサインなので、記述内容を修正するようにしましょう。

canonicalタグ使用上の注意点・誤った例

canonicalタグは、誤った使い方をするとサイトの流入にも影響を与えてしまうため、
使用するにあたって、正しい知識が必要です。下記に使用上の注意点をまとめております。もし仮にcanonicalタグを誤って設置したとしても、正しい内容に修正すれば次回検索エンジンのクローラーがサイトを巡回した際に元に戻りますので、そこはご安心ください。

  1. 重複などとは関係ないページに対してcanonicalタグを設置してしまう。
    →例えば、下層ページに設置しているcanonicalタグを全てトップページに向けて設置してしまうと、これらのページのインデックスが消えてしまう可能性があります。今でこそ関係のないcanonicalタグはある程度処理し、適切にGoogleは判断してくれるようにはなりましたが、昔は実際に上記のケースに遭遇したことがあります。
    他によくあるケースとしては、ページネーション(ページまたぎ)のURLのcanonicalタグを1ページ目に対して設置してしまうのも誤った例です。Googleは各ページを独立して判断する為、設置する必要はありません。
  2. SSL化した際に、canonicalタグのURLが「http://」のままになっている。
    →SSL化を行うと、サイトのURLは「http://」から「https://」になります。
    この際、URLが「http://」のままだと、GoogleはこちらのURLで正規化してしまう為、必ず「https://」のURLに変更するようにしましょう。
  3. 相対パスでcanonicalタグを記述してしまう。
    →下記のような相対パスで記述するのは誤りです。

    <link rel="canonical" href="https:/aaa/" />

    相対パスでの記述は検索エンジンがcanonicalタグを正しく認識出来ない為、必ず絶対パスで記述するようにしてください。

  4. canonicalタグを2つ以上設置してしまう。
    →原則、1ページに1つのみです。2つ以上設置されている場合、片方は削除してください。

canonicalタグのまとめ

  • canonicalタグは重複コンテンツの解消やページの評価分散を防ぐ役割を果たしてくれる。
  • 重複ページが存在していなかったとしても、自己参照canonicalは可能な限り設置する。
  • 正規化したページをGoogleが重複していないと判断した場合、canonicalタグは無視される。
  • canonicalタグは非常に強力なタグなので、使い方を誤らないように注意する。

上記の4点を踏まえてcanoncalタグを適切に扱い、URLの正規化を行えば検索エンジンに対してプラスの評価を与えることが出来ますので、是非皆さんのサイトにもcanonicalタグを設置してみてください!