【WordPress】スマホアクセス時のAMPサイトへのリダイレクト設定(.htaccess設定方法)

「AMP(Accelerated Mobile Pages)」とはGoogleが推進しているモバイルページを高速に表示させるための手法によって作成されているコンテンツであり、以下の画像に記載しているように⚡記載のサイトはAMP HTMLに飛ばされ、Googleにキャッシュされた高速でシンプルなページが表示されます。

SmartNews AMP表示

AMPのページを作成し、アクセス可能としてもPCとTablet、Mobileのアクセス時のリダイレクト設定を行っていないとそのまま重たいページに飛ばされることになります。

Googleは検索の上位表示の条件として表示速度についても対象としています。そのため、上位検索を狙うためにはAMPなどの表示速度を向上する機能を使用していくことが必要です。

そのためMobileでのアクセス時にはAMPサイトへの転送を行う必要があります。今回はモバイル端末でのAMPページへのリダイレクト設定内容と.htaccessの記述方法について記載します。

1.Mobile端末からのアクセスをリダイレクトする.htaccess設定

WordPress直下の.htaccessに以下のコードを追記します。AMP、管理画面、ファイルへのアクセスとbotからのアクセス時はURLの変更をせずに、Mobile端末からのアクセス時はAMPサイトにリダイレクトさせるようにします。Wordpressでの起債時は#BEGIN WordPressより前に記載するのを忘れないようにしてください。

.htaccessファイル位置
%MINIFYHTML5f04c2ec4c30d8481de29736de80dba3132%
# BEGIN WordPress <IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteRule ^index\.php$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.php [L] </IfModule> # END WordPress
# BEGIN HAND WRITE # リダイレクト処理 # AMPサイトの場合:URL変更なし RewriteCond %{QUERY_STRING} !amp # WordPressの管理画面の場合はURL:URL変更なし RewriteCond %{REQUEST_FILENAME} !^wp-.*? # 対象のURLがmode=pcの場合はURLを書き換えない RewriteCond %{QUERY_STRING} !mode=pc # ファイルへのアクセスの場合:URL変更なし RewriteCond %{REQUEST_FILENAME} !-f # botからのアクセスの場合:URL変更なし RewriteCond %{HTTP_USER_AGENT} !(bot|Mediapartners-Google|APIs-Google) [NC] # Mobile端末からのアクセスの場合:URL変更(URLの末尾に?ampを追加する) RewriteCond %{HTTP_USER_AGENT} (iPhone|Android.*Mobile|Windows.*Phone) [NC] RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1?amp [NE,QSA,R,L] # END HAND WRITE # BEGIN WordPress <IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteRule ^index\.php$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.php [L] </IfModule> # END WordPress

通常ページ

AMPページ

上記だけで対応はできますが、詳しく.htaccessファイルについて知りたい方は以下もお読みください。

2. .htaccessについて

.htaccessとは、Apache(アパッチ)と呼ばれるWebサーバーにでのディレクトリ毎に個別設定を行うためのファイルです。Apache サーバーにおけるリダイレクトの設定は、通常、任意のディレクトリにこの .htaccess を配置して、そこからどこに転送するのかについての転送処理を書き込みこむ事が一般的です。

2-1.利用目的とメリット

今回は通常のページからモバイル端末についてAMPサイトに転送することで表示の高速化を図りましたが、リダイレクトには下記のような利用目的とメリットがあります。

  • URL変更後もTwitterやFacebook、ユーザーのブックマーク、他のサイト等からのリンク等からのアクセスが可能
  • SEO対策としてURL変更後も変更前のパーマリンクのGoogleやYahoo等の検索サイトの評価を引き継ぐことが可能
  • 「wwwの有無」や「URLの最後を/、/index.html等」を統一することが可能
  • URLを完全に統一することで、ドメインやページの評価が分散されなくなる。

2-2.リダイレクトの種類

リダイレクトで最も利用されるのが「301」と「302」です。

