1. ホーム
  2. HTML

【HTML】canonical と noindex の使い方|重複ページを検索エンジンに正しく伝える方法

Share

同じ内容のページが、?utm_source=... が付いた URL と付いていない URL の2通りで存在している。タグの絞り込みや並び替えで、実質同じ一覧ページが何十通りも生成されている。こうした重複ページを放置すると、検索エンジンがどれを本命と見なせばよいか判断できず、評価が分散したり意図しない URL が検索結果に出たりします。この記事では、正規の URL を伝える <link rel="canonical"> と、そもそも検索結果に出さない <meta name="robots" content="noindex"> の書き方と使い分けを解説します。

重複ページはなぜ生まれるのか

検索エンジンにとって、URL が1文字でも違えば別のページです。人間の目には同じ記事に見えても、次のような URL はすべて別々に扱われます。

すべて別 URL として扱われる例
https://example.com/blog/css-grid/
https://example.com/blog/css-grid          (末尾スラッシュの有無)
http://example.com/blog/css-grid/          (http と https)
https://www.example.com/blog/css-grid/     (www の有無)
https://example.com/blog/css-grid/?utm_source=twitter
https://example.com/blog/css-grid/?ref=newsletter

本文が同じでも、検索エンジンから見れば「よく似た6ページ」です。この状態で被リンクが分散すれば、1ページに集まっていたはずの評価がばらけます。また、どれが代表かを検索エンジン側が推測して選ぶため、SNS 用のパラメーター付き URL が検索結果に表示されてしまうといったことも起こります。

そこで「このページの本来の URL はこれです」と明示するのが canonical、「このページは検索結果に載せなくてよいです」と伝えるのが noindex です。目的が違うので、まず役割を切り分けて考えてください。

canonical で正規の URL を伝える

<head> の中に <link> を1行書くだけです。

index.html
<head>
  <meta charset="UTF-8">
  <title>CSS Grid の使い方</title>
  <link rel="canonical" href="https://example.com/blog/css-grid/">
</head>

これを重複しているすべてのページに、同じ内容で書きます。?utm_source=twitter 付きの URL で表示されたときも、出力される canonical はパラメーターなしの URL のまま。そうすることで、検索エンジンはどちらの URL からアクセスしても「本命は /blog/css-grid/ だ」と理解できます。

書くときの決まりごとをまとめます。

項目指針
書く場所<head> の中。<body> に書いても無視される
URL の形式https:// から始まる絶対 URL にする
本数1ページに1本だけ。複数あると全部無視されることがある
自己参照正規ページ自身にも、自分を指す canonical を書いてよい
指す先実際にアクセスできる(200 を返す)ページにする

相対パスも仕様上は有効ですが、<base> の有無やパスの解釈で事故が起きやすいため、絶対 URL で書くのが鉄則です。プロトコルとホスト名まで含めて、実際にブラウザーのアドレスバーに出る形をそのまま書いてください。

canonical は「指示」ではなく「強いヒント」

ここは誤解されやすい点です。canonical を書いても、検索エンジンが必ずそのとおりに従うとは限りません。Google はこれを正規 URL を判断するための材料のひとつとして扱い、サイトマップの内容、内部リンクの張られ方、リダイレクトの状況などと突き合わせて最終的に決めます。

だからこそ、canonical だけを書いて安心せず、他のシグナルと矛盾させないことが大切です。canonical では末尾スラッシュ付きを指しているのに、内部リンクはスラッシュ無しで張っている。サイトマップには別の URL が載っている。こうしたズレがあると、指定が採用されにくくなります。

HTTP ヘッダーで送る方法

PDF や画像のように <head> を持たないファイルでは、HTTP レスポンスヘッダーで指定できます。

レスポンスヘッダー
Link: <https://example.com/blog/css-grid/>; rel="canonical"

「同じ資料の PDF 版とHTML版があり、HTML 版を正規にしたい」といった場面で使います。HTML ページであれば <link> タグのほうが確認しやすいので、通常はタグで書けば十分です。

noindex で検索結果から外す

そもそも検索結果に出したくないページには、robots メタタグを使います。

thanks.html
<head>
  <meta name="robots" content="noindex">
</head>

name="robots" はすべての検索エンジン向け、name="googlebot" のようにクローラー名を書けば特定のクローラーだけに指示できます。content にはカンマ区切りで複数の値を書けます。

値意味
noindexこのページを検索結果に表示しない
nofollowこのページ内のリンクをたどらない
nonenoindex, nofollow と同じ
noarchiveキャッシュされたページを表示しない
nosnippet検索結果に説明文(スニペット)を出さない
noimageindexこのページ内の画像をインデックスしない
index, follow既定の状態。書かなくても同じ

指定が無いときの既定は index, follow です。つまり「インデックスしてほしい」ために <meta name="robots" content="index, follow"> を書く必要はありません。書いても害はありませんが、意味はありません。

noindex を付けるのが適切なのは、次のようなページです。

  • フォーム送信後のサンクスページ・完了画面
  • サイト内検索の結果ページ
  • 会員専用ページやログイン画面
  • 公開前のステージング環境
  • タグや絞り込みで機械的に量産される、内容の薄い一覧ページ

