モバイル機器でWEBページを高速に表示する仕組みとして、AMP（Accelerated Mobile Pages）があります。モバイル機器の利用者が快適にホームページを閲覧することができるように、Google社とTwitter社が共同で立ち上げたオープンソースプロジェクトです。
自分で立ち上げているサイトでAMPを実装すると、通常公開している状態に比べて、モバイル ページの表示速度が約4倍、データ量が約1/10になると言われています。
AMPに対応しているWebページでは、あらかじめWEBページの内容をキャッシュしてくれていて、閲覧要求があったときには、そのキャッシュのデータが表示されるため、閲覧スピードが上がります。
AMPを解除した理由
こちらのサイトでもAMPを今まで有効にしてきました。しかし、下記の理由でAMPの実装を解除しました。
- さくらインターネットのウェブアクセラレータという仕組みを使って、コンテンツをキャッシュしていること
- モバイル機器の性能向上やモバイル回線速度の向上が著しいこと
- AMPページを表示した際にページの構成の問題でまれにスタイルが崩れているページがあったこと
解除の仕方（WordPress＋cocoon）
WordPressとテーマはCocoonを使っているのですが、解除するのは簡単でした。具体的には、Wordpressのダッシュボードを開き、「Cocoon設定」のメニューを選択します。
「AMP」のタグをクリックすると上の画面が表示されますので、「AMP機能を有効化する」のチェックボックスをオフにしました。
301リダイレクトの設定
また、ほかのサイトからampページにリンクが張られている可能性があります。AMPを無効にすると、ほかのサイトからリンクを踏んで閲覧があったときに、404（Not Found）になってしまうため、リダイレクトの設定をしておきました。
リダイレクトの設定は下記のサイトを参考にしました。
こちらは、さくらインターネットのレンタルサーバーを使っています。そのファイルマネージャーを使って、「.htaccess」というファイルのバックアップをとってから、下記のコードを、「BEGIN WordPress」よりも前に挿入しました。赤文字のところは自サイトのドメイン名に書き換える必要があります。
<div class="blank-box bb-yellow">#BEGIN WordPress より前に書くこと！<br>#AMPページの301リダイレクトSTART<br><IfModule mod_rewrite.c><br>RewriteEngine On<br>RewriteCond %{QUERY_STRING} (^|&)amp=1(&|$)<br>RewriteRule ^(.*)$ <span style="color: #ff0000;">https://www.painfo.net/</span>%{REQUEST_URI}? [R=301,L]<br></IfModule><br>#AMPページの301リダイレクトEND</div>今後、検索流入数等に影響が出るかどうかは注意深く観察するようにします。
【2022/07/11追記】
AMPエラーの増加と減少
「参照しているAMP URLはAMPではありません」というエラーがSearch Consoleに表示されました。理由は簡単で、AMP URLにアクセスしても301リダイレクトされて、通常のページが表示されるためです。
クロールが進んで検索エンジン側が「AMPページは無くなった」と認識してくれれば、このエラーは消えるはずです。エラーの数は最初に警告されたときがピークで4日間で半減しました。しばらく様子を見ます。
【2024/02/06追記】
CocoonでもAMPのサポートが停止へ
テーマ「Cocoon」でもAMPのサポートが停止されました。現時点では利用することによるデメリットが増えたことによるものです。テーマとしてもAMPをサポートし続けると機能追加のたびに通常版とAMP版の両方への影響を精査する必要があって大変だったと思います。すでにCDNを使ってキャッシュすることが一般的になってきたので、AMPは採用するサイトが減っていくものと思います。
【2024年2月20日追記】
CDN（コンテンツブースト）で高速化
さくらインターネットのプレミアムプランには転送量300GBまでのCDN（コンテンツブースト）が無料で付いてきます。使わないのは勿体ないので、こちらのブログのURLを「www.painfo.net」に変更し、コンテンツブーストを設定しました。こちらに対応方法を整理しています。
コメント