今回は、Googleがホームページの「セキュア化」と並んで重要視している「高速化」についてご紹介します。
Googleは、Accelerated Mobile Pages（アクセラレイティッド・モバイル・ページ）という、モバイル端末（スマホなど）でのWebページの表示を高速化するためのプロジェクトを公開しています。その名が Accelerated Mobile Pages ＝ AMP（アンプ）です。
Googleのモバイルでの検索結果に、AMP対応ページの表示を2月24日に開始しました。
AMP対応ページは、検索結果をクリックすると、ほぼ瞬間的に内容が表示されます。
Google公式ページでも2月25日に発表されています。
- Google Japan Blog: モバイルウェブをもっと速く（Google Japan Blog）
- Google モバイル検索が Accelerated Mobile Pages に対応しました（Google Developers Japan）
と、言っても今わざわざ対応したところで、全くと言っていいほど恩恵はないと思います^^;
さらに、AMP対応ページでは、javascriptが動作しないなどの制限があるのでGoogle Analyticsのタグやいいねボタンなどは、動作しないです。
アクセス解析は、設定をすればAMP対応ページにアクセスがあった場合は、カウントされるようになります。
なので、AMP対応は自己責任でお願いします（笑）ということで今回、人柱になってみたいと思います！
この記事の目次
WordPressのプラグインAMPをインストールしました
当サイトは、WordPressなのでプラグインを入れれば対応できます！
やっぱりWordPress最高っ！簡単ですっ！
- WordPressの管理画面から《プラグイン》
- 《新規追加》をクリック
- 「AMP」を検索
- 《今すぐインストール》をクリック
《プラグインを有効化》をクリックします。
AMPの設定
設定することは、ないのですが一つだけ操作が必要です。
設定は、変更せずに《設定》→《パーマリンク設定》で《変更を保存》ボタンをクリックします。
これをすることで、Rewriteルールを“フラッシュ”させるためだそうです。
AMP対応ページにアクセス解析をするための設定
今のままでは、Google Analyticsのjavascriptも削除されてしまうので、AMP対応ページヘアクセスがあるのかわからなくなります。
プラグインのファイルに２箇所追記して、アクセス解析ができるようにします。
FTPソフトを利用して、サーバー上のファイルを使ってもいいですし、
WordPressの管理画面内の「プラグイン編集」を利用してもいいです。
AMPプラグインの中の wp-content/plugins/amp/templates/single.php を編集します。
1.head要素<head>〜</head>の中に、以下を入れます。
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
2.body要素<body>〜</body>の中に、以下のスクリプトを入れます。
<amp-analytics type="googleanalytics" id="analytics1">
<script type="application/json">
{
"vars": {
"account": "UA-XXXXX-Y"
},
"triggers": {
"trackPageview": {
"on": "visible",
"request": "pageview"
}
}
}
</script>
</amp-analytics>
Google Analyticsにて、《アナリティクス設定》→《プロパティ》→《プロパティ設定》→トラッキングID で確認できます。
入力は、以下の様な感じになります。別ソフトで開いた状態です。
入力が終わったら《ファイルを更新》ボタンをクリックします。
AMP対応ページでアクセス解析が正常に動作しているか、Google Analyticsのリアルタイムで確認
AMP対応ページを確認する場合は、URLの末尾に「amp」を付けて確認します。
AMPページのデザインは、超シンプル
AMPに対応したページのデザインは、超シンプルです！
不要なシェアボタンなんか表示されません。
ということで、「いいね」ボタンも表示されていないので、「いいね」できないですね^^;
- 通常のページデザイン
- AMP対応ページデザイン
シェアボタンや不要な装飾がなくなり、超絶シンプルになりましたね。
記事だけが表示されていますね。
AMP対応のまとめ
記事だけのシンプルな構造になったので、爆速で表示されるようになるんですね。
まだ、恩恵はほとんどないと思うので、AMP対応させなくてもいいんじゃないかなと思っています。
SSL化も一緒に推奨されていて対応してみましたが、現時点でも恩恵受けている感じはしません（笑）
今は、AMPというものがあるんだなーという知識を入れておけばいいと思います。
【今回の記事作成のため参考にしたサイト】
