サクラサク

JavaScriptでリダイレクト(転送)を行う方法と注意点

2024年9月10日

ねぎお社長 (根岸雅之)

リダイレクトに関する疑問や不安を解消できる内容になってますので下記の動画も是非ご覧ください!



『SEO会社が作った、今さら聞けないリダイレクト設定完全ガイド』
リダイレクトの基本から応用を分かりやすく解説!
初心者から上級者まで実施できる内容を記載していますのでぜひご活用ください!
無料ダウンロードはこちら

リダイレクトとは

リダイレクトという言葉はリダイレクション(向きを変える)という意味で、Webページに訪れたユーザーを別のWebページに転送することを言います。
主にWebページが移転した時や、メンテナンスの時や一時的に封鎖したい場合など、Webページを転送するために使われます。
リダイレクトには大きく分けて3つの方法があります。

HTTPによるリダイレクト

HTTPによるリダイレクトは移転前のページ評価を移転後のページに最も確実に引き継ぐと言われているため、SEO上最もおすすめされているのがこの方法です。
こちらはサーバーを経由してリダイレクトを実行する方法で、一般的によく使われています。
ただし、サーバーの種類によっては実行できない可能性があります。

HTTPによるリダイレクトはサーバーのレスポンスコードに応じて301や302などに分けられます。

・301リダイレクト(恒久的な転送)
多くの方が利用するリダイレクト方法です。
恒久的な転送を目的として利用するので、家の引越しをして住所変更をしたようなイメージです。

・302リダイレクト(一時的な転送)
301リダイレクトに比べあまり使う頻度は少ないのですが、一時的にWebページを移転する時などに利用されています。
出張で一時的に家を引越ししたけど、住所はそのままの状態というイメージです。301の代わりに誤用されているような場合であっても、Googleは理解して評価を引き継ぎますが、301リダイレクトと比べると評価が移るまでにやや時間を要することがあります。
また、301リダイレクトと同様にページの評価も引き継ぎます。

なお、302リダイレクトは長期間設置し続けると、結果的に301リダイレクトとして扱われる旨もコメントされている為、認識しておいたほうが良いでしょう。

JavaScriptによるリダイレクト

サーバーの関係上、HTTPによるリダイレクトが実行できない場合、JavaScriptは便利な代替策になります。
JavaScriptは、HTTPによるリダイレクトがサーバー上で処理される一方、JavaScriptはブラウザ側で実行されるものです。
GoogleのクローラーもJavaScriptを実行できるため、転送されていることを認識でき、またページ評価を移転後のページに引き継いでくれます。

meta refreshによるリダイレクト

こちらもHTTPによるリダイレクトが実行できない場合に利用されることが多い方法です。
URLの評価を全て引き継ぐ保証が無いので、検索順位に悪影響が出る可能性があるほか、W3C(Webで使用されるHTMLを含む技術の規格化を行っている団体)では2000年からmeta refreshの使用を推奨していません。
依然としてGoogleはサポートを続けていますが、できるだけ避けたい方法です。
どうしても方法がない場合は、ページ遷移させるまでの時間を0秒に指定する必要があります。

metaリフレッシュの0秒指定

<meta http-equiv="refresh" content="0;URL=https://exsample.co.jp/">

※補足ですが、JavaScriptやmeta refreshによる転送はサーバーを経由しない方法なので、厳密にはリダイレクトではありません

JavaScriptでリダイレクトするをする状況とは

JavaScriptのリダイレクトは、301リダイレクトなどのHTTPリダイレクトができない場合に使用する方法です。JavaScriptは、サーバー側で設定するものではなく、HTTPファイルのソースに直接コードを書くことができるため、サーバーにアクセスできないときなどに使用されることが多いです。

Googleの公式にも、サイト移転等には301リダイレクトが最適ですが、サーバーにアクセスできない場合は、JavaScriptを使用したリダイレクトで代用可能であることが明記されています。

なお、リダイレクトの優先順位としては、
1.サーバー側の301リダイレクト
2.meta refresh リダイレクト
3.JavaScript リダイレクト

の順番となっています。
JavaScript リダイレクト図
https://developers.google.com/search/docs/crawling-indexing/301-redirects?hl=ja

