canonical（カノニカル）とは？URLの正規化でSEOのマイナス評価を避けよう

更新日: 2022年03月25日

突然ですが、canonical属性タグと聞いて、効果と使い方を正しく答えられますか？URLの正規化で非常に重要な役割を果たすのが、*canonical（カノニカル）*です。URLの正規化を行わないとリンクポピュラリティの分散を招き、SEO対策的にはNGです。

設定を間違えると検索結果から削除されてしまうなど、慎重な対応が必要なものでもあります。しかし、正しく使うことでリンクポピュラリティの分散も防ぐことができますので、必ず対応しておくべきものでもあります。今回は、canonicalの意味と正しい使い方を紹介します。

1. canonical（カノニカル）とは

canonicalとは、正式なURLを検索エンジン側に伝えるURLの正規化を目的としたものです。link要素の中で使われる属性値で、head要素の中で使います。
canonicalを設定すると、複数の重複ページが存在している場合に、検索エンジンに優先させるべきページを伝えることでそれ以外のページは重複ページであることを伝える事ができます。

2009年に大手検索エンジンサイト（Google、Yahoo、MSN）がサポートした機能です。

なぜURLの正規化が必要か

1.どれをインデックスに登録するか判断できない

重複ページが複数ある場合、何も設定していないと検索エンジンはそれらを全てクローリングしてインデキシングしようとします。
しかし、インデキシングの際に、重複ページは別ページとして認識されているため、独自性の無い質の低いコンテンツと判断されてしまいます。
本来はインデックスさせたいページを除外されたり、除外してもいいページを残してしまうということが起こります。

2.リンクポピュラリティが分散する

重複ページは何も設定しないと、別ページとして認識されることは前述した通りですが、外部から張られたリンクなどによる評価なども分散してしまいます。

2. canonical（カノニカル）の正しい使い方

設定しなければ損をしてしまうcanonicalの正しい使い方とはどんなものでしょう。

❶ canonical（カノニカル）の記述方法

1.head要素の中で使う。body要素の中は無視される。

canonicalはhead要素の中で使います。body要素の中で使っても、Googleは無視して処理してくれないので注意してください。

<head>
<link rel="canonical" href="http://example.com/">
</head>

上記のようにインデックスに登録させたいほうのURLを記述します。
こうすると、検索結果に表示されるページはcanonicalで指定しているhttp://example.comになります。

2.なるべくソース上部で記述する

HTML構造をクローラーが解析する際に、なるべくソースの上部にcanonicalを配置することで、早い段階でクローラーがcanonicalを読んで処理してくれます。
確実に処理されるように、ソース上部に記述するようにしましょう。

❷ canonical（カノニカル）を使ったほうがいいケース

設定方法は理解いただけましたでしょうか。
次に、canonicalを使ったほうが良いケースをいくつか挙げてみましょう。

1.ECサイトなどで類似した商品のページが複数出来るケース

ネットショップなどの場合、色違いの商品やサイズ違いの商品などが存在するケースがあります。
こうした商品それぞれにページURLを持たせている場合、重複ページとして認識される可能性があり、canonicalの使用を推奨しています。

例えば、下記のスマホケース販売サイトの場合、商品Aと商品Bと商品Cの違いは色だけでサイズも対応機種も同じです。

canonical事例

URLの構成は、

・http://www.example.com/caseA.html
・http://www.example.com/caseB.html
・http://www.example.com/caseC.html

です。

ケースの画像しか違わないため、重複ページとして認識されてしまいそうです。
こうした場合は、正規化したいURL（優先させたいURL）を決めて、それ以外のページにcanonicalを設置します。

今回は、商品Aを優先させましょう。商品Bと商品Cのページには下記のように設定します。

canonical正規化

こうすると、検索エンジン側は重複ページを正規化したいページのコピーであると認識してくれるため、質が低いと判断されペナルティを受けることを避ける事ができます。

2.スマホサイトと、ウェブサイトの内容が同じにも関わらずURLが違うケース

スマホサイトを運営していて、ウェブサイトと内容が同じにも関わらず別URLで運営をしている場合、canonicalの設定を正しく行う必要があります。
下記のようなケースです。

