URLのリダイレクト方法 ─ SSL化後やAMP停止後にやること

リダイレクト SSL化後、AMP停止後にやること

WEBサイトを運営していると、必ず出てくるURLのリダイレクト(転送)などのURL正規化問題。そんなの自分には関係ないと思っている人もいるかもしれない。しかしこれがSEOにも大きく関わってくるとなれば、無視できなくなるだろう。それらの方法を出来るだけ簡潔に説明する。

URLのリダイレクト(転送)は何故必要なのか

今あなたが見ているこのWEBサイトの正規URLは、https://bluetraff.comである。
これはGoogleの検索エンジンのデータベースにインデックス(Index=登録)されているから、「bluetraff design」「ブルー・トラフデザイン」、またはこの記事のタイトル「URLリダイレクトの方法」という単語で検索すると表示されるのである。
そしてGoogleは、https://bluetraff.comの他に、https://bluetraff.comhttp://www.bluetraff.comhttps://www.bluetraff.comとhttpsの「s(SSL化)」の有り無し、または「www」の有り無しによって、全く別のWEBサイトと認識してインデックスする。要するに内容は全く同じであるにもかかわらず、4つの別のWEBサイトがあるように認識してしまうのだ。
現在はSSL化されていないhttpのWEBサイトを閲覧しようとすると、赤い警告のメッセージが表示されて、有害である可能性があるのでhttpのサイトを出来るだけアクセスしないようにさせる。https://bluetraff.comと「s」の無いURLをブラウザーに入力しWEBサイトにアクセスしようとした人は、警告が表示され「危険そうだから見るのを止めよう」ということになる。これはSEO的に大きな機会損失だ。
そのような機会損失を最小限に食い止めるための手段が、URLのリダイレクト(Redirect=転送)でのURLを正規化するということになる。

4つの別WEBサイトを1つにまとめるためにリダイレクトする
4つの別WEBサイトを1つにまとめるためにリダイレクトする

またGoogleによる評価をリダイレクト元からリダイレクト先へ受け継ぐことができる。

リダイレクト元の評価はリダイレクト先のWEBサイトに引き継がれる
リダイレクト元のGoogle評価はリダイレクト先のWEBサイトに引き継がれる

URLのリダイレクト(URL転送)の設定

具体的にURLのリダイレクトが必要な場面は、先述したようにhttpをSSL化してhttpsにした時、www有りwww無しのどちらかに統一したい時など、普通にWEBサイトを運営していても発生する。
ではどのようにしてURLのリダイレクトを設定するのか。いくつか方法があり、WEBサイトの環境にもよる。

  1. レンタルサーバーのコントロールパネルで設定
  2. .htaccessによる設定
  3. WordPressを利用している場合は、テーマまたはプラグインで設定

すべてのリダイレクト方法を解説すると煩雑になるので、特に必要なものだけを説明する。
ちなみにリダイレクトには301リダイレクト302リダイレクトがあり、301が設定を解除しない限り続く恒久的なものに対し、302の方は一時的なリダイレクトとなる。302の方は今回必要ないので、以下すべて301リダイレクトの記述となる。301や302というのはGoogle検索によるステータスのことだ。

URLのwww有りと無しを統一する

www有りから無しへリダレクト

これはうちで利用しているコントロールパネルで設定できた。
https://www.bluetraff.comにアクセスしてきたら、https://bluetraff.comにリダイレクト(転送)させる。今あなたが使用しているブラウザーにhttps://www.bluetraff.comと入力してみて欲しい。即座にURLがhttps://bluetraff.comに変わるはずだ。
ちなみにwww有りと無し、どちらでもSEO的な効果は変わらない。好きな方を選べば良い。

もしあなたが利用しているレンタルサーバーのコントロールパネルにこの機能がない場合は、 .htaccessによる設定で行う。.htaccessには以下の記述をする。

