SEOを実施する上で、必ず理解しておきたい重要なタグの記述がいくつかあります。
その1つが canonicalタグです。
残念ながら、canonicalは誤解が多く、しばしば曖昧な解釈のまま使われていたりしますが、検索への影響力が強い機能だからこそ、逆効果とならないよう注意が必要です。
- canonicalタグの役割と効果
- canonical の書き方
- 具体的な使用ケース
- 正しい使い方と間違った使い方
などについて、詳しく解説します。
目次
canonical とは
canonical (カノニカル) は、同一コンテンツに対して複数のURLが存在する場合や、酷似する内容のページがある場合に、どのURLを代表して検索結果に表示するのかを検索エンジンに明示するためのタグ（の属性値）です。
日本語では 正規化 を意味し、英語では canonicalization (カノニカライゼーション) と言います。
HTMLに記述するタグの中で使用する単語が canonical (カノニカル) です。
主に、SEOでの重複コンテンツ対策として利用されます。
Webサイトを運営していると、重複コンテンツはほとんど自然に発生するものなので、SEO対策をする上では不可欠なタグと言えます。
SEOにおける canonical の効果
canonical を設定してURLを正規化することが、どのような役割や効果を持つのか。
具体的には、以下のようなことがあげられます。
検索結果に表示するコンテンツの選択
検索エンジンは、同一または類似するコンテンツを複数発見した場合、検索結果に表示すべき代表のコンテンツを独自に判断します。
検索エンジン側で判断するということは、言い換えれば、Webサイトオーナーが希望するURLのコンテンツが表示されるとは限らない、ということです。
canonicalを記述すれば、こちらの希望するURLのコンテンツを検索結果に表示してもらえるようになります。
ただし、非常に強いシグナルを持つ機能ではあるものの、どんな状況下でも100%希望通りに表示されるわけではありません。
検索エンジンが様々な要素から判断した結果、稀に正規コンテンツ以外が検索結果に表示されることがあることは、覚えておきましょう。
クロールとインデックスの最適化
重複コンテンツの類が多く発生すると、 検索エンジンにとっては、それだけクローリングやインデクシングに余分な時間を費やしたり、正規・非正規を判断する指標をまとめることが難しくなります。
結果として、「わかりにくい」「似たり寄ったりのコンテンツが多い」というような印象に繋がってしまいます。
canonicalを指定することで、無用なマイナス評価を避け、適正にコンテンツを評価してもらえるようになります。
正規ページのクロールが重視されるようになり、非正規ページヘのクロールの優先度は下がります。
被リンクの分散を統合
Googleは、実際には同じページであっても、URLが違うものは別ページと認識します。
ですので、同じコンテンツに向けられている被リンクであっても、リンクのURLが違っていた場合には、被リンクのSEO効果が分散されることになります。
例えば、example.com への被リンクを3つ、www.example.com への被リンクを2つ受けていたとします。
2つのURLは同じページまたはサイトですので、人間から見れば、5つの被リンクを獲得していると解釈できます。
しかし、検索エンジンから見ると、被リンク3つのページと2つのページ、と見えています。
このままだと、本来得られるはずの5つ分の被リンク効果が得られないので、URLを正規化して分散されている被リンクのシグナルをまとめてもらいます。
canonical の書き方
便宜上、「canonicalタグ」という呼び方をされることが多いですが、HTMLの書き方は、link要素の rel 属性の値に canonical と記述します。
リンク先を示す href属性 に正規URLを記述します。
URLは、http(s) から始まる完全なURL形式（絶対パス）で記述しましょう。
非正規URL → 正規URL に向けて書きます。
<link rel="canonical" href="正規URL">例えば、primary.html と secondary.html という重複コンテンツになるページが2つあるとします。
検索結果に表示したい正規のページが primary.html ならば、secondary.html 側に
<link rel="canonical" href="https://example.com/primary.html">
と書きます。
その他、canonical を書く時は原則として次のことを守ります。
- headタグ内に記述する（body タグ内は誤り）
- 1つのソースファイルに canonical の記述は1つのみ（複数不可）
- 正規・非正規の両コンテンツが 完全に重複する または 大部分が重複していること
- リンク先URLが 404エラー を返していないこと
- リンク先URLに noindex が指定されていないこと
タグは、head内でもなるべく始まりに近い位置に記述すると、Googleに認識してもらいやすくなります。CSS・JavaScriptファイルの読み込み等の処理よりも前に記述しましょう。
具体的な canonical の使い方
canonical を設定すべき、一般的なケースです。
ドメインの www 有り無しの統一
検索エンジンは、ドメインの www の有り無しで別サイトと認識するので、どちらか一方に統一しておきます。
ただし、301リダイレクトを設定できるなら、リダイレクトによる統一でOKです。
301リダイレクトが設定できない場合は canonical を利用します。
トップページについては、index.html 有り無しの統一も同時に行うことができます。
加えて、Google Search Console のサイト設定メニューからも、正規化を行っておきましょう。
パラメータやセッションIDなどの動的URL
絞り込み検索などによる類似コンテンツの生成や、セッションID・分析用パラメータの有無による複数URL発生への対処です。
URLの例https://www.example.com/products?category=dresses&color=green
https://example.com/dresses/cocktail?gclid=ABCD
http://www.example.com/page.html?utm_source=mag1234...
CMSが生成する別URLの重複コンテンツ
CMSの仕様によって、同一ページまたはミラーページ（複製）が別のURLで生成されるケースです。
URLの例
https://blog.example.com/dresses/green-dresses
https://blog.example.com/green-things/green-dresses
PC用とスマートフォン用のサイトが別URLの場合のアノテーション
PCサイトとモバイルサイトが別々のURLで構成されている場合は、互いの関連性を検索エンジンに伝えるアノテーションを追加します。
アノテーションの構成は次の2つです。
- モバイル用ページには
link rel="canonical"でPC用ページのURLを指定 - PC用ページには
link rel="alternate"でモバイル用ページのURLを指定
モバイル用ページの記述例 <link rel="canonical" href="http://www.example.com/page-1">
PC用ページの記述例<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/page-1">
AMPページから非AMPページへ向けた正規化
WebコンテンツのAMP版ページがある時は、AMPページ側に、非AMPページへ向けた canonical を記述します。
AMPページの記述例<link rel="canonical" href="https://example.com/normal-page">
非AMPページには、AMP版ページの存在を伝えるために、rel="amphtml" で対応するAMPページのURLを記述します。
非AMPページの記述例<link rel="amphtml" href="https://example.com/normal-page/amp">
ちなみに、通常のWebページがなく、AMPページのみが存在する スタンドアロンAMP の場合は、自分自身に向けた正規化を行います。自己参照 canonical です。
スタンドアロンAMPページの記述例<link rel="canonical" href="https://example.com/owned-amp-page">
『AMPって何？』という方は、以下の記事をご覧ください。
A/Bテストの実施
ページのA/Bテストを行う場合に複数のファイルを用意することがありますが、それらのページはテスト箇所を除けば、コンテンツは重複しますよね。
テストをする時もURLの正規化をしておけば、検索ランキングへの影響をほぼ受けることなく、A/Bテストが行えます。
ユーザーと検索エンジンとで見せるページを変えるクローキングはしないように注意しましょう。
クロスドメイン (別ドメイン) への canonical
URLの正規化は、異なるドメインにあるコンテンツを指定することもできます。
自分が所有する別サイトに同じコンテンツを載せる必要がある場合や、第三者のサイトへ記事の転載や寄稿を行う場合などがあります。
canonical の記述方法は全く同じで、リンク先に正規化したいドメインのページの完全URLを記述します。
<link rel="canonical" href="https://original-site.com/original.html">canonical と 301リダイレクト の違い
URLの正規化については、301リダイレクトという選択肢もあります。
301リダイレクトと canonical の大きな違いは、ページを表示するかどうかの違いです。
301リダイレクトは、ユーザーも検索エンジンもリダイレクト元のページを見ることはできません。
canonicalは、ユーザーも検索エンジンも、正規・非正規どちらのページも見ることができます。
あくまで正規URLを検索エンジンに伝えて、検索結果に表示するURLバージョンをリクエストするための記述が canonical です。
例えば、単にURLの変更ということなら、通常古いURLのページを見せる必要はありませんので、301リダイレクトが利用できます。
そうすれば、もし旧URLのままのリンクから飛んできたり、古いままのブックマークやダイレクトアクセスの場合にも、新しいページに来てもらうことができますね。
canonical が強いヒントを検索エンジンに与えるのに対して、301リダイレクトは強制的な転送なので、より確実な対応をとることができます。
canonical を利用するのは、
- 重複コンテンツの類であってもユーザーに見せたい時
- 301リダイレクトを使うと不都合が起きる時
- そもそも301リダイレクトが使えない環境にある時
といったケースです。
2つの挙動の違いを理解して、適切な方法を選択しましょう。
canonicalタグを使う時の注意点とよくある間違い
安易に使ってしまうと逆効果となることがあるので、利用する時の注意点とよくある間違いについて理解しておきましょう。
robots.txt でクローラーをブロックしない
「URLの正規化」を考えた時に、robos.txt を利用して非正規ページをクロールさせない（インデックスさせない）という方法を思いつくかもしれません。
残念ながら、robots.txt でページをブロックをしても、クローラーが訪れないという保証はありません。他のページからリンクされていたら、リンクを辿ってクローラーはやってくるからです。
そもそも robots.txt は、URLの正規化のために利用するものではないので混同しないようにしましょう。
http から https 移行に伴う正規化
SSLを導入して、http から https へプロトコルを移行した時に、忘れずに canonical のリンク先も変更しましょう。
Googleは標準で http よりも httpsプロトコルを優先するように動きますが、canonical の記述が http のままだと、適切なインデックス処理の妨げとなります。
さらに、canonical の変更を忘れたまま、http から https へのリダイレクトを設定してしまうと、以下のような事態を引き起こします。
- クローラーが httpサイト にアクセス
- 301リダイレクト で https サイト に転送される
- canonical を発見し httpバージョン が正規であると認識
- 再び httpサイト のクロールを試みる
- https へ転送される・・・
クローリングがループしている状態なので、よくないですね。
XMLサイトマップの正規化
サイトマップは、クロールやインデックスを効率的に行ってもらうためのヒントになります。
https に移行した時は、XMLサイトマップ内ののURLも忘れずに変更しておきましょう。
それと、XMLサイトマップには正規化コンテンツのみを記述する方が良いです。
重複コンテンツなどインデックス不要なURLは含めないということです。
「サイトマップ = サイト上の全ページの記載」である必要はありません。
canonical のリンク先の noindex
noindex が指定されているページに向けた正規化は、検索エンジンの判断を迷わすことになるので避けましょう。
- クローラーが A というページを訪れたところ、正規URLは ページB だとわかった
- ページB を訪れたが、ページB には noindex の記述があり、インデックスしないように指示されている・・・
これでは、正規化の意味が無いですよね。
サイトのページが増えて複雑化するほど、管理が行き届かずにやってしまいそうなので、要注意です。
例外として、自己参照型の canonical の場合は noindex を記述できます。
例えば、WordPressはデフォルトの仕様で、自分自身に向けたcanonicalタグを自動で生成しますが、この場合はnoindexを設定しても問題ありません。
ページネーションのあるコンテンツの2ページ目以降の正規化
ページ送りを付けて分割したページ構成となっている場合に、2ページ目以降の canonicalのリンク先を1ページ目に指定するのは誤りです。
重複コンテンツを回避するために、1ページ目を正規として検索結果に出すという意図があるのでしょう。
しかし、ページナンバーによってコンテンツの内容は異なるはずなので、重複コンテンツと考えることはありません。
ユーザーの検索クエリによっては、2ページ目以降のコンテンツを検索結果に表示した方が、適切なコンテンツを提供できることがあります。
重複コンテンツでないページヘの正規化
canonical が使えるのは、内容が完全に一致するコンテンツ または 内容の大部分が重複するコンテンツが存在するケースです。
例えば、トップページの順位を上げたいからという理由で、内容の違うページにもかかわらず、canonical を使ってトップページのURLを指定するのはおかしな記述です。
重複しないページ間での正規化は誤りです。
SEOを意識するほど、SEOのためのSEOに陥りがちですが、本来の目的から外れるような使い方は御法度です。
悪意や意図がなく単に間違えていたとしても、検索結果に悪影響が出るので慎重に行いましょう。
canonical を指定しているのに適切にインデックスされない時の対処法
正規化が上手くいかないようなら、まずは記述に誤りがないか確認します。
スペルの書き間違いもそうですが、意味が通らなかったり、矛盾するような指定になっていないかという点からも確認しましょう。
記述にミスがないことを確認したら、少し様子を見ます。
Fetch as Google を利用してみても良いでしょう。
いずれにしても、検索エンジンが canonicalタグを発見してから、処理するまでには少し時間がかかるので、あらかじめそのつもりで対処しましょう。
コメントをどうぞ