WordpressサイトをAMP(Accelerated Mobile Pages)対応する
AMPとは
AMP(Accelerated Mobile Pages)という単語を昨年10月ぐらいから見聞きする様になってきました。
簡潔に言うと、
- シンプルなシンタックス(AMP HTML)で構成されたページを表示させるため一般的なWebページの表示速度と比較すると高速に表示できる
- Googleやtwitter側がAMP HTMLで記述されたページをキャッシュしてくれるため、より高速にページ表示できる
という高速化のための2つの技術的な要素があります。
要は「モバイル端末で素早くコンテンツを表示できる」となるのですが、ユーザ体験としては、地下鉄や電車で移動中に通信環境が一時的に悪くなり通信帯域が細くなった場合であってもストレス無く素早くモバイル端末上でコンテンツを表示できるといったメリットが得られます。ニュースアプリのSmartNewsをご利用の方は「すぐに表示する」をタップしたときに表示されるSmartViewをイメージしていただけるとわかりやすかいもしれません。
また、モバイル経由のGoogle検索結果にも対応サイトを検索結果として反映させていくということもあり特にニュースサイト系を運営されている方には興味がある話題かと思います。
WordpressでのAMP対応
Wordpressで構築されているサイトの場合、AMPの対応にはプラグインを活用するのが一番手短です。対応するためのプラグインは現に数種が公開されていますが、今回はWordpressの開発元であるAutomatticが提供するプラグインを試してみました。 wordpress.org
このプラグイン自体はAMPの仕様が公開されて以来、公開はされてきたため単にインストールするだけで試せないのかを試みていたのですが、これまでは単にインストールするだけでは出力ができないなど不具合が多く活用が難しかったのですが、今回のバージョンアップ(Ver 0.3.2) でサイトの構築状況問わず比較的スムーズにAMP対応できる様になっている感を受けました。
やること自体はとてもシンプルでWordpressに上記のプラグインをインストールするだけになります。
インストール後、 http://サイトURL/12345/amp といった具合に記事URLの末尾に amp を付与することで該当記事のAMP HTMLを出力できます。
また出力されたAMP HTMLが適切に出力されているかを確認するには、Google Chromeで http://サイトURL/12345/amp#development=1 開いた際に 表示 > 開発/管理 > ディベロッパーコンソール からConsoleを選択し、以下の様に表示されていれば適切なAMP HTMLが出力されていることがわかります。
"AMP validation successful." が表示されていれば正しいAMP HTMLが出力されています。
ただあくまでも提供するのはコンテンツであり、AMPはあくまでも先に書いた様な通信環境等に問わずコンテンツを届けるための手段にすぎないという点を見誤らない様にしていかないといけないのは必ず必要な認識かなと思います。
