高速モバイルページ（AMP）を検証する方法

前回のAMPチュートリアルでは、AMP（Accelerated Mobile Pages）を採用してモバイル環境でのWebサイトに対するGoogleのモバイル検索結果の大幅なスピードアップと露出の向上を実現する方法を説明しました.

見たこと AMPの可能性は、私はあなたがに準拠するためにあなたのウェブサイトに変更を加え始めたか、または始める計画があるかと思います AMP. ドキュメントのガイドラインに注意深く従って、視覚的な欲求に合うようにAMPページをスタイルするようにCSSを構成してください。.

さて、最後にやることがもう一つあります。それらのページを検証することです。.

AMPバリデータ

AMPページを検証する方法はいくつかあります。

に追加 ＃開発= 1 AMPページのURLの末尾に移動します。報告書は コンソール DevToolsの下のタブ.
あるいは、あなたはオンラインAMPバリデーターを使うことができます。.
Chrome AMPの拡張機能も使えます.

これらのツールは、ページ内のエラーまたは警告をリストしたレポートを作成します。これに基づいて、あなたは何を修正するかを選ぶことができます.

AMP検証が主に支配します HTML要素の使用, のの, そしてその スタイル宣言. ページ内のこれらのものがすべてAMPに準拠していること、およびAMPのガイドラインに違反するものがそこに残っていないことを確認してください。さもなければ、あなたのAMPページはどこにも現れないでしょう.

データ構造

AMPもスキーマデータ構造を必要とします。このデータは、 頭 JSON形式のページのタグ。それはタイトル、出版社のロゴと名前、それが出版されて、修正された日付などを含むページの文脈上の情報を含みます.

ページの目的に応じて、含めるデータは異なります。記事、レビュー、レシピ、ビデオなど。データタイプの詳細については、Google Data Types Documentationを参照してください。.

指定しないとエラーが発生する可能性のあるデータがいくつか必要です。他のいくつかのタイプのデータはオプションであり、警告を出すだけです。ただし、この種のエラーは前述のAMPバリデータには現れません。.

代わりに、それらはあなたのグーグルウェブマスターズアカウントと同様にグーグル構造化データテストツールに現れるでしょう。.

AMPコンシューマ、またはGoogle SearchやTwitter MomentsなどのAMPをサポートするクライアントは、このデータセットを使用して結果ページにAMPコンテンツを表示することができます.

したがって、独自のカスタムHTML要素を使用してAMPのガイドラインに従うこと以外に、必要なスキーマデータも適切に配置する必要があります。.

見落とされたエラー

ほとんどのエラーは明示的にドキュメントに記載されており、一目で簡単に拾うことができます。ただし、いくつかのエラーは、次のように気付かない可能性がある変数を使用してコンテキスト化されています。 “無効な属性値”, それは言う "タグ '％2'の属性 '％1'が無効な値 '％3'に設定されています。".

このエラーレポートは正確に言及もリストもしていません どの値 無効です。しかし、私が知っているのは、私たちが設定することができないということです。 幅 そしてその 高さ の要素を 100％ または 自動. これらの属性値は、画像の比率を維持するために画像の正確なサイズである必要があります。.

これはほんの一例です。いくつかのカスタム要素があります - アンプ画像, アンプイフラメ, そして アンプ広告 - 属性とその値の使用に対する独自の検証規則のセット.

特に数年前に（あるいはおそらく）数千年前に公開されたレガシーコンテンツを考慮に入れる場合、これはAMP Pageの検証を困難なタスクにする可能性があります。.

最終的な考え

AMPはまだ初期段階にあります。それはグーグルとウェブ開発コミュニティからの共同の努力で非常に活発な開発にあります。しかし AMPは確かに進化する. HTML 5と同様に、将来廃止予定の要素、属性、そしていくつかの慣例があるかもしれません。そう AMPページが常に検証されていることを確認してください ガイドラインに対する最新の変更に基づいて.