RewriteEngine on
RewriteCond %{HTTP_HOST} ^www\bluetraff\.com$
RewriteRule ^(.*)$ https://bluetraff.com/$1 [R=301,L]

SSL化後、httpをhttpsにリダイレクト

httpからhttpsへリダイレクト
httpからhttpsへリダイレクト

以前と異なり高額なコストをかけなくても無料でSSL化が可能になり、多くのWEBサイト運営者はすでにSSL化(httpからhttps)を完了していることだろう。s無しのhttpでアクセスすると警告が表示され、嫌な気分になった人もいるはずだ。しかしSSL化したらそのままで、リダイレクト設定まではしていない人が多い。

この場合、 .htaccessによる設定でURLをリダイレクトさせる。例えばhttps://bluetraff.comhttps://bluetraff.comへ転送させる。.htaccessの基本は後述するとして、httphttpsにリダイレクトするには、.htaccessに以下のコードを記述する。

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

AMP専用ページのURLを通常ページのURLへリダイレクトさせる

AMP専用ページを通常ページにリダレクト
AMP専用ページを通常ページにリダレクト

今あなたが見ているサイトhttps://bluetraff.comは、WordPressテーマとしてCOCOONを使用している。COCOONはサイトをAMP化するのに非常に優れたテーマで、COCOONの設定内にあるチェック一つでAMP化が完了する。しかし私が細かくカスタマイズしすぎたせいで、Google Search Consoleからサイトの不具合に関する警告が連発してかなり手こずった。また去年からGoogleは、AMP化しているWEBサイトを検索上有利に扱うことを止めた。結果AMP化している意味がなくなったので、このサイト自体もAMPを止めたわけである。止めるのは簡単で、始める時と逆。つまりCOCOON設定内のチェックを外すだけで完了。
COCOONの場合、AMPは通常のページと別にAMP独自のURLが与えられる。例えば、
通常のURLが https://bluetraff.com/urlredirect であるなら、
AMPページには https://bluetraff.com/urlredirect/?amp=1 というように/?amp=1 が付く。

しかしAMPを止めたので、https://bluetraff.com/urlredirect/?amp=1はもはや存在しない。だがしばらくはGoogleにhttps://bluetraff.com/urlredirect/?amp=1 はインデックスされたままになっている。これを統一させるために https://bluetraff.com/urlredirect/?amp=1にアクセスがあった場合、https://bluetraff.com/urlredirectへリダイレクトせなければならない。

WordPressのプラグインRedirectionでの設定は出来ないので、これも既にWordPress内にある.htaccessに追加する。
/?amp=1 から / へリダイレクトするには、以下のコードを記述する。

RewriteEngine On
RewriteCond %{QUERY_STRING} (^|&)amp=1(&|$)
RewriteRule ^(.*)$ https://yourdomain.com%{REQUEST_URI}? [R=301,L]

