AMPを導入したいのでAMPについて書かれた記事を読んだ。
YAMAGUCHI::weblog
AMP対応 2016.02版
http://ymotongpoo.hatenablog.com/entry/2016/02/25/224159
そもそもAMP化するという場合、既存のモバイル向けページを置き換えるというイメージを持たれる方がいますが、そうではなく、そのページは残したままAMP HTMLの仕様に従ったページを追加で作成するという形になります。
と書いてありわかりやすい。詳細な実装手順も書かれている。ありがたい。
この記事を読んだ後だと他サイトのAMP記事も頭に入りやすい。
Google Developers Japanブログ
Google モバイル検索が Accelerated Mobile Pages に対応しました
http://googledevjp.blogspot.jp/2016/02/google-accelerated-mobile-pages.html
大まかな実装手順が書かれている。以下引用。
AMP ページの実装手順
- AMP ページと正規版のページの URL の対応を検討する
- 正規版の URL にパスを追加する 例) https://foo.com/article/amp/index.html
- ファイル名に文字を追加する 例) https://foo.com/article/index.amp.html
- URL パラメータを追加する 例) https://foo.com/article/index.html?amp
- AMP ページ設置予定の URL に Google のクローラーがアクセスできるようにする
- robots.txt を確認する
- 正規版のページのメタタグに nofollow 等がないようにする
- AMP HTML の仕様にしたがい、AMP ページを作成する
- Required Markup の項目がすべてあるか確認する
- Google の検索結果に表示されるためには schema.org に準拠したメタデータの付与が必要
- validator を用いて AMP ページが正しくマークアップされているかいずれかの方法で確認する
- URL に #development=1 というフラグメントをつけて Google Chrome の開発者ツールで確認
- node.js 製の validator をコマンドラインで実行して確認する
- Structured Data Testing Tool を使ってメタデータが正しく記述されているかを確認する
- Search Console の AMP レポートツール を使って AMP ページがインデックスされているか確認する
- Google のクローラー側でエラーを検出した場合はこちらでレポートされるのでよく確認する