・http://www.example.com/ （ウェブサイトのURL）
・http://sp.example.com/　（スマホサイトのURL）

上記URLは別URLにも関わらず、内容が同じです。
こういう場合、UA（ユーザーエージェント）でユーザーがスマホ端末でウェブサイトにアクセスした際に、自動でスマホサイトへリダイレクトしてあげるなどの必要があります。

その上で、クローラーにそれぞれの存在を伝えるために、ウェブサイトとスマホサイトをアノテーションというもので関連付けてあげる必要があります。

アノテーションとは関連付けるという意味です。
今回で言えば、「ウェブサイトには、このページのスマホサイトURLはこれ！」と示し、「スマホサイトには、このページのウェブサイトURLはこれ！」と示すことです。

alternate

具体的なアノテーションのやり方は以下になります。

ウェブサイトURLの対応

http://www.example.com/ （ウェブサイトのURL）には以下のように記述します。

<link rel="alternate" media="only screen and (max-width: 640px)" href="http://sp.example.com/" />
<link rel="alternate" media="handheld" href="http://sp.example.com/" />

これで、スマホサイトのURLの存在を示しています。

スマホサイトURLの対応

次は、スマホサイトURLにもウェブサイトURLの記述をしてあげる必要があります。

<link rel="canonical" href="http://www.example.com/" />

ここでcanonicalが出てきました。このように使います。
もっと細かい手順に関しては、alternate属性とcanonical属性を正しく使ってスマホサイトの存在を伝えようを参考にしてください。

3.ABテストなどでテスト箇所以外が同じページが存在するケース

ABテストなどを行っていて、テスト箇所以外が同じなのにURLが違う場合は重複ページと判断される可能性があります。
その場合は、canonicalで一方に指定しておいたほうがいいでしょう。

4.AMPを実装したケース

AMPを実装すると、AMP用のHTMLが必要となります。AMP用のページと非AMPページで内容が重複してしまいますので、その際にcanonicalを使う必要があります。

非AMPページ

<link rel="amphtml" href="https://www.example.com/url/to/amp-version.html" />

AMPページ

<link rel="canonical" href="https://www.example.com/url/to/regular-html-version.html" />

参考：AMP ページの Google 検索ガイドライン - Search Console ヘルプ

❸ 使うべきか判断に迷ったら

canonicalを使うべきか判断に迷ったときのためにGoogleが公式で以下の見分け方を掲載していますので参考にしましょう。

有益な rel=canonical 指定を行うには:

・重複ページの本文コンテンツのほとんどが canonical ページにもあることを確認する。
・rel=canonical の指定は１ページで１つとし、かつページのタグ内で指定する。
・rel=canonical のリンク先が、有効なコンテンツが含まれている URL であること（404 やソフト 404 ではないこと）を確かめる。
・特集記事が検索結果に表示させたい URL と見なされてしまうため、ランディングページまたはカテゴリページで特集記事への rel=canonical リンクを指定することは避ける。

rel=canonical 属性に関する 5 つのよくある間違い

▼SEOを基本的な考えから学びたい方はこちら

Webマーケティング講座「SEO対策基礎編」

SEO対策の正しい捉え方や、Googleの評価するポイント、やってはいけない施策などを解説しています。

資料をダウンロード

3. canonical（カノニカル）に関するよくある間違った認識

canonicalの使い方でよくある間違いをGoogleが公開しているので、ご紹介します。

間違い❶：ページネーションの1ページ目をrel=canonicalのリンク先とする

下記のようなURL構成のページがあるとします。

・example.com/article?story=cupcake-news&page=1
・example.com/article?story=cupcake-news&page=2
・以降同様

こういう構成の場合、2ページ目（example.com/article?story=cupcake-news&page=2）のcanonical設定を1ページ目に向けているサイトがよくありますが、これはNGです。
canonicalは重複ページをまとめる意味がありますが、上記の場合1ページ目と2ページ目はページの中身が違うので重複ページではないからです。

こういった場合は、全てのコンテンツが載っているAllページを作成し、そちらにcanonicalを各ページから張るか、ページネーションに使う rel=prev/nextを使いましょう。

