Web制作コラム

canonical・noindex・301リダイレクトの使い分け|重複ページを正しく扱う

用語・技術解説

同じ内容が複数の URL で見える、検索結果に出したくないページがある、URL を変えた。似た場面でも、使う手段は違います。3つが何をするのかと、場面ごとの選び方、よくある間違いをまとめました。

サイトのリニューアルを控えたクライアントから「古いページは canonical を付けておけばいいんですよね?」と聞かれたことがあります。話を聞いてみると、そのケースで本当に必要だったのは 301 リダイレクトでした。

同じ内容のページが複数の URL で見えている。検索結果に出したくないページがある。ページの URL を変えた。こうしたときに使う手段が、canonical、noindex、301 リダイレクトです。

3つとも「検索エンジンにどの URL を扱ってほしいか」を伝えるものですが、効き方が違うんです。取り違えると、出したいページが検索結果から消えたり、消したいページが残ったりします。そのときクライアントに説明した内容を、整理しておきます。

3つは何をするのか

手段何をするか読者から見ると検索エンジンへの効き方
301リダイレクト古い URL へのアクセスを、新しい URL へ転送する新しい URL に移動する転送先を正規の URL とする強い合図になる
canonical「このページの正規の URL はこちら」と示すそのまま見られるあくまで提案。検索エンジンが別の URL を選ぶこともある
noindex「このページを検索結果に出さない」と指示するそのまま見られるページが読まれたうえで、検索結果から外される
robots.txt の Disallowページの巡回(クロール)を止めるそのまま見られる中身を読ませないだけ。検索結果から消す指示ではない

※ 横にスクロールできます

選び方の考え方は、実はシンプルです。古い URL を読者に見せる必要がないなら 301。読者には見せる必要があるけれど、検索では1つにまとめたいなら canonical。読者には見せるが、検索結果には出したくないなら noindex。私はいつもこの3つの問いで切り分けています。

場面ごとの選び方

場面使う手段理由
www あり・なし、http・https、末尾スラッシュの有無301どれか1つに揃え、ほかは転送する。読者に別の URL を見せる必要がない
サイトの移転、URL の変更301古い URL のブックマークやリンクから来た人も、新しいページに届く
並べ替え・絞り込み・広告の計測用のパラメータが付いた URLcanonical機能としては必要なので転送できない。パラメータなしの URL を正規として示す
印刷用のページなど、同じ内容の別の版canonical元のページを正規として示す
サイト内検索の結果ページnoindex検索語ごとに中身が変わり、検索結果に出す意味が薄い
記事が1〜2本しかないタグのページnoindex(または作らない)中身の薄い一覧が大量に並ぶのを避ける
お問い合わせの完了ページnoindex検索から直接来られても意味がない
テスト環境(ステージング)パスワード保護(Basic 認証)noindex だけでは誰でも見られる。見られないようにするのが先

※ 横にスクロールできます

www の有無や http と https の統一は、canonical だけで済ませず、サーバー側の 301 で1つにまとめるのが確実です。案件でも必ずそうしています。理由は別の記事で詳しく書きました。

それぞれの書き方

canonical

head の中に link 要素で書きます。URL は https から始まる絶対 URL で書き、1ページに1つだけにしてください。

HTML

<link rel="canonical" href="https://example.com/column/canonical-noindex/">

正規のページ自身にも、自分の URL を指す canonical を入れておきます(自己参照の canonical)。こうしておくと、?utm_source=... のようなパラメータが付いた URL で読まれたときも、パラメータなしの URL にまとまるんです。

noindex

head の中に meta 要素で書きます。PDF のように HTML ではないファイルは、サーバーの設定で X-Robots-Tag というヘッダーを付けます。

HTML

<meta name="robots" content="noindex">

.htaccess(PDF を検索結果に出さない)

<FilesMatch "\.pdf$">
  Header set X-Robots-Tag "noindex"
</FilesMatch>

301 リダイレクト

Apache のサーバーなら .htaccess に書きます。ページ単位の移動と、サイト全体の URL の統一は、次のように書けます。

.htaccess

RewriteEngine On

# http と www あり を、https の www なしに揃える
RewriteCond %{HTTPS} off [OR]
RewriteCond %{HTTP_HOST} ^www\. [NC]
RewriteRule ^(.*)$ https://example.com/$1 [R=301,L]

# ページ単位の移動
RewriteRule ^old-page/$ https://example.com/new-page/ [R=301,L]

CDN やロードバランサーを通しているサーバーでは、%{HTTPS} が正しく判定できず、転送が繰り返されることがあります。書き方はサーバーの環境によって変わるので、反映したら実際の URL で動きを確かめてください。私も反映後は毎回ブラウザと curl の両方で確認しています。

よくある間違い

noindex のページを robots.txt でも止めている

引き継いだサイトを調べていると何度も出会うのが、検索結果から外したいページに noindex を書き、さらに robots.txt の Disallow で巡回も止めてしまうケースです。巡回を止めると、検索エンジンはページの中身を読めないので、noindex の指示にも気付けません。結果として、URL だけが検索結果に残ることがあるんです。

検索結果から外したいなら、巡回は許可したまま noindex を読ませます。外れたことを確認してから、必要なら robots.txt で止める。この順番が大事です。

robots.txt(これでは noindex が読まれない)

