WebページのURLが変わったら、古いURLのWebサーバーにリダイレクトを設定し、新しいURLに誘導しなければなりません。このリダイレクトをHTMLに設定する方法は幾つかありますが、その中からよく使われる代表的な設定方法について解説します。
HTMLとリダイレクトの関係とは
Webサーバーを新しくしたとしても、そのURLが同じならばDNSに登録されたサーバーのIPアドレスを変更するだけ済みます。しかし、Webサーバーを新しくしたのと同時にURLも変更した場合、DNSの設定だけでは不十分です。古いサーバーにアクセスしてしまう方を新しいWebサーバーに誘導するリダイレクトの設定が必要です。次からHTMLとリダイレクトの関係について解説します。
Webページを引っ越ししたら古いWebサーバーはどうする
URLを変更すると、新しいURLが検索の上位にくるまでに時間がかかり、またブックマークされたURLからのアクセスが残るせいで、古いWebサーバーがアクセスされます。そのため、古いWebサーバーをしばらくの間、稼働させたままにしておかなければなりません。
この場合、古いWebサーバーに、引っ越ししたというメッセージと新しいWebサーバーへのリンクを書いたHTMLファイルを準備すれば、利用者が新しいURLを訪れるとは限りません。訪れた人が面倒だと感じてしまうと、アクセスが減ってしまいます。
そこで、古いWebサーバーにアクセスしたら、自動的に新しいWebサーバーに誘導する仕組み、リダイレクトの設定が必要となります。
手続きしないと検索されなくなる
では、URLを引っ越しした後、古いWebサーバーを停止すればどうなるでしょうか。当然、検索サイト経由で新しいURLをクリックする人がいないことで、新しいURLが検索の上位に表示されることはありません。そして、古いURLへのアクセスが失敗することで検索順位が下がってしまいます。
こうして、新しいURLも古いURLも検索でヒットしない、という事態が発生します。これは、避けなければなりません。そのため、もしURLを変更したら、新しいURLへのリダイレクトの設定が必要です。HTMLを扱うエンジニアなら、ぜひ、リダイレクトの仕組みを理解しましょう。
リダイレクトを設定するには
リダイレクトとは、あるURLのWebサーバーにアクセスした場合、HTMLなどに新しいURLを参照させる設定を書いておくことで、利用者に自動的に新しいURLのWebサーバーにアクセスさせるテクニックです。
リダイレクトを実現する方法は幾つかあり、最も簡単な方法は、htaccessファイルにリダイレクト先のURLを書いておく方法です。他にも、メタタグに埋め込む方法や、JavaScriptで新しいURLのWebページを開く方法、サーバー側で動作するPHPなどでアクセス先を切り替える方法なども使われます。
リダイレクトの設定方法
次から、リダイレクトによって別のWebページに切り替えさせる設定方法を紹介します。
htaccessに記述する
リダイレクトの設定として以前からよく使われているやり方が、htaccessファイルを使う方法です。この方法は、レンタルサーバーのような書き換えできるファイルに制限のある環境でも使えるので、個人で作っているWebページの引っ越しなどにも使われます。
なお、htaccessファイルとは、Webサーバーでよく使われるapache httpサーバーのディレクトリ毎にアクセス制御などを設定するファイルです。具体的にはレンタルサーバーで、ftpでアクセスできる最上位のディレクトリ「.htaccess」というファイルを用意します。そして、このファイルに新しいWebサーバーのURLを設定しておくことで、ディレクトリの中だけという制限はありますが、管理者権限がなくてもWebサーバーにリダイレクトさせることが可能です。
そして、htaccessファイルを使ってリダイレクトを設定するには、RewriteRuleでURLの書き換えを定義します。
htaccessファイルを使ったリダイレクトの設定
RewriteRule ^(書き換え元のURL)$ (書き換え先のURL) [L,R=301]
なお、htaccessファイルでRewriteRuleを使うためには、「RewriteEngine on」もこのファイルで設定してください。
htaccessファイルを使ったリダイレクトの設定例
RewriteEngine on RewriteRule ^old.html$ https://www.example.com/new.html [L,R=301]
この例では、old.htmlにアクセスがあった場合、別のWebサーバーのURL「https://www.example.com/new.html」にリダイレクトさせます。
HTMLファイルのmetaタグに書く
metaタグのmetaとは、「META-information」の略で、このHTMLファイルを読み込んだWebブラウザや検索ロボットなどに、このWebページに関する情報を伝える役割があります。また、metaタグは、HTMLのheadタグに囲まれた部分に記述されます。
このようなmetaタグに「http-equiv=”refresh”」と記述することで、Webブラウザに指定されたURLへのリダイレクトを指示できます。なお、この方法でリダイレクトする場合、切り替えまでの時間を秒単位で指定することが可能です。そして、この機能を使い「本サイトは移転しました。5秒後にジャンプします」と表示させ、5秒後に新しいURLにジャンプさせることが可能です。
metaタグを使ったリダイレクトの例
<meta http-equiv="refresh" content="5;URL='https://www.example.com/'" />
この例では、5秒後に「https://www.example.com/」にリダイレクトします。
JavaScriptで実現する
JavaScriptは、Webブラウザで動作するプログラミング言語であり、HTML内に記述することで、そのHTMLがWebブラウザに読み込まれた際に、自動で何かの処理を実行させるために使われます。そして、JavaScriptには、指定された別のWebページを開く機能が用意されています。この別のWebページを開く機能を今のページが開いた直後に実行することで、リダイレクトを実現できます。
リダイレクトするJavaScriptの例
<script type="text/javascript"> document.location.href = "https://www.example.com/"; </script>
上記のJavaScriptをheadタグの中に書くことで、https://www.example.com/にリダイレクトされます。
PHPなどでアクセス先を切り替える方法
WebブラウザがWebサーバーにアクセスした際に受け取るデータは、HTMLファイルだけではありません。HTMLファイルを送信する前に、必ずヘッダ情報が送信されます。そして、そのヘッダ情報にリダイレクト先への切り替え指示を含めることで、Webブラウザにリダイレクト先のページに開かせることが可能です。
サーバー側でプログラムを実行する方法は幾つかありますが、phpではheader()という関数を使うことで、ヘッダ情報を指定できます。
phpでリダイレクトを設定する例
<?php
header('Location: h"https://www.example.com/');
exit;
?>
どの方法を利用すればいいのか
HTMLのリダイレクトの4つの方法を紹介しましたが、どれを使っても同じ、というものではありません。それぞれの方法が使えないケースもあります。
まず、htaccessは、Webサーバーが対応していなければ利用できません。また、phpによる方法も、レンタルサーバーなどでphpが使えなければ利用できません。一方、metaタグやJavaScriptは、Webブラウザが初期設定のままなら有効ですが、セキュリティを厳しく設定した場合は利用できません。そのように設定されたパソコンからは、リダイレクトされないケースもあります。
そのため、利用するWebサーバーや利用者が使うWebブラウザなどを検討し、最適なリダイレクト方法を利用してください。
まとめ
URLを変更した場合、古いURLのサーバーにリダイレクトを設定し、自動的に新しいサーバーに切り替わるように設定するのが一般的です。とはいえ、その設定方法は複数あり、それぞれメリットとデメリットがあります。それらをしっかり理解して、最適な方法を選択してください。
