canonicalタグとは？ — URL正規化のためのHTML要素
canonicalタグの定義
canonicalタグ（正式名称：rel="canonical"）とは、同一または類似コンテンツが複数URLで存在する場合に、検索エンジンへ「このURLが正規版です」と指定するHTML要素です。
HTMLの<head>セクション内に以下のように記述します。
<link rel="canonical" href="https://example.com/page/" />
この記述は、「このページの正規URLはhttps://example.com/page/です」とGoogleに伝える役割を果たします。
URL正規化とは
URL正規化（URL Canonicalization）とは、同じコンテンツにアクセスできる複数URLの中から、インデックスすべき1つのURLを決定するプロセスです。
たとえば、以下のURLはすべて同じページを表示する可能性があります。
https://example.com/page
https://example.com/page/
http://example.com/page
https://www.example.com/page
https://example.com/page?ref=twitter
https://example.com/page?utm_source=google
これらが別々にインデックスされると、SEO上の問題が発生します。
Googleがcanonicalタグを導入した背景
Googleは2009年にcanonicalタグのサポートを開始しました。なぜなら、Web上の約25〜30%のコンテンツが重複コンテンツだったからです。ECサイトの商品ページ、パラメータ付きURL、httpとhttpsの混在など、意図せず重複URLが生成されるケースが非常に多かったのです。
canonicalタグが必要な理由 — 重複コンテンツのリスク
重複コンテンツがSEOに与える影響
canonicalタグを正しく設定しないと、以下のリスクが発生します。
|
リスク |
説明 |
影響度 |
|
クロールバジェットの浪費 |
同じコンテンツを複数URLでクロールされる |
★★★★☆ |
|
PageRankの分散 |
被リンクの評価が複数URLに分散する |
★★★★★ |
|
インデックスの混乱 |
意図しないURLがインデックスされる |
★★★★☆ |
|
検索順位の低下 |
評価が分散した結果、順位が下がる |
★★★★★ |
|
ペナルティリスク |
意図的な重複と誤認される可能性 |
★★☆☆☆ |
PageRankの分散問題
最も深刻な影響はPageRank（リンクジュース）の分散です。あるページに10本の外部リンクがあるとします。
|
状態 |
評価の分配 |
SEOインパクト |
|
canonical正しく設定済み |
10本分が1つのURLに集中 |
最大限の評価を獲得 |
|
canonical未設定で2URLに分散 |
5本ずつに評価が分散 |
評価が半減 |
|
canonical未設定で3URLに分散 |
約3.3本ずつに評価が分散 |
評価が3分の1に低下 |
つまり、canonicalタグを適切に設定するだけで、リンク評価を正規URLに集約し、検索順位の向上が期待できるのです。
クロールバジェットへの影響
大規模サイト（数万ページ以上）の場合、クロールバジェット——Googleがサイトをクロールする際の「予算」——への影響も無視できません。重複URLが大量に存在すると、本来クロールすべき重要ページが後回しにされます。
canonicalタグを設定すべき5つのケース — 具体的なURL例で解説
ケース1：wwwあり/なしの統一
https://example.com/page
https://www.example.com/page
同じコンテンツがwwwありとなしの両方でアクセスできる場合、canonicalタグで正規URLを指定します。
ケース2：http/httpsの混在
http://example.com/page
https://example.com/page
SSL化が完了していても、httpのURLがインデックスに残る場合があります。301リダイレクトと合わせてcanonicalタグも設定しましょう。
ケース3：パラメータ付きURL
https://example.com/page
https://example.com/page?sort=price
https://example.com/page?color=red&size=L
ECサイトの絞り込みやソート、トラッキングパラメータで生成されるURLは、canonical設定が特に重要です。
ケース4：末尾スラッシュの有無
https://example.com/page
https://example.com/page/
末尾スラッシュ（trailing slash）の有無でも、異なるURLとして認識される場合があります。どちらか一方に統一しましょう。
ケース5：モバイルページとPCページ
|
構成タイプ |
canonical設定 |
理由 |
|
レスポンシブデザイン |
不要 |
URLが同一のため |
|
動的配信（同一URL・異なるHTML） |
不要 |
URLが同一のため |
|
別URL構成（m.example.com等） |
必要 |
モバイルページからPCページへcanonical指定 |
Googleはレスポンシブデザインを推奨しています。別URL構成の場合はcanonicalタグとalternateタグの相互設定が必要です。
canonicalタグの正しい書き方 — 記述例とコード
基本的な記述方法
canonicalタグは<head>セクション内に記述します。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ページタイトル</title>
<link rel="canonical" href="https://example.com/page/" />
</head>
<body>
<!– ページのコンテンツ –>
</body>
</html>
WordPressでの設定方法
|
方法 |
難易度 |
推奨度 |
特徴 |
|
Yoast SEOプラグイン |
★☆☆☆☆ |
★★★★★ |
管理画面から簡単に設定可能 |
|
All in One SEOプラグイン |
★☆☆☆☆ |
★★★★★ |
多機能なSEOプラグイン |
|
Rank Mathプラグイン |
★☆☆☆☆ |
★★★★☆ |
無料でも高機能 |
|
functions.phpに直接記述 |
★★★★☆ |
★★☆☆☆ |
プラグイン不要だが保守コスト高 |
|
テーマのheader.phpを編集 |
★★★☆☆ |
★★☆☆☆ |
テーマ更新時に上書きされるリスク |
Yoast SEOでの設定手順：
1. 各投稿・固定ページの編集画面を開きます
2. 「Yoast SEO」セクションの「詳細設定」タブを開きます
3. 「正規URL」フィールドに正規URLを入力します
4. 保存します
HTTPヘッダーでの指定方法
PDFなどHTML以外のコンテンツには、HTTPヘッダーでcanonicalを指定できます。
Link: <https://example.com/document.pdf>; rel="canonical"
サイトマップでのURL正規化
サイトマップ（sitemap.xml）に記載するURLも、canonicalタグで指定した正規URLと一致させます。
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://example.com/page/</loc>
<lastmod>2026-03-01</lastmod>
</url>
</urlset>
SEOの技術的な基礎をより体系的に学びたい方は → 第4章 テクニカルSEO入門
canonicalタグとnoindexの違い — 使い分けの判断基準
canonicalタグとnoindexメタタグは、どちらもインデックスを制御する手段ですが、用途が異なります。
比較表
|
比較項目 |
canonical |
noindex |
|
目的 |
正規URLを指定する |
インデックスから除外する |
|
リンク評価の転送 |
正規URLに集約される |
転送されない |
|
クロール |
引き続きクロールされる |
クロール頻度が低下する |
|
使用場面 |
類似コンテンツの正規化 |
不要ページの完全除外 |
|
実装方法 |
<link rel="canonical"> |
<meta name="robots" content="noindex"> |
使い分けの判断フロー
1. コンテンツが同一または非常に類似 → canonical
2. ページ自体をインデックスさせたくない → noindex
3. パラメータ違いで同じ商品が表示 → canonical
4. 検索結果ページや管理画面などの低品質ページ → noindex
5. A/Bテスト中のバリエーションページ → canonical
併用してはいけないケース
canonicalタグとnoindexを同じページに設定してはいけません。Googleに矛盾した指示を送ることになります。
<!– NG：矛盾した指示 –>
<meta name="robots" content="noindex">
<link rel="canonical" href="https://example.com/other-page/" />
canonicalタグの確認方法 — ツールを使ったチェック手順
ブラウザのデベロッパーツールで確認
最も手軽な確認方法は、デベロッパーツール（F12）です。
1. 確認したいページを開きます
2. F12キーでデベロッパーツールを開きます
3. 「Elements」タブで<head>内を確認します
4. Ctrl+Fで「canonical」を検索します
5. <link rel="canonical" href="…"> の記述を確認します
Google Search Consoleで確認
Search Consoleの「URL検査」ツールで、Googleが認識している正規URLを確認できます。
|
確認項目 |
確認方法 |
チェックポイント |
|
ユーザーが指定した正規URL |
URL検査 →「ページのインデックス登録」 |
自分が設定したcanonicalと一致するか |
|
Googleが選択した正規URL |
URL検査 →「ページのインデックス登録」 |
Googleの判断が意図通りか |
|
一致しているか |
両者を比較 |
不一致の場合は設定を見直す |
サードパーティツールでの確認
|
ツール |
用途 |
無料/有料 |
|
Screaming Frog SEO Spider |
サイト全体のcanonical一括チェック |
500URLまで無料 |
|
Ahrefs Site Audit |
canonical設定の問題を自動検出 |
有料 |
|
Sitebulb |
canonical設定の可視化レポート |
有料 |
|
Chrome拡張（SEO META in 1 CLICK） |
個別ページの簡易確認 |
無料 |
canonicalタグ設定時のよくあるミスと対処法
ミス一覧と対処法
|
ミス |
影響 |
対処法 |
|
相対URLで記述している |
正しく解釈されない可能性 |
絶対URL（https://〜）で記述する |
|
自己参照canonicalを設定していない |
正規URLが曖昧になる |
全ページに自己参照canonicalを設定 |
|
canonicalの向き先が404ページ |
canonicalが無視される |
存在するURLを指定する |
|
canonicalのチェーン（A→B→C） |
最終的な正規URLが不明確に |
直接最終的な正規URLを指定する |
|
noindexページへcanonicalを向けている |
矛盾した指示になる |
インデックス可能なページを指定する |
|
<body>内に記述している |
無視される |
<head>内に記述する |
自己参照canonicalの重要性
全ページに自己参照canonical（そのページ自身のURLを正規URLとして指定）を設定することが推奨されています。
<!– https://example.com/page/ に設置 –>
<link rel="canonical" href="https://example.com/page/" />
なぜなら、パラメータ付きURLなどで意図しない重複が発生しても、自己参照canonicalがあれば正規URLが明確になるからです。
canonicalはヒント（hint）であり指示（directive）ではない
canonicalタグはGoogleに対する「ヒント」であり、必ず従ってもらえるわけではありません。Googleはcanonical以外にも以下のシグナルを総合的に判断します。
・サイトマップに含まれているか
・内部リンクの向き先
・HTTPSかHTTPか
・リダイレクトの設定
・ページのコンテンツの質
【実践事例】scale-basics.comでのcanonical正規化
問題と対策
scale-basics.comでは、サイトリニューアル後に以下の問題が発生しました。
問題：
・パラメータ付きURL（?ref=、?utm_source=等）がインデックスに大量登録
・wwwあり/なしの統一が不完全
・Search Consoleで「重複するページ」警告が78件
対策：
|
施策 |
内容 |
対応工数 |
|
自己参照canonical全ページ設置 |
全ページに自己参照canonicalタグを追加 |
約2日 |
|
wwwリダイレクト設定 |
.htaccessでwwwなしに301リダイレクト |
約1時間 |
|
パラメータ処理 |
パラメータ付きURLからパラメータなしへcanonical設定 |
約1日 |
|
サイトマップ整備 |
正規URLのみをsitemap.xmlに掲載 |
約半日 |
成果（2ヶ月後）：
|
指標 |
施策前 |
施策後 |
変化 |
|
重複ページ警告数 |
78件 |
3件 |
-96% |
|
インデックス登録ページ数 |
342ページ（重複含む） |
198ページ（正規のみ） |
正規化完了 |
|
平均掲載順位 |
28.4位 |
22.1位 |
+6.3位改善 |
|
クロール頻度 |
1日約120回 |
1日約85回 |
効率化 |
成功のポイント
1. Search Consoleの「URL検査」で1ページずつ正規URLを確認 — 機械的な設定ではなく、Googleの認識を確認しながら進めました
2. canonicalとリダイレクトを併用 — 二重の対策で確実性を高めました
3. サイトマップとの整合性を確保 — canonical指定した正規URLをサイトマップにも正確に反映しました
canonicalに関するよくある質問
Q. canonicalタグは全ページに設定すべき？
A. はい、全ページに自己参照canonicalを設定することを推奨します。パラメータ付きURLによる意図しない重複が発生しても、正規URLが明確になります。
Q. canonicalタグとリダイレクトはどう違う？
A. 以下の違いがあります。
|
項目 |
canonical |
301リダイレクト |
|
ユーザーの遷移 |
元のURLに留まる |
正規URLに転送される |
|
複数URLへのアクセス |
可能（両方アクセスできる） |
不可（リダイレクトされる） |
|
実装場所 |
HTML内 |
サーバー設定 |
|
効力 |
ヒント（無視される場合あり） |
強制的 |
Q. canonicalタグは別ドメインのURLを指定できる？
A. はい、クロスドメインcanonicalも可能です。シンジケーション（コンテンツ転載許可）の場合に利用します。ただし、Googleは「ヒント」として扱うため、意図通りにならない場合もあります。
Q. hreflangタグとcanonicalタグの関係は？
A. 多言語サイトでは、各言語版のページに自己参照canonicalを設定し、同時にhreflangタグで各言語版URLを相互参照させるのが正しい実装です。
Q. JavaScriptで生成されたcanonicalタグは有効？
A. GoogleはJavaScript生成のcanonicalタグも認識すると公式に表明しています。ただし、SSRで出力する方が確実です。なぜなら、JavaScript実行エラーでcanonicalが出力されないリスクを回避できるからです。
まとめ — canonicalタグは正しいURL正規化でSEOの基盤を守る
canonicalタグは、重複コンテンツによるSEOリスクを防ぎ、検索エンジンの評価を正規URLに集約する重要なHTML要素です。
・canonicalタグは検索エンジンに正規URLを伝えるためのヒントタグです
・重複コンテンツを放置するとPageRank分散・クロールバジェット浪費・順位低下のリスクがあります
・www有無、http/https、パラメータ付きURL、末尾スラッシュなどのケースで設定が必要です
・noindexとは用途が異なるため、正しく使い分けましょう
・全ページに自己参照canonicalを設定し、サイトマップとの整合性を保つのがベストプラクティスです
・canonicalは「ヒント」であり、301リダイレクトなど他の施策との併用が重要です
参考リンク：
・Google 検索セントラル — 正規 URL についてのドキュメント
・Google 検索セントラル — 重複した URL を統合する