robots.txt でブロックすると noindex が読まれない

noindex でいちばん多い失敗がこれです。「検索結果に出したくないから、robots.txt でもブロックしておこう」と両方を設定すると、逆効果になります。

robots.txt はクローラーに「このページを読みに来ないでください」と伝えるものです。読みに来なければ、当然ページの中の <meta name="robots" content="noindex"> も読めません。結果として noindex の指示が届かず、外部リンクなどから URL だけを知った検索エンジンが、内容不明のまま検索結果に載せてしまうことがあります。

検索結果から確実に外したいなら、robots.txt でブロックせず、クロールさせたうえで noindex を読ませるのが正解です。クロール自体を減らしたい場合と、検索結果から外したい場合は、手段が違うと覚えておいてください。

X-Robots-Tag ヘッダー

canonical と同じく、robots の指示も HTTP ヘッダーで送れます。PDF やアップロードした画像を検索結果から外したいときに使います。

レスポンスヘッダー
X-Robots-Tag: noindex

canonical と noindex の使い分け

どちらも「このページを検索結果に出したくない」場面で候補に挙がりますが、意味はまったく違います。

canonicalnoindex
伝える内容本命は別の URL ですこのページは載せないでください
評価の扱い正規 URL にまとめられるまとめられない
向いている場面同じ内容が複数の URL にあるそもそも検索に載せる価値がない
強制力ヒント(従わないこともある)指示(クロールできれば従う)

判断の目安はこうです。内容が同じページが複数あり、評価を1つにまとめたいなら canonical。内容の有無に関係なく、そのページ自体を検索結果に出したくないなら noindex。パラメーター付き URL は前者、サンクスページは後者です。

両方を同時に書かない

同じページに canonical と noindex を両方書くのは避けてください。「このページの評価は別の URL にまとめてほしい(だから別 URL は大事にしてほしい)」と「このページは検索から外してほしい」は、検索エンジンから見ると矛盾した指示です。どちらが優先されるか予測できず、正規 URL 側まで影響が及ぶこともあります。

WordPress では SEO プラグインの設定と、テーマが出力するタグが二重になって、この状態を作ってしまうことがあります。ブラウザーでページのソースを表示し、canonical と robots が意図したとおりに1本ずつ出ているかを確認してください。

よくある設定ミス

全ページが同じ canonical を指している

テンプレートに <link rel="canonical" href="https://example.com/"> をハードコードしてしまい、サイト内のすべてのページがトップページを指している、というミスです。これをすると、検索エンジンは「このサイトにはトップページしか無い」と解釈しかねません。個別ページが検索結果から消えるという深刻な事故につながります。

canonical は必ずページごとに動的に出力してください。WordPress の場合、テーマが wp_head() を呼んでいれば、個別記事の canonical は WordPress 本体が自動で出力します。自分で書き足す前に、すでに出ていないかを確認しましょう。

ページネーションを1ページ目にまとめている

「2ページ目以降は1ページ目の重複だろう」と考えて、/page/2/ の canonical を /page/1/ に向けるのは誤りです。ページごとに載っている記事が違うので、内容は重複していません。これをやると、2ページ目以降にしか無い記事を検索エンジンが見つけられなくなります。

ページネーションの各ページには、それぞれ自分自身を指す canonical を書いてください。/page/2/ の canonical は /page/2/ です。

canonical の先が noindex やリダイレクトになっている

指定先のページが noindex だったり、別 URL へリダイレクトされたり、404 を返したりしていると、指定は無効なものとして扱われます。canonical が指す先は、200 を返してインデックス可能なページである必要があります。サイトを移転したあと、旧 URL を指したままの canonical が残っていないか確認してください。

公開時に noindex を外し忘れる

開発中のサイトに noindex を入れておくのは正しい対応ですが、本番公開のときに外し忘れると、いつまで経っても検索結果に出てきません。WordPress には「検索エンジンがサイトをインデックスしないようにする」という設定項目があり、これが有効だとサイト全体に noindex が出力されます。公開後に「まったく検索に出ない」と感じたら、まず設定 → 表示設定のこの項目を確認してください。

まとめ

<link rel="canonical"> は、同じ内容が複数の URL で見られるときに「本命はこれです」と伝えるためのタグです。<head> の中に絶対 URL で1本だけ書き、重複しているすべてのページから同じ正規 URL を指します。あくまで強いヒントなので、内部リンクやサイトマップと矛盾させないことが採用されるコツです。

<meta name="robots" content="noindex"> は、そのページを検索結果に出さないための指示です。サンクスページやサイト内検索結果のように、検索から訪れても意味がないページに使います。robots.txt でブロックすると noindex 自体が読まれなくなるので、併用しないでください。

使い分けは「評価をまとめたいなら canonical、載せたくないなら noindex」。両方を同じページに書かない。この2点を守るだけで、重複ページ周りの事故はほとんど防げます。まずは自分のサイトをブラウザーで開き、ソースに canonical が1本だけ、正しい URL で出力されているかを確認してみてください。

参考ページ