赤文字(https://yourdomain.com)部分には設定したいドメインを記入する。
ちなみに私の場合はこのコードの前後に、
<IfModule mod_rewrite.c></IfModule>を入れている。もしリダイレクトされない場合はこれも試してみると良いだろう。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{QUERY_STRING} (^|&)amp=1(&|$)
RewriteRule ^(.*)$ https://yourdomain.com%{REQUEST_URI}? [R=301,L]
</IfModule>

/?amp=1 ではなく /amp/ と付くAMP化サイトが一般的なようだが、そのリダイレクト方法は、煩雑になるのでここでは省略する。/amp/のリダイレクト方法は検索すればすぐに見つかるのだが、/?amp=1のリダイレクト方法はなかなか見つからないのでかなり苦労した。

ページごとのリダイレクト

別のURLページへリダイレクト
別のURLページへリダイレクト

WordPressでWEBサイトを構築しているのなら、Redirectionプラグインを使えば.htaccessに記述しなくても簡単にリダイレクト設定ができるのでお勧め。設定をした後もリダイレクトのチェックをする機能もあるので非常に便利である。WordPress必須プラグインの一つだろう。

一般的なHTMLで作られたサイトのページごとのリダイレクト設定は、.htaccessに記述する。

RewriteEngine on
RewriteRule ^aaa.html$ /bbb.html [R=301,L]

この場合は、aaa.htmlからbbb.htmlへリダイレクトさせる設定。

トップページindex.htmlのリダイレクト

/index.htmlから「無し」にリダイレクト
/index.htmlから「無し」にリダイレクト

通常サーバーにindex.htmlをアップすると、そのページがトップページ(ホームページ)と認識される。https://bluetraff.comにアクセスすると表示されるのはhttps://bluetraff.com/index.htmlである。これをGoogleは、https://bluetraff.comhttps://bluetraff.com/index.htmlの内容は同じだが別のページだと認識して、そのままではインデックスできないと警告される。よってこれもリダイレクトさせる。
ちなみにWordPressの場合、元からindex.htmlは存在しないので、このリダイレクト設定は必要ない。

RewriteEngine on
RewriteCond %{THE_REQUEST} ^.*/index.html
RewriteRule ^(.*)index.html$ https://yourdomain.com/$1 [L,R=301] 

この場合は、https://yourdomain.com/index.htmlにアクセスがあった場合に、https://yourdomain.comへリダイレクトする。

設定後のリダイレクト・チェック

.htaccessファイルをサーバーにアップした後やRedirectionプラグインで設定を終えた後に、実際にリダイレクトされているかをチェックできるサービスを利用して検査してみる。
例として、リダイレクトチェッカー https://abashi.net/redirect-checker でチェックする。

ステータスとURLをチェックする
ステータスとURLをチェックする

上図のようにステータスが301→200になり、意図した通りにURLがリダイレクトされていればOK。

ステータスとURLに変化はない
ステータスとURLに変化はない

ステータスが200のままならリダイレクトされずに、元のページがそのまま表示されている。

ステータスが500の場合は、エラーでページが表示されていない。

.htaccess記述の基本(重要)

.htaccess(ドット・エイチ・ティー・アクセス)を書くには、コーディングに使うVisual Studio Codeのようなコードエディターであれば、何も気にせずに書けるので一番良いのだが、それ以外であればTeraPadのような文字コードの変換ができるテキストエディターを使いたい。なぜなら.htaccessに記述するには以下のような条件があるからだ。

  • 文字コードはUTF-8(BOM無し)で保存 ── TeraPadの場合はUTF-8(F)。ただのUTF-8ではダメ
  • 改行コードはLF
  • コードの最後に必ず空白行を1行以上入れる

.htaccessによるリダイレクトの方法は、検索すれば多くの記事が見つかるのだが、この基本中の基本の3つが書かれていない。実は私もこれに気が付かず、何度コードを見直しても間違いはないのに、500サーバーエラーが頻発して3日費やしてしまったことがある。

Visual Studio Codeで書いた実際の.htaccess

.htaccessを書いたら、適用したいファイルと同じディレクトリにFTPクライアントなどを使い、アップロードすればよい。index.htmlに適用させたければindex.htmlと同じ階層に.htaccessファイルを置く。

canonical─もうひとつのURL正規化方法

URL正規化にはここまで説明したリダイレクトの他に、canonical(カノニカル)という方法がある。これについては上述した以外の、検索結果に付くパラメータ付きURLや、PC版とモバイル版でURLが異なる場合などに使う。やや特殊なので今回は省略する。

10年つかえるSEOの基本
「どうすれば、検索されたときにサイトを上位に表示することができるか」 そんなふうに考えているとかえってうまくいかなかったりすること、ご存知ですか? 本書は、すぐに効かなくなってしまうようなテクニックではなく、 「検索エンジンは、どんなことをしようとしているの?」 「SEOって、なんのためのもの?」 といった変わらない“...
タイトルとURLをコピーしました