・301 Permanent Redirect
恒久的なリダイレクトとなります。このリダイレクトは将来変更することは絶対にないとサーバーに伝える方法。SEO的には記事評価を全てリダイレクト先に譲渡して下さいと伝える方法。検索エンジンからのアクセス流動や順位を引き継ぎたい場合には必ず301リダイレクトを使います。

・302 Temporary Redirect
一時的なリダイレクトです。将来は変更するかもしれない時に使用するリダイレクト。SEO的にはリダイレクト先には評価を譲渡しない。キャッシュしない方法。
検索エンジンからのアクセスや評価はリダイレクト元に残ります。リダイレクト先が変更された場合でもオリジナルに影響を与えない方法となります。
使い方としては一時的なメンテナンスページへのリダイレクトや言語振り分けやデバイス毎に振り分ける時などに使用します。

2-3. .htaccess の作成方法

.htaccess は、転送ルールのコマンドが記載されたただのテキストファイルのため、 VSCode秀丸Vimなどのテキストエディタを使って、.htaccess という名前のファイルを作成して、転送したいディレクトリ(多くの場合、Webサイトのルートディレクトリ、WordPressの場合は/wordpress/直下)に配置してください。

※.htaccess では改行コードとして「LF(ラインフィード)」のみを認識します。エディタで新規作成時は「CR(キャリッジリターン)」のみを改行コードとして含む場合があるため、上記の改行コードを変更できるテキストエディタを利用してください。また日本語記述を行う場合はUTF-8をお勧めします。

2-4. .htaccessコードリスト

<IfModule mod_rewrite.c>…</IfModule>

リダイレクトの設定内容は、全て<IfModule mod_rewrite.c>… </IfModule>という設定で囲む事で、使用しているWebサーバー上で「mod_rewrite」というモジュールが利用可能な場合は、このタグ内の設定値を読み込みます。mod_rewrite は、レンタルサーバーであっても、現状殆どのWebサーバーで利用可能ですが、利用できないサーバがあるため、評判や検索にて確認し、レンタルサーバ等を選択してください。

<IfModule mod_rewrite.c></IfModule>

RewriteEngine

mod_rewriteモジュールを利用する際に「On」で使用します。

RewriteBase

RewriteBaseは、RewriteRule設定で指定される「リダイレクト先のベースディレクトリ」を設定します。
例:
RewriteBase /ではベースディレクトリは、その.htaccessが配置されたディレクトリ自体
RewriteBase /test-base/では、RewriteRuleでリダイレクト先にindex.phpが指定された場合、/test-base/index.phpとなります。
RewriteBase の値が使用されるのはRewriteRuleのリダイレクト先URLが相対パスの場合のみです。例:リダイレクト先に指定した文字列が、/index.phpやhttps://test-base.co.jpのようなフルパスでは使用されない。

RewriteCond

RewriteCondは、RewriteRuleを適応するフィルタ条件を記述します。以下記載のサーバー変数や サーバー変数等から得られる文字列を正規表現や条件記号を用いて、マッチングを行います。

主なサーバー変数

変数名取得できる値
%{HTTP_HOST}ホスト名、つまりドメイン
(例:www.example.com)
%{REMOTE_ADDR}ホストのIPアドレス
%{REQUEST_URI}リクエストにおけるURI、ファイルパス。「/index.php」のように、最初にスラッシュが含まれる点に注意する。また、クエリ文字列は含まれない
%{REQUEST_FILENAME}ファイルシステム上のファイルパス
(例:/var/www/html/my-site/about.php)
ただし、リクエスト時点でファイルが断定できていなければ、REQUEST_URI と同じ。
%{HTTPS}リクエストプロトコルが「https」であれば"ON"、そうでなければ"OFF"。
%{QUERY_STRING}クエリ情報
例:amp,product_id=1183等

主な条件記号

