AMP化とは?AMPテストができるツールを4つご紹介!
モバイル検索で、Webページ表示を高速化する手法にAMPがあります。AMPは正しく実装されていなければ、検索結果でページが反映されません。そのためAMPページを作成したら、必ず検証が必要です。そこで今回はAMPのテストを行う方法として、AMPテストツールをご紹介します。これからAMPページを作成する場合は、今記事を参考に最適なAMPテストツールも導入しましょう。
AMPテストを行えるツール4選
AMPはモバイル検索において、Webページ表示を高速化する手法です。スマホで検索するユーザーが増えたことで、モバイルの検索結果におけるページ表示速度が重視されるようになりました。AMPはページ表示速度を高めることでユーザーの利便性を向上し、かつSEOにも良い影響を与えます。結果的に検索結果の上位獲得にも期待できるため、導入して損のない手法です。AMPは通常Webページとは異なるAMP HTMLで作成されるため、ページ公開にあたりAMPページが正常に機能しているかをチェックする必要があります。テストは以下のようなツールを用いて行います。
ツール名 | 概要 |
---|---|
AMPテスト | Googleが提供するAMPテストツール。URLを入力するだけで、簡単にテストができる。 |
Google Search Console | Googleが提供するアクセス管理ツール。AMPレポートから、AMPページの状態がわかる。 |
デベロッパーツール | Chromeに搭載されているAMPテスト機能。AMP HTMLのページソースが確認できる。 |
AMP Validator | AMPプロジェクトが提供するAMPテストツール。AMPページのURLを入力することで、ソースが確認できる。 |
AMPページが正常であるかをチェックする目的は同じですが、ツールによって使い方や特徴が異なります。代表的な4つのツールの中から、使いやすいツールを導入してみてください。
1.AMPテスト
引用:AMP テスト – Google Search Console
AMPテストは、Googleが提供している無料で利用できるAMPテストツールです。ツール自体がシンプルでかつ使い方も単純であるため、初めてAMPテストツールを導入する場合におすすめです。
AMPテストの使い方
1 | AMPテストにアクセス |
---|---|
2 | ツール内の検索窓にテストしたAMPページのURLを入力 |
3 | AMPページの有効有無を確認 |
4 | 有効でない場合は、修正箇所を確認 |
1 AMPテストにアクセス
下記は、AMPテストのサイトURLです。
Googleの提供するツールですが、Googleアカウントの所有やアカウント作成は必要ありません。サイトにアクセスするだけで、すぐに利用できます。
2 ツール内の検索窓にテストしたAMPページのURLを入力
ツール内の検索窓に、AMPページのURLを入力して、「テストを実行」をクリックします。URL入力後は、数十秒ほどで結果が確認できます。
3 AMPページの有効有無を確認
AMPページが正常な場合は「有効なAMPページです」、異常がある場合は「有効なAMPページではありません」と表示されます。そもそもAMPページへのリンクが設定されていない場合は、「AMPページではありません」となります。
また「Googleに送信」を実行することで、Googleにインデックスが送信できます。そして「検索結果をプレビュー」を実行することで、実際の検索結果でどのように表示されるかが確認可能です。
4 有効でない場合は、修正箇所を確認
AMPページが有効でない場合は、修正が必要な箇所が指摘されます。指摘内容に沿って修正し、再度AMPテストを実施しましょう。
2.Google Search Console
Search Consoleは、Googleが提供するアクセス管理ツールです。サイトの検索トラフィックや掲載順位の測定など、SEOに関する検証・修正が行えます。Search Consoleを使うには、対象サイトの登録が必要です。そのためSearch Consoleでのアクセス管理も兼ねて、AMPテストも行いたい場合におすすめです。
Google Search Consoleの使い方
1 | Search Consoleにログインする |
---|---|
2 | ホームでAMPテストの対象となるWebサイトを選択 |
3 | 検索の見え方>Accelerated Mobile Pages(新・AMPステータス)を選択 |
4 | AMPページのエラー有無を確認 |
※新Search Consoleでは「Accelerated Mobile Pages→AMPステータス」に改称
1 Search Consoleにログインする
Search Consoleを使用したことがない場合は、新規に登録が必要です。Googleアカウントがあれば、簡単に登録できます。その後Webサイトを登録すれば、利用開始となります。Search ConsoleではAMPテストのほか、SEOに関連するさまざまな検証・解析ができるため、長期的に利用したい場合には登録してみてください。
2 ホームでAMPテストの対象となるWebサイトを選択
Search Consoleでは、複数のWebサイトが登録できます。そのため複数のWebサイトを登録している場合は、まずホームからAMPテストの対象となるWebサイトを選択しましょう。
3 検索の見え方>Accelerated Mobile Pages(新・AMPステータス)を選択
左メニューバーにある「検索の見え方」から「Accelerated Mobile Pages(新・AMPステータス)」を選択します。特定のAMPページの入力は必要なく、対象Webサイト内の全てのAMPページが検証されます。
4 AMPページのエラー有無を確認
エラーとなるAMPページがある場合は、「重大な問題のあるAMPページ」に数字が表示されます。反対に全てのAMPページが正常であれば「インデックスに登録されたAMPページ数」に対象のAMPページ数が表示されます。エラーページがある場合は問題点を確認し、再度AMPテストを実施しましょう。
3.デベロッパーツール
デベロッパーツールは、Chromeに搭載されているAMP HTMLのページソースが確認できるツールです。Chromeに標準搭載されているため、新規でインストールする必要なく手軽に利用できます。
デベロッパーツールの使い方
1 | Chromeツールバーの1番右にある設定画面を開く |
---|---|
2 | 「その他ツール」から「デベロッパー」ツールを起動 |
3 | 対象となるAMPページを開き「Console」を選択 |
4 | AMPページのエラー有無を確認 |
1 Chromeツールバーの1番右にある設定画面を開く
Chromeを使用している場合は、ツールバーの1番右にある3本バーで設定画面を開きます。
2 「その他ツール」から「デベロッパー」ツールを起動
設定画面の下から4番目「その他ツール」を選択し、1番下にある「デベロッパーツール」を起動します。設定画面を開かなくとも、ショートカットで起動することも可能です。
Windows | Ctrl+Shift+i |
---|---|
Mac | Command+Opt+i |
3 対象となるAMPページを開き「Console」を選択
デベロッパーツールを起動すると、ページソースが表示されます。最初の表示画面は「elements」になっているため、その隣にある「Console」を選択しましょう。
4 AMPページのエラー有無を確認
AMPページが正常であれば1行目に「Powered by AMP」の表示が出ます。エラーがある場合はエラー表示が出るため、エラー内容に沿って修正しましょう。
4.AMP Validator
AMP Validatorは、AMPプロジェクトが提供するAMPテストツールです。Chrome版とWeb版があるため、ブラウザに合わせて利用できます。Chrome版は拡張機能となるため、Chromeウェブストアからインストールしましょう。Web版は下記URLからアクセスし、AMPページのURLを入力することで利用できます。
ここではChrome版のAMP Validatorの使い方をご紹介します。
AMP Validatorの使い方
1 | AMP Validatorへアクセス |
---|---|
2 | 対象AMPページのURLにアクセス |
3 | AMPページのステータスを確認 |
4 | エラー内容に沿って修正 |
1 AMP Validatorへアクセス
ChromeでAMP Validatorをインストールしたら、メニューバーからAMP Validator選択します。
2 対象AMPページのURLにアクセス
テスト対象のAMPページのURLを入力しアクセスしましょう。
3 AMPページのステータスを確認
テストが実行されると、AMPページのステータスを表す以下4つのアイコンが表示されます。
・青:AMP対応
・緑:AMP HTMLが有効/警告ありの場合はその数が表示
・赤:エラーあり/エラー数が表示
AMPページに異常がなければ、赤色のアイコンにはエラー数が表示されません。
4 エラー内容に沿って修正
赤色のアイコンに数字が表示されている場合は、アイコンをクリックしエラー内容を確認します。行数とエラー内容が表示されるため、指摘内容に基づいて修正しましょう。
AMP導入時には要確認!AMPテストで実装状況を確認しましょう
WebサイトのAMP化は、SEOの面でも重要な施策です。AMPページは通常ページとは異なるソースで作成されることから、ページ公開前は正常に実装されているかを確認する必要があります。AMPテストツールはどれも無料で利用でき、修正内容まで指摘してくれるため利便性が高い点も特徴です。AMPページの効果を十分に発揮させるためにも、AMPテストは怠らずにしっかりと行いましょう。
SEOに関するご相談があれば、ぜひipe(アイプ)へご相談ください。