間違い❷：絶対URLのつもりで相対URLで記述してしまう

canonicalは相対URLでも絶対URLでも指定することができます。しかし、下記のような間違いをしてしまいがちです。

ダメな例：< link rel="canonical" href="example.com/cupcake.html ">
良い例①：< link rel="canonical" href="/cupcake.html" >
良い例②：< link rel="canonical" href="http://example.com/cupcake.html" >

http:// やhttps:// がついていない場合は、相対URLとして判断されます。よって、上記のダメな例は相対パスとして判断されます。
このページのドメインはexample.comですから、クローラーはダメな例で指定されたcanonicalを「http://exapmle.com/example.com/cupcake.html」として判断してしまいます。
これは、間違ったURLなので、検索エンジンは結果的に正しくcanonicalを処理することができません。

間違い❸：canonical（カノニカル）を意図しない形で指定している、または2つ以上指定する

何かのページテンプレートを参考にページを作成している場合、ページテンプレートの中に元々設定されていたcanonicalのまま、使っているケースがあるようです。
このまま使ってしまうと、ページテンプレート製作者のページヘcanonicalが設定されてしまいます。
必ずページ作成前にテンプレートをチェックし、設定があれば削除するようにしましょう。

間違い❹：カテゴリページまたはランディングページで特集記事への canonical（カノニカル）リンクを指定する

ある記事ページの内容を、その上位のカテゴリーページがほとんど含んでいるため、カテゴリーページが記事ページヘのcanonical設定をしている場合があります。
この場合カテゴリーページはインデックスに登録されなくなってしまいます。

カテゴリーページをインデックスに登録したくない場合はそれでも問題ありませんが、どちらもインデックスに登録させたい場合は、

canonicalを設定しない
カテゴリーページに自身のページへのcanonicalを設定する

のどちらかで対応しましょう。

間違い❺：body要素内にcanonicalを入れる

rel=canonicalはhead要素の中に入れる必要があります。body要素の中に記述してもGoogleは無視してしまいます。

bodyにcanonicalを入れるダメな例

間違い❻：canonical（カノニカル）は必ず処理されるわけではない

canonicalはクローラーに対して発信するシグナルです。そのシグナルをクローラーが受け取ったからといって、どう処理するかは検索エンジン側に委ねられてしまうことを認識しておきましょう。

4. canonical（カノニカル）に関するよくある質問と回答

Yahoo知恵袋で閲覧数の多いcanonicalに関する質問があったので、それに対する私の回答も載せます。

Q1. canonical（カノニカル）は同一ページに複数回使ってもいいのでしょうか？

同一ページ内にcanonicalを設置した場合、クローラーはどのURLを正規URLとして判断していいか分からないため、記載されている全てのURLを無視します。
よって、canonical自体が無効化されますので、必ずcanonicalは1つのページの中で1回に留めて使ってください。

Q2. 一覧ページの2ページ目以降にはcanonical（カノニカル）を入れたほうがいいのでしょうか？

一覧ページの2ページ目以降に1ページ目に向けてcanonicalを入れるかどうかという質問ですが、これは行わないほうがいいです。
3.1のよくある間違い①にも記載しましたが、似ていても中身が違うのでこれは重複ページではないからです。canonicalは重複したページに使うようにしましょう。

Q3. canonical（カノニカル）は違うドメインでも有効なのでしょうか？

違うドメインに向けたrel="canonical"は有効です。これはGoogleの長山氏も言及しています。

たまに誤解されてる方がいますが、rel="canonical" はドメインが異なっても有効ですよ！
— Kazushi Nagayama (@KazushiNagayama) 2015, 7月 21

5.canonical（カノニカル）によるURLの正規化はあくまでも対応策でしかない

今までcanonicalの使い方を説明してきましたが、極力こういう対応をしないで済むようにサイト制作、サイト運営を心がけておくことが一番いいのは間違いありません。
一例ではありますが、スマホサイトを一から立ち上げるのであれば、ウェブサイトとスマホサイトのURLを統一し、UAで振り分けておけば、canonicalとalternateを使ったアノテーションの必要もないわけです。

このように、事前に設計をしておけば避けられることも多分にあるということを忘れてはいけません。