AMP ページが Google 検索に表示されるためには、そのページが正しく実装されていなければなりません。つまり、Accelerated Mobile Pages でサイトを AMP 化(#AMPlify)した後も、ページの状態を定期的に確認することが重要になります。
AMP ページを実装する際に、ページにエラーが含まれていると、そのページは Google 検索のインデックスに登録されません。また、エラーにはなっていなくても、ページに警告が含まれていることがあります。たとえば、要素が推奨された方法に従っていない場合や、将来的にエラーになる可能性がある場合です。
Google Search Console は、どの AMP ページにエラーが含まれているかを確認できる無料のサービスです。Search Console で問題のあるページの URL を特定できたら、以下のツールのいずれかを使用して検証エラーの詳細を簡単に確認できます。
1. ブラウザ デベロッパー ツール
デベロッパー ツールを使用して検証するには:
- ブラウザで AMP ページを開きます。
- URL の最後に「#development=1」を追加します(例: http://localhost:8000/released.amp.html#development=1)。
- Chrome DevTools Console を開いて検証エラーを確認します。
Developer Console には、エラーが以下のように表示されます。
2. AMP ブラウザ拡張機能
AMP ブラウザ拡張機能(Chrome と Opera に対応)を使用すると、無効な AMP ページを簡単に特定してデバッグできます。ブラウザでサイトを表示すると、拡張機能が AMP ページにアクセスし、各ページが有効かどうかを判別します。
AMP ページ内にエラーがある場合は、拡張機能のアイコンが赤色になり、見つかったエラーの数が表示されます。 | |
AMP ページ内にエラーがない場合は、アイコンが緑色になります。警告がある場合はその数が表示されます。 | |
ページが AMP でなくても、AMP 版が存在することがわかっている場合は、アイコンが青色になってリンクアイコンが表示されます。拡張機能のアイコンをクリックすると AMP 版のページにリダイレクトされます。 |
拡張機能を追加することにより、アイコンをクリックするだけで、ページにどんなエラーや警告があるかわかるようになるわけです。それぞれの問題について、原因となっているソースの行番号と列番号、そして、何が問題かを示すメッセージが表示されます。さらに詳しい説明がある場合は、[Learn more] をクリックすると ampproject.org の該当ページが表示されます。
3. AMP Web Validator
AMP Web Validator は、AMP ページの有効性を検証するためのシンプルなウェブ インターフェースです。validator.ampproject.org からアクセスできます。
このツールを使用するには、AMP の URL を入力するか、ソースコードをコピーして貼り付けます。エラーがある場合は、行と行の間にエラー メッセージが表示されます。AMP Web Validator 上で直接編集すると再検証が行われ、その変更によって問題が解決するかどうかがすぐわかります。
AMP ページの状態を確認するうえで、どの方法が一番使い勝手が良かったでしょうか。下のコメント欄または Google+ の Google ウェブマスター コミュニティからフィードバックをお願いします。質問がある場合は、お気軽にウェブマスター ヘルプ フォーラムに投稿してください。