複数の条件を記載することが可能であり、記載した場合はデフォルトでは条件はANDとなりますが、明示的にRewriteCondの末尾に[OR]を記載することで、ORとすることができます。
また冒頭で使用しておりますが、条件の冒頭に”!”マークをつけることで、条件の真偽を逆転することができます。
一つ、もしくは複数のRewriteCond設定の後にRewriteRuleを記載すると、複数条件で処理され、フィルタ条件は次のRewriteRule時にはリセットされます。

記号意味
-d対象文字列をパスとみなし、その存在とディレクトリかどうかをチェックする。
-f対象文字列をパスとみなし、その存在とファイルかどうかをチェックする。
-F対象文字列をパスとみなし、そのファイルが存在し、サーバーシステムからアクセス可能な状態かどうかをチェックする。
-s対象文字列をパスとみなし、そのファイルが存在し、ファイルサイズがゼロ以上かどうか。
-x対象文字列をパスとみなし、そのファイルが存在し、実行権限があるかどうかをチェックする。

正規表現

文字処理で使える正規表現
記号意味
.任意の1文字
*直前の文字の0回以上の繰り返し*1
+直前の文字の1回以上の繰り返し*1
?直前の文字は省略可能*1
*?直前の文字の0回以上の繰り返し*2
+?直前の文字の1回以上の繰り返し*2
??直前の文字は省略可能*2
[ ~ ][ ]の中のどれか1文字*5
[^ ~ ][ ]の中に無い1文字*5
( ~ | … )~か…かどっちか
{n}直前の文字のn回の繰り返し
{min,max}直前の文字のmin以上max以下の繰り返し(min、maxは省略可能)*1
{min,max}?直前の文字のmin以上max以下の繰り返し(min、maxは省略可能)*2
\wアルファベット、数字、アンダスコア(?_?)のどれかの1文字
\Wアルファベット、数字、アンダスコア以外の1文字
\d数字1文字
\D数字以外の1文字
\s半角スペース、タブ、改行のどれか1文字
\S半角スペース、タブ、改行以外の1文字
\n改行
\tタブ
\\\記号
( ~ )( )内を1文字扱い
位置処理で使える正規表現
記号意味
^行の先頭
$行の末尾
\<単語の先頭
\>単語の末尾
\b単語の先頭か末尾
\B単語の先頭、末尾以外
\Aファイルの先頭
\zファイルの末尾
\G直前の一致文字列の末尾
置換文字列で使える正規表現
記号意味
?0一致した文字列全体
\1 \2 … \9それぞれ検索文字列の1~9番目の?( )?に一致した文字列*4
\l次の1文字を小文字にする
\L ~ \E挟まれた文字列を小文字にする
\u次の1文字を大文字にする
\U ~ \E挟まれた文字列を大文字にする
\n改行
\tタブ
\\\記号

RewriteRule

リダイレクト処理の設定。RewriteBase、RewriteCondのパス、フィルタにより処理されます。先2つのコマンドはなくてもRewriteRuleの設定は処理されます。最低の構成は以下です。

<IfModule mod_rewrite.c> RewriteEngine On RewriteRule [転送元URL] [転送先URL] [リダイレクト先の宣言] </IfModule>

RewriteRuleのリダイレクト先の指定

リダイレクト先の指定では、リダイレクト先となるURL文字列を記載します。

サンプルのように、リダイレクト先を相対パス(スラッシュで開始しないファイルパス)で記載すれば、RewriteBaseの設定値をパスとして利用できます。RewriteBase設定が存在しなかったり、その値を使いたくなければ、リダイレクト先の指定を「/sample.php」などとスラッシュで書き始めればRewriteBaseは使用されません。

RewriteRuleのリダイレクト先の表