JavaScriptによる転送方法

JavaScriptはブラウザ上で動くプログラムの1種です。
転送を行う際はHTMLファイルの<head>~</head>内に以下のように記述します。

<script type="text/JavaScript">
setTimeout("link()", 0);
function link(){
 location.href='https://(転送先のURL)';
}
</script>

この時、SEOを考慮するとsetTimeout内の数字は0がお勧めです。

JavaScriptによる転送時の注意点

リダイレクトが実行できない場合がある

現在では、ほとんどのブラウザでJavaScriptを実行することができるものの、サポートしていないブラウザがあると、そのユーザーは転送されません。
また、JavaScriptをサポートするブラウザであっても、意図的にJavaScriptを許可しない設定にしている場合も転送されません。

加えて、ページ移転後もJavaScriptを実行させるために移転前のページを残しておく必要があるというデメリットもあります。

ただ転送するだけではアクセス解析上の問題が生じることがある

転送前のページにどのようなチャネルでたどり着いていたとしても、JavaScriptによって転送された後は流入チャネルがdirectとして計測されてしまう問題があります。

また、リダイレクト前にURLにアクセス解析用等パラメータを付与していた場合であっても、そのままではパラメータは保持されません。(常にJavaScript内に指定された、URLパラメータのないURLに転送されてしまう)

このような点が問題になる場合はJavaScriptに手を加えておく必要があります。
詳しくは以下を参考ください。
https://qiita.com/1987yama3/items/5ff58b6195fe6c3f268b

JavaScriptを使ったリダイレクト(転送)の注意点・デメリット
・リダイレクト前のページがdirectとなる
・ページを残し続けなければならない
・ブラウザの設定状況によって機能しない場合がある

まとめ

サイトのリニューアルや移転など、リダイレクトを使用するケースは多くあります。
JavaScriptを使ったリダイレクトはHTTPリダイレクトに比べてデメリットがあり、Googleもリダイレクト方法の中では、HTTPリダイレクト、metaリフレッシュに次いで、3番目の手段として明記しています。

サーバー環境などの理由でHTTP301リダイレクトが使えない場合の代替手段として、使用するようにしましょう。

執筆者 / 監修者

サクラサクマーケティング
株式会社

取締役 社長

ねぎお社長 (根岸雅之)

ねぎお社長 (根岸雅之)イラスト

サクラサクマーケティング株式会社 取締役社長 COO

1980年生まれ 大学卒業後、一貫して、広告・マーケティング業界に身を置く。2006年にSEM コンサルタントとして、インターネット総合代理店、株式会社オプトに入社。リスティング、ディスプレイ広告の運用から、SEOの施策提案など主にキーワードマーケティング領域に特化した業務に従事。同年10月に株式会社ブルトア(現サクラサクマーケティング株式会社)に転職。入社後は、営業をはじめ、SEOコンサルティング、新規事業開発、自社マーケ、人事、財務と幅広い領域を経験し、営業部長、執行役員、取締役と経て、2015 年に社名変更とともに取締役社長に就任。

SEOコンサルタントとして大規模サイトから新規サイトまで、売上向上に繋がるコンサルティングを武器に200サイト以上の実績。2023年には『なぜほとんどコンテンツマーケティングは失敗に終わるのか?』を執筆。ねぎお社長のSEOチャンネルをはじめ、YouTube、メルマガ、SNを通じて積極的に情報発信。

◇ 出版書籍

◇ 情報発信

◇ 掲載メディア

◇ 共催セミナー歴

  • オウンドメディアの成功事例とSEOを支える運用型広告の活用
  • 今日から始められるWebマーケティング~コンテンツマーケティングとGoogle マイビジネス~
  • GMO TECH × サクラサク共催セミナー~テクニカルSEOとコンテンツマーケ~
  • リモート環境下においても売上・利益が成長し続ける組織創りと営業戦略

関連記事

ブログ一覧

あっ!と思ったら
サクラサク
ご相談ください

まずは無料相談へのお申し込みがおすすめです。ベテランコンサルタントが直接対応いたします。

お電話でご相談の方はこちら

03-5776-2775

03-5776-2775

SEO・記事制作なら、
サクラサクにお任せください!

ご相談こちら
×