User-agent: *
Disallow: /thanks/

全ページの canonical がトップページを指している

テンプレートに canonical を固定の URL で書いてしまった、テーマやプラグインの設定を誤った、といった原因で起きます。すべてのページが「自分はトップページの複製です」と宣言していることになり、下の階層のページが検索結果に出なくなるおそれがあります。canonical は、ページごとに自分自身の URL(または本当の正規のページ)を指すようにしてください。

noindex のまま公開している

制作中に付けた noindex を、公開のときに外し忘れる例です。WordPress の「検索エンジンがサイトをインデックスしないようにする」のチェックが残っていると、全ページに noindex が付きます。公開後に「検索に出ない」と相談されて、原因がこれだったということは珍しくありません。

移転で、すべての URL をトップページに転送している

サイトを移転するときに、古いページをすべて新しいサイトのトップページへ 301 で転送する例です。内容の対応しない転送は、Google にソフト 404(実質的には存在しないページ)として扱われることがあります。古いページは、内容が対応する新しいページへ1対1で転送しましょう。

合図どうしが食い違っている

canonical の先が noindex のページ、404 のページ、さらに転送されるページになっている、といった食い違いもよく見ます。canonical・301・サイトマップに載せる URL は、すべて同じ正規の URL に揃えておくのが基本です。

WordPress での設定場所

やりたいこと設定する場所
制作中、サイト全体を検索に出さない設定 → 表示設定 → 「検索エンジンがサイトをインデックスしないようにする」
投稿・固定ページの canonicalWordPress 本体が自動で出力する。SEO 系のプラグインを入れていれば、プラグインが出力する
サイト内検索の結果ページの noindexWordPress 本体が既定で付ける
ページ単位の noindexSEO 系のプラグインの、投稿編集画面の設定欄。または functions.php
URL の転送(301).htaccess の「# BEGIN WordPress」より上、または転送用のプラグイン

※ 横にスクロールできます

プラグインを使わずに、条件を決めて noindex を付ける場合は、wp_robots フィルターを使います。たとえば、記事が2本未満のタグのページに noindex を付けるなら、次のように書けます。プラグインを増やしたくない案件では、私はこの方法をよく使います。

functions.php

add_filter("wp_robots", function ($robots) {
  if (is_tag() && get_queried_object()->count < 2) {
    $robots["noindex"] = true;
  }
  return $robots;
});

投稿のスラッグ(URL の末尾)を変えた場合、WordPress は古いスラッグを覚えていて、古い URL から新しい URL へ自動で転送してくれます。一方で、パーマリンクの形式そのものを変えた場合や、サーバーを移った場合は、自分で転送を設定する必要があります。

まとめ

  1. 読者に見せる必要がない古い URL は 301、見せるが1つにまとめたいなら canonical、検索結果に出したくないなら noindex
  2. canonical は提案。URL の統一はサーバーの 301 で行う
  3. noindex のページを robots.txt で止めない
  4. canonical はページごとに自分の URL を指す。全ページをトップに向けない
  5. 移転の転送は、内容が対応するページへ1対1で

移転や URL の変更もお任せください

ワプラボでは、サーバーの移転やドメインの変更のときに、古い URL から新しい URL への 301 リダイレクトまで設定しています。canonical や noindex が意図どおりに出ているかの確認だけのご相談にも対応していますので、気になる点があれば気軽に声をかけてください。

「用語・技術解説」のコラム

この記事と同じカテゴリの記事です。

一覧に戻る

SERVICES

WordPressとECサイトの制作、
まとめてご相談いただけます

WordPress

WordPress制作・構築代行

デザインデータやコーディング済みHTMLを、オリジナルテーマとして構築します。プラグイン開発も対応。

構築基本費用 50,000円

詳しく見る
コーディング

コーディング代行

デザインデータをHTML/CSSに起こします。WordPress化まで通しでも、コーディングだけでも承ります。

1ページ 15,000円〜

詳しく見る
React

Reactコーディング代行

デザインデータをReactのコンポーネントとして実装します。既存アプリへの画面追加・UI改修だけでも承ります。

1ページ 18,000円〜

詳しく見る
Next.js

Next.js制作・コーディング代行

検索エンジンに読まれるHTMLを返せるNext.jsで構築します。静的書き出しでレンタルサーバーでも公開できます。

1ページ 18,000円〜

詳しく見る
EC / WordPress

WelcartでのECサイト構築

WordPress専用のネットショップ構築プラグイン。機能面まで踏み込んだカスタマイズができます。

デザイン制作+構築 一式 120万円〜

詳しく見る
EC / EC-CUBE

EC-CUBEでのECサイト構築

国産オープンソースのECパッケージ。決済・受注・在庫まわりを業務に合わせて作り込めます。

デザイン制作+構築 一式 120万円〜

詳しく見る
EC / ASPカート

ECサイト制作代行

Shopify・MakeShop・カラーミーなどのカートに、オリジナルデザインを組み込みます。

構築基本費用 100,000円

詳しく見る

制作のご相談も承っています

デザインデータと画面数をお知らせいただければ、お見積りと納期をご提示します。

直近2週間の受付状況制作のリソース

10/26(月)〜10/30(金)残りわずか
11/2(月)〜11/6(金)余裕があります
Chatworkで相談する