フラグ意味説明
CChainこのルールにマッチしたら、次のルールを評価
FForbiddenアクセス禁止(403-Forbidden)。[L]フラグと同様、以降のルールは無視される
GGone削除(410-Gone)
LLastマッチしたらRewriteを止めます。以降のルールは無視。基本的に[R,L]併記
NCNo Case大文字小文字を無視
NENo Escape".", "?", "%"などの特殊文字が"%25″のようにエンコードされるのを防ぐ
OROrRewriteCondを複数指定する場合のor指定。指定なしならAND
PTPath ThroughRewriteを終了し、それ以外の処理に移行
RRedirect基本的には、[R=301]、[R=302]のどちらかを設定します。( [R] と省略すれば [R=302] と同義です。)[L]フラグと同様、以降のルールは無視される
QSAqsappend置換URIにクエリ文字列が含まれる場合、RewriteRuleのデフォルトの動作は、既存のクエリ文字列を破棄し、新しく生成されたクエリ文字列に置き換えることです。 [QSA]フラグを使用すると、クエリ文字列が結合されます。
QSDqsdiscard要求されたURIにクエリ文字列が含まれ、ターゲットURIに含まれていない場合、RewriteRuleのデフォルトの動作は、そのクエリ文字列をターゲットURIにコピーすることです。 [QSD]フラグを使用すると、クエリ文字列が破棄されます。
QSLqslastデフォルトでは、置換の最初の(左端の)疑問符がクエリ文字列からのパスを区切ります。 [QSL]フラグを使用すると、最後(右端)の疑問符を使用して2つのコンポーネントを分割するようにRewriteRuleに指示します。

これは、ファイル名にリテラルの疑問符があるファイルにマッピングするときに役立ちます。置換でクエリ文字列が使用されていない場合、このフラグと組み合わせて疑問符を追加できます

最後に

様々なサイトがAMPに対応してきていますが、上記のように高速化のためにWordpressのAMPサイト設定後に.htaccessに追記する必要があります。皆さんもブラウジングの高速化のため、設定してみてください。

ブログ高速化に関するまとめ記事を作成しましたので、他の高速化方法については以下を参照してしてください。

UMilCLhttps://umilcl.com
兼業ブロガー。メインは大手製造業システム企画・設計・プロジェクト管理。工場のプロセス制御が主な業務。 得意分野: プロセス制御と統計、機械学習、画像処理、システム技術 保有資格: プロジェクトマネージャー、情報処理安全確保支援士、ネットワークスペシャリスト、応用情報処理、第一種衛生管理者

Similar Articles

Comments

返事を書く

コメントを入力してください!
ここに名前を入力してください

Follow US

0ファンいいね
3フォロワーフォロー
89フォロワーフォロー
4,128フォロワーフォロー
0SubscribersSubscribe

Archive

Most Popular

Synology DS220+と他DS+シリーズ3種の比較・レビュー

SynologyのDS220+、DS420+、DS720+、DS920+の2ベイと4ベイのDS+シリーズが4機種の後継機が5月20日に発売されました。DS+シリーズ4種のスペックについて比較していますので、購入時の参考にしてみてください。

Synology DS420j DS420+ DS920+の比較・レビュー

Synologyのエントリーモデルの4ドライブベイであるDS420jとDS420+、DS920+が発売され、2020年モデルもある程度そろってきました。DS420はエントリークラス、DS420+、DS920+はフラッグシップモデルとなりますが、どのような違いがあるか調査しました。

Synology DS220j DS220+の比較・レビュー

SynologyのエントリーモデルのDS220jとDS220+が発売され、2020年モデルもある程度そろってきました。 DS220はエントリークラス、DS220+はフラッグシップモデルとなりますが、違いはどこにあるか調査しました。

アイリスオーヤマの炊飯器のボタンの故障を直す方法

本記事ではアイリスオーヤマの炊飯器は割とボタンが反応しなくなるようなので、大体他の型式も同じように分解し、修理可能かと思いますので、修理の仕方を説明します。

【コロナ影響】情報処理安全確保支援士のレポート講習について

新型コロナウイルスの影響により情報処理安全確保支援士の集合研修が、今年更新の一部期間の方のみレポート講習になりました。私も2020年10月の更新対象となり、レポート講習となりましたので皆さんにどのようなものだったかを紹介したいと思います。