Googleモバイル検索がAMPに対応したと、2016年2月25日(木)にGoogleから発表がありました。
AMP(Accelerated Mobile Pages)とは?
簡単に箇条書きにすると以下のようになります。
- モバイルブラウザ用に早く表示される仕組みで、Googleが強く推奨している
- 現時点では、SEOのシグナルとして扱わない。(あくまで現時点)
- AMP対応のWEBにするには、AMPに準拠したHTMLを書く必要がある
- AMPでは原則JavaScriptを利用できない
- そのためアクセス解析で利用されるJavaScriptが利用できない
- GoogleAnalyticsは対応、GTMは未対応
AMPが指定するHTMLで記載されたWEBページを、サーバーにキャッシュして、モバイルでグーグル検索する際に、そのキャッシュを読みにいく仕組みらしい。Googleだけではなく、ツイッターもキャッシュを利用できるようです。
AMP自体はAccelerated Mobile Pages Project というプロジェクトチームで動いているようです。
https://www.ampproject.org/
AMPを利用するには、AMPに準拠した形式のHTMLし、構造化データも正しく実装させる
正直通常のサイトで対応しようとすると、結構めんどくさいです。
メディアとかは収益に直結するので、頑張っても良いのでしょうが。
例えば、画像ファイルでであれば以下のように記載します。
<amp-img src="welcome.jpg" alt="Welcome" height="400" width="800"></amp-img>
参照
https://www.ampproject.org/docs/get_started/create/include_image.html
https://funnis.net/blog/knowledge/amp-html-procedure/
![]()
AMPをワードプレスにプラグイン無しで設定する方法 | q-Az2月よりGoogleがAMP(AcceleratedMobilePages)のインデックスを始めるようで、SEO界隈ではそれなりの盛り上がりをみせています。AMPというのは簡単に言うと「スマホ高速表示技術」のようなものです。AMPとはモバイルで閲覧する人がPCで閲覧する人数を超え、スマホで見れるのは

WordPressを利用している人なら、AMPに対応してくれるプラグインがあります。
https://wordpress.org/plugins/amp/
AMPの定める仕様にそって正しく記述が出来てるか確認する方法
AMPページのURLの末尾に「#development=1」をつける
例)https://liapoc.com/mod_pagespeed_webp.html であれば、https://liapoc.com/mod_pagespeed_webp.html#development=1 にする
※上記のプラグインを使用した場合は、「/amp」をつけることで、AMPページ表示されます。
例)https://liapoc.com/mod_pagespeed_webp.html/amp
Google Chromeの検証を立ち上げ、consoleタブをクリック
以下の文言がでてれば、AMP対応されています。エラーがある場合、この後に赤くエラーが表示されます。
構造化データが問題ないか確認する
Structured Data Testing Tool にアクセスし、対象のURLを入力します。
問題なければ、問題ありません と表示されます。
サーチコンソールで確認
問題なくGoogleにindexされれば、サーチコンソールから確認できます。
検索での見え方 ≫ Accelerated Mobile Pages から確認できます。
AMPで既存の解析ツールを使用する
AMPはJSONという形式でやり取りをするので、JavaScriptで作成されているGoogleタグマネージャーやGoogleアナリティクスは利用できません。
Googleアナリティクスは、別途AMP用のアナリティクスと記述をすることで対応可能です。
https://developers.google.com/analytics/devguides/collection/amp-analytics/
![]()
amphtml/amp-analytics.md at main · ampproject/amphtmlThe AMP web component framework. Contribute to ampproject/amphtml development by creating an account on GitHub.
AMP対応のGoogleアナリティクスの設置方法
1.head内に、下記のコードを入れます。
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
2.body内に以下のコードを入れる
<amp-analytics type="googleanalytics" id="analytics1"> <script type="application/json"> { "vars": { "account": "UA-XXXXX-Y" // Replace with your property ID. }, "triggers": { "trackPageview": { // Trigger names can be any string. trackPageview is not a required name. "on": "visible", "request": "pageview" } } } </script> </amp-analytics>
コメント