50代のWeb担当ウェブ太です!
canonicalタグって何?どう利用すればいいの?
という人はわたしと一緒にこの記事で学んで行きましょう!
- canonicalタグの意味とは?
- canonicalタグの記述方法
- canonicalタグの使い方
端的にお伝えすると、canonicalタグはWebページの記述方法の一つで、検索エンジンに「正しいWebページはこちらです!」とアピール(宣言)するものです。
検索エンジンに正しくアピールする記述方法とはどのようなものか?さっそくみていきましょう!
読みたい所へジャンプ
canonicalタグの意味とは?

canonicalタグとはなんぞや?を知る前に、検索エンジンの性格を知っておきましょう。
検索エンジンは重複コンテンツが嫌い?
前提として検索エンジンはWebページのコピー(偽・真似)コンテンツが大嫌いです。
そのような偽物のコンテンツに対しては厳しい態度で、検索エンジンはその評価を下げます。だってコピーコンテンツを検索エンジンが評価してしまったら、検索エンジン自身の評価を下げてしまうからです。
それでは同じサイト内の似ているコンテンツ(いわゆる類似・重複コンテンツ)はどうなのでしょうか?
Googleは上記の記事で重複ページがある場合は、ページの統合や正規化をしてくださいと言っています。
ウェブ太
SEOとしてのcanonicalタグの意味
canonicalをGoogle翻訳で確認すると下記の意味が出てきます。
英語:canonical = 日本語訳:正規の
参考サイト:Google翻訳
そのままなのですが「canonical」は「正規の」という意味です。
つまり意味合いとして、canonicalタグはWebページを正規化するためのHTMLタグとおぼえておきましょう。
canonicalタグの記述方法

canonicalタグの意味が理解できたら、次は記述方法、つまり書き方の作法です。
さきほど「Webページを正規化するためのHTMLタグ」と言いましたが、どこの部分に・どのように書けばいいのでしょうか?ここが肝心なポイントです。
canonicalタグの記述位置と記述様式
- 記述位置:headタグ
- 記述様式:<link rel=”canonical” href=”https://www.abc.com/aaa”/>
ウェブ太
実際にheadタグに挿入した記述イメージは下記のようになります。URLは適当なアドレスです。
<head>
<link rel=”canonical” href=”https://www.abc.com/aaa”/>
<head>
headタグというと、WordPressでブログ運用している方が思い浮かべる のは、titleタグやdescriptionタグではないでしょうか。
WordPressのCMSの仕組みで、意識せずともWebページに記述してくれている部分です。
ウェブ太
canonicalタグの記述方法
canonicalタグは重複した複数ページの、一つを正しいページとするものです。
たとえば下記の2つのURLのWebページ(正規化したいのと重複したコンテンツ)があるとします。
- 正規化したいURL:https://www.abc.com/aaa
- 重複/類似したURL:https://www.abc.com/bbb
上記②のサイトのheadタグに、①のURLを記載したcanonicalタグを記載します。
ウェブ太
担当者の間では「canonicalを向ける」なんて言ってますね。
「rel =」の「rel」の意味とは?
「rel」ってよく見る書き方ですが、そもそもの意味はなんなのでしょうか?。ググってみるとサルワカさんの記事がわかりやすかったです。
このタグを解読すると、以下のような意味になります。relでファイルとの関係性を、hrefで そのファイルがある場所(URL)を指定します。relは「relation(関係)」の略です。つまり「linkタグが書かれているページとhrefで指定しているページとの間で、どのような関係があるのか」をここで示すわけですね。
参考サイト:サルワカ
そこそこWeb担当やっていて、HTMLもある程度知っているつもりでしたが、relが「relation(関係)」の略だったとは・・・恥ずかしながら知りませんでした。
ウェブ太
次はさらに重要な使い方に言ってみましょう!どんな時に使うのというやつです。
canonicalタグの使い方・使い所

Webページを作成していると、どうしても重複してしまうページが出てきたりします。
- httpsとhttp、wwwありとwwwなしなどのコンテンツ
- 商品のバリエーションが複数あるコンテンツ
- スマホとPCのWebページのURLが違うコンテンツ
httpsとhttp、wwwありとwwwなしなどのURLアドレス
ここは意外と盲点です。お客様の中にはURLがわからずに「https」なのに「http」で検索したりすると下記のエラー画面になって遷移できません。
- Bad Request – Invalid Hostname
- HTTP Error 400. The request hostname is invalid.
これはいわゆるHTTPエラーの400で、リクエストしたホスト名が無効というエラーです。
ウェブ太
このような事がないようにするのが、canonicalタグなんですね。
商品のバリエーションが複数ある類似コンテンツ
ECサイトなどの通販系での商品ページに良くあるタイプです。
サイズや容量、カラーバリエーション(カラバリ)の違いで、内容に大きな差がないため類似ページとみなされてしまいます。
このような場合にはメインの商品ページURLにcanonicalタグを向けましょう。
スマホとPCのWebページのURLが違うコンテンツ
規模の大きいサイトに良くあります。スマホとパソコンのサイトURLが違い、サイト構造も違います。
レスポンシブなサイトは同じHTMLのソース内で、PCとスマートフォンでの見え方を変えているのでURLは同じです。
PCとスマートフォンのサイトURLどちらにcanonicalタグを向けるかは、PCの方の正規URLになります。
canonicalタグ以外の対策方法
またその他にも対策方法があるのでリストアップしておきます。
- 301リダイレクト
- .htaccessでの修正
この手法は難易度が少し高いです。次の機会にお伝えしていきます!
まとめ:canonicalタグでページを正規化

canonicalタグは重複したページの評価を下げないために、検索エンジンに正規化したURLをアピールするタグです。
canonicalタグの用法を守って、検索エンジンと良好な関係を築きましょう!