レンちゃんとペンタ

canonicalタグとは？意味や書き方、SEO効果と確認方法について

canonicalタグとは？意味や書き方、SEO効果と確認方法について

Webサイトやブログ内で重複したURLをスッキリ正規化するのが、canonoicalタグの役割です。
うまく機能すると、検索エンジンからのページ評価がアップする可能性があります。

この記事で分かること

  • canonoicalタグの書き方
  • URLの正規化とは
  • canonicalタグでURLの正規化を行う目的

    Webデザインとブログで豊かに引きこもる。

    レンちゃんとペンタ

    Webデザインは器。ブログは中身。
    「レンちゃんとペンタ」では、2つのスキルを掛け合わせて、
    おウチで豊かに楽しく暮らす方法をご紹介しています。

    canonicalタグとは

    例えば、Webサイトでは、各種設定やサーバー環境によって、同じページなのにいろいろなURLが存在してしまっているケースがあります。

    <!-- 以下3つとも、同じページを指している場合がある -->

1.https://sample.com/
2.https://www.sample.com/
3.https://www.sample.com/index.html

    また、サイトの設計事情により1つのページに複数URLが存在してしまう場合もあるかもしれません。

    <!-- 2つとも同じページを指している -->

・商品一覧のトップとしてのURL
https://sample.com/products/

・商品一覧の1ページ目としてのURL
https://sample.com/products?page=1

    canonicalタグを使うと、このように重複したURLのうちの一つを正規のURLとして定義する事ができます。
    これをURLの正規化と言います。

    canonicalタグでURLの正規化を行う目的

    URLの正規化をcanonicalタグで行うメリットは、SEO周りにあります。

    検索エンジンからのページ評価を統合する

    重複したURLは、それぞれが別の存在として検索エンジンに認識されます。
    結果、ページビューやユーザー数などのデータがそれぞれのURLに紐づけられてカウントされてしまいます。

    URLの正規化を行っておけば、そうした個々のデータを1つのURLのデータとして統合することができるので、ページの評価を大きく上げられる可能性があります。

    被リンクもモレなく集約

    統合されるデータの対象には、被リンク（外部サイトからそのページへ貼られたリンク）も入ります。
    他のサイトからどれだけリンクされているかもページ評価の重要な要素なのですが、様々なサイトからバラバラのURL表記でリンクが貼られていると、やはりその効果が分散されてしまいます。

    URLが正規化されていれば、相手サイト側のURL表記ブレに関わらず、正規化されたURLに対して貼られたリンクとして評価してもらうことができます。

    canonicalタグの書き方

    前置きが長くなりましたが、canonicalタグの記述はとてもカンタンです。
    該当ページのhead内に以下のタグを記述するだけで、URLの正規化が完了します。

    <!-- https://sample.com/ に正規化したい場合 -->
<link rel="canonical" href="https://sample.com/" />

    canonicalタグの確認

    設定したcanonicalタグが正しく機能しているか確認したい時には、Googleサーチコンソールを使うと便利です。
    サーチコンソールは、サイト運営全般に役立つGoogleの無料サービスです。
    未登録の場合はぜひこの機会に使ってみてください。

    URL検査を行う

    確認方法は以下の通り。
    まずはサーチコンソールのヘッダーに調べたいURLを入力します。

    サーチコンソールのヘッダー
    サーチコンソールのヘッダーにURLを入力

    カバレッジ欄を確認

    URL検査の画面に移動するので、「ユーザーが指定した正規URL」を確認します。
    正規化したいURLが入っていればOKです。

    サーチコンソールのカバレッジ
    URLの正規化、できてます

    おまけで正規化URL「じゃない方」である「https://renandpenta.com/」も調べてみます。

    サーチコンソールで正規化URLでない方を検索
    正規化URLじゃない方も検索してみます

    こちらも「ユーザーが指定した正規URL」に正しいURLが入ってますね。

    canonicalタグと301リダイレクトの使い分け

    canonicalタグを使ってもURLが無効になるわけではない

    canonicalタグは、データ上でのURLの取扱いを整理するものなので、例えばユーザーが「https://www.sample.com/」へアクセスしたら「https://sample.com/」へ遷移するという事ではありません。
    こうした切り替えを行いたい時には301リダイレクトを使います。

    canonicalタグと301リダイレクトの違い

    301リダイレクトはcanonicalタグとよく比較されますが、以下のような違いがあります。

    301リダイレクトの効果
    URLを根本的に変更する

    設定方法
    サーバー内の.htaccessファイル内に必要な設定内容を記述

    用途の例
    ・サイト全体の移動
    例：「https://sample-a.com/」→「https://sample-b.com/」

    ・ページのURL変更
    例：「https://sample.com/shop/」→「https://sample.com/access/」

    ・表示URLを1つにする
    例：「https://www.sample.com/」や「https://www.sample.com/index.html」にアクセスしても「https://sample.com/」に飛ばす

    このサイトで行ったこと

    あまりよろしくないコトですが、このサイトはドメインを取得後、取り急ぎのWordPressをセットしてからしばらく放置状態でした。
    その間になぜか「http://renandpenta.com」がインデックスされてしまったので、以下のようなチューニングを行いました

    1.「https://renandpenta.com」に正規化する
    2.「https://renandpenta.com」にリダイレクトする

    1はcanonicalタグ、2は301リダイレクトで対応しました。

    ページのテーマとは外れますが、おまけで2の方法も紹介しておきます。
    WordPressをインストールすると、このような.htaccessが生成されますが、

    <IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

    このようにちょい足し追記するだけで「http://」→「https://」にリダイレクトされます。

    <IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

    まとめ

    • 重複したURLのうち、一つを代表として定義するのがURLの正規化
    • URLの正規化は、canonicalタグで行うことができる
    • URL正規化によって、ページ評価が上がる可能性も
    • 正規化されたURLは、Googleサーチコンソールでチェック可能
    • ページを根本的に移動する場合は、301リダイレクトを使う

    いずれも細かいトコロですが、Webサイトやブログを本格的に運用するならこのあたりも丁寧にメンテナンスしておきたいですね。

    1. Home
    2. canonicalタグとは？意味や書き方、SEO効果と確認方法について

    Related Posts