AMPで作ったページを実際にGoogle検索結果経由でみた時と同じキャッシュ表示にする方法

今日は技術的な話。

AMPページ対応を行った人も最近増えてきたと思うのですが・・・
AMPページの実際のURLじゃなくてGoogle検索結果経由などで表示したときの挙動を確認したい

ということありますよね?そんな時には以下の方法で確認ができます。

やり方は結構簡単です。

1. まずは対象となるAMPページのURLを用意する

このページもHTTPS化をしたのでAMPページはございます!
ということで、サンプルはこんな感じ。(ブラウザをモバイルエミュレーションモードにしてどうぞ)

https://manjiro.net/post/notebook/1091_post-1091/amp

2. 1で用意したURLを加工する

1で用意したURLのうち、プロトコルとスキーマ部分(https://)を取り除き、以下のURLの後ろにくっつけます。
以下のURLどちらかが正しいので、両方用意しておいて下さい。恐らく上の方だけで出来るのですが、たまに下もあるので・・・

(2017/03/06 更新)
どうやらhttps対応してる場合は最後に”/s/”のディレクトリをつけるようです。ということで以下になります。

HTTPS対応の場合) https://www.google.co.jp/amp/s/ 
HTTPの場合) https://www.google.co.jp/amp/

3.実際にアクセスする

実際にアクセスしてみます。(勿論モバイルエミュレーションでどうぞ)

https://www.google.co.jp/amp/s/manjiro.net/post/notebook/1091_post-1091/amp

AMP計測や流入処理など分析周りの実装をしたい時にはこちらを使うと便利ですよ!

4. Googleからの流入も再現したい場合は?

Google からの流入も再現したい場合は、Search Consoleにある AMPテストという機能を使ってAMPページのValidationをした後に出て来る「検索結果のプレビュー」ボタンで生成されるURLを使うとテストできます。

AMP テスト – Google Search Console

実際に作業してみるとこんな感じです。

Google提供のAMPテストページ実施画面

Google提供のAMPテストページ実施画面

AMPページのプレビュー画面

AMPページのプレビュー画面

今後は変わる模様?(2017/03/06 追加)

どうやら、今後はAMPページのキャッシュ先URLは変わるようです。

AMP CDNのキャッシュURL構成をGoogleが更新、専用のサブドメインを各サイトに割り当て ” 海外SEO情報ブログ

こちらの方式になると、また違うキャッシュになりますので、技術は随時注視しておきましょう。