リダイレクトの設定方法は難しい？種類別で設定方法を徹底解説！

リダイレクトは、Webサイトを運営していく上で必ず知っておいた方が良い仕組みです。

リダイレクトについては何となく理解しているという方でも、実際設定するとなると様々な種類や設定方法があって難しそう…と感じてしまうかもしれません。

また、リダイレクトは頻繁に行うことでもないため、設定方法によってどんな違いがあったか忘れてしまったという方にも是非確認していただきたい内容です。

今回は、そんなリダイレクトの種類ごとに設定方法や確認方法をまとめていきたいと思います。

▶SEOコンサルティングならここに任せて！おすすめの会社厳選20選！

リダイレクトとは？

リダイレクトは一言で言うと、Webサイトやページへ訪れたユーザーを別のWebサイトやページに転送するための仕組みのことです。

一般的には、サイトURLの変更やメンテナンスを行う際など、何らかの都合で他のページへ転送する必要がある場合にユーザーを正しいページまで導くために使用されます。

リダイレクトの設定をしないままURLを新しいものに換えてしまうと、変更前のURLを訪れたユーザーがアクセスできなくなってしまったり、SEOにおいて悪影響を及ぼす可能性があります。

そのため、ドメインやURLを変更したときにはリダイレクトをすることをおすすめします。

リダイレクトの設定方法とは？

リダイレクトの設定方法は大きく分けて4つあり、使用しているサーバーやWebサイトの構成によって使い分ける必要があります。

それぞれのメリット・デメリットを挙げながら詳しい設定方法を解説していきます。

設定方法の例にあるコードはすべて301リダイレクトで記述していますが、302リダイレクトをさせたい場合は、最後の数値を「302」に変更してください。

301, 302リダイレクトについてはこちらの記事もご覧ください。

▶SEOにも影響する？リダイレクトの種類や設定方法を解説！

.htaccessでの設定方法

.htaccessファイルによるリダイレクトは、最も推奨されているサーバー側で行われるリダイレクト方法の1つです。

・WebサーバーソフトがApacheであること
・.htaccessが利用可能な権限や設定がサーバーホスティング業者から付与されていること
・ファイル編集のためにFTPやSSHなどでサーバーにアクセスできること

上記の条件を満たしているのであれば、.htaccessでの設定が可能です。

設定方法

①テキストエディタで、適当な名前でテキストファイルを作成する

②リダイレクト内容に合わせて以下を記述する

〈old.htmlからnew.htmlへリダイレクト〉
■ページ単位

RewriteEngine on
RewriteRule ^old.html$ http://www.sample.com/new.html [R=301,L]

■ディレクトリ単位

RewriteEngine on
RewriteRule ^old(.*)$ /new$1 [R=301,L]


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

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


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

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


〈wwwなしからwwwありへリダイレクト〉

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


〈旧ドメインから新ドメインへリダイレクト〉

Redirect permanent / http://sample.com/


③記述が完了したら、ファイル名を「.htaccess」(拡張子なし)に変更して保存しサーバーにアップロードで設定完了
(※拡張子なしで保存できなかった場合は、サーバーにアップロード後、名前を変更してください)

PHPでの設定方法

PHPによるリダイレクトは、header関数を利用したサーバー側で行われるリダイレクト方法になります。

設定方法

①該当するPHPファイルの先頭に以下を記述する

〈sample.comからsample.com/testへリダイレクト〉

<?php
header('Location: https:/sample.com/test/');
exit;


②保存して設定完了

JavaScriptでの設定方法

JavaScriptによるリダイレクトは、HTMLファイルのhead内に記述するリダイレクト方法です。

.htaccessやPHPによるリダイレクト(サーバーサイドリダイレクト)とは異なり、ブラウザ上で動くクライアントサイドリダイレクトと呼ばれるものになります。

使用しているサーバーがサーバーサイドリダイレクトできないときの代替として使用されることが多いです。

設定方法

①該当するHTMLファイルのhead内に以下を記述する

〈old.htmlからnew.htmlへリダイレクト〉

<script type="text/javascript">
setTimeout("link()", 0);
function link(){
location.href='https://sample.com/';
}
</script>


②保存して設定完了

meta refreshでの設定方法

meta refreshによるリダイレクトは、HTMLファイルのhead内に記述するリダイレクト方法です。

JavaScriptでのリダイレクト同様、クライアントサイドリダイレクトになります。

こちらは、Googleから非推奨とされている方法で、サーバーサイドリダイレクトやJavaScriptによるリダイレクトができなかった時の最終手段と言えます。

設定方法

①該当するHTMLファイルのhead内に以下を記述する

〈old.htmlからnew.htmlへリダイレクト〉

<meta http-equiv="refresh" content="0;URL=移転先URL">


※contentの数値で転送までの時間を設定可能(0なら即時リダイレクト)

②保存して設定完了

リダイレクトの確認方法は？

最後に、リダイレクトが正常に設置できているか確認する2つの方法をご紹介いたします。

リダイレクトが正しく設定できていないとSEOにも影響が生じる可能性があるので、しっかりと確認も行いましょう。

確認方法には、
1．ブラウザを使った確認方法
2．専用ツールを使った確認方法
この2つがあります。

まず、ブラウザを使った確認方法は、以下で簡単に行えます。
①Google Chromeの「デベロッパーツール」を起動して「Network」を選択
②「Preserve log」にチェックし、リダイレクト確認を行いたい転送元のURLにアクセス
③「Name」で転送先のURLを選択し、右側「Headers」の「Status Code」で301(または302)の状態を確認できる

また、Google Chromeの拡張機能を使って確認することもできます。
①「Redirect Path」という拡張機能をインストール
②追加できたら、Google Chromeの検索欄にリダイレクト確認を行いたいURLを入力してアクセスする
③右上にある先ほど追加した拡張機能で、301(または302)の状態を確認できる

次に、専用ツールを使った確認方法は、以下になります。
・リダイレクトチェッカー
・リダイレクトチェックツール
・httpstatus
・リダイレクト&ステータスコードチェックツール

中でも「httpstatus」と「リダイレクト&ステータスコードチェックツール」はリダイレクト確認を行いたいURLが複数ある場合に一括で確認できたり、ステータスコードやベーシック認証を確認できる機能も備わっているので、効率良くやりたい方におすすめです。

ただし、「JavaScript」や「meta refresh」のクライアントサイドリダイレクトの場合は、テストツールでのリダイレクト確認が出来ない可能性があります。

これは、Webページを開いた後にブラウザがリダイレクトを行うようになっていること、クライアントサイドリダイレクトを無効にしているブラウザの場合に適用されないことがあることが理由です。

リダイレクト方法について｜まとめ

今回はリダイレクトの種類別に詳しい設定方法を解説してまいりました。

リダイレクトには「301リダイレクト」と「302リダイレクト」、設定方法には「サーバーサイドリダイレクト」と「クライアントサイドリダイレクト」がありました。

リダイレクト方法には様々な種類があり、一見難しそう、面倒と思ってしまいがちですが、Webサイトやページの評価やユーザビリティの観点からも非常に重要な仕組みですので、もし、不安な場合はテストページを作成してリダイレクトを行ってみるのも良いかもしれません。

リダイレクトを行いたいWebサイトやページがリダイレクト方法の条件に一致していれば、あとは数行記述するだけですので、ぜひWebサイト運営の際には参考にしていただけますと幸いです。