今回は、Googleがホームページの「セキュア化」と並んで重要視している「高速化」についてご紹介します。
2017年12月22日に、AMP対応に変更致しました。
当サイトが利用しているテーマがAMP対応を簡単に設定できるオプションが機能として追加されたからです。
成果としては、まだ未知数です。
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というものがあるんだなーという知識を入れておけばいいと思います。
【今回の記事作成のため参考にしたサイト】
Facebookコメント