モバイルページの読み込みを高速化するAMPとは？メリット・デメリット、対応方法を解説

2016年、Google はモバイル向けページの読み込み速度を改善するためのソリューションを公開しました。

「Accelerated Mobile Pages（AMP）」と呼ばれるこの技術を利用すると、ウェブページを1秒未満で読み込めるほか、使用するデータ量を通常の1/10未満に抑えることができます（英語）。

一方、AMPをめぐる環境は常に変化しており、2022年6月現在までに大きく以下のような変更がありました。

2021年4月には、検索結果ページにて、どのサイトでもカルーセル表示が可能に。それまではAMP対応ページのみがカルーセル表示可能だったため、AMP対応が必須ではなくなりました。

また、検索結果ページでAMP対応ページの横についていた稲妻型のバッジアイコンが、同年6月以降から表示されなくなっています。

このように、当初と比べるとそれほど優遇されなくなっているAMPですが、モバイルページ高速化によりユーザビリティの向上が期待できるなどのメリットもあります。

導入にはデメリットもあるため、この記事でぜひ確認し、自社のウェブサイトで対応するべきかどうかを判断しましょう。

AMP（Accelerated Mobile Pages）は、モバイルでのウェブページの読み込みを高速化する技術です。この技術を利用して作成したウェブページなら、スマートフォンでもほぼ一瞬で読み込めます。

AMPページを作成するには、AMPの基準に準拠したページを別途用意する必要があります。

これが完了すると、AMPサイト用のURL（site.com/page/ampなど）が設定され、Chrome、Firefox、Safariなどの主要なウェブブラウザーで表示できるようになります。

AMPの仕様に沿って作成されたWebページは、世界中にあるGoogle のサーバーにキャッシュされます。

ユーザーが検索結果からAMPページにアクセスすると、キャッシュされたページを読み込むため、ページが高速に表示されるようになります。
 

AMPの目的は、コンテンツの表示速度を早めることで、スマートフォンなどモバイルデバイスでのインターネット体験を改善することです。

それでは、実際にどのような仕組みでページ表示速度を向上させているのでしょうか。

AMPでは、コンテンツに含めることのできる情報やプログラムを制限することでページ表示の高速化を実現しています。

例えば、通常のHTMLで使用されるタグの中には、AMPには利用できないタグがいくつも存在しています。

また、サイトに表示される画像サイズを固定することも表示速度の高速化の一助となっています。

Google では、「Google 検索でのAMPに関するガイドライン」を公開しています。下記URLから参照可能ですので、AMPの導入を検討する際にはぜひ参照してください。

Google 検索での AMP に関するガイドライン - Search Console ヘルプ
 

AMPの導入にはメリットとデメリットがあります。SEOに影響があるかどうかも気になるところです。

自サイトで対応するかどうかを判断するために、しっかりと確認しましょう。
 

ページ表示速度の向上

AMPページの最大のメリットは、主にモバイルにおけるWebページの表示スピードの向上です。

従来のサイトに比べて短時間でコンテンツが表示されることで、ユーザーの利便性や快適さが向上されます。コンテンツ表示前の離脱を防ぐことができますし、ユーザーの満足度向上にも大きく貢献してくれます。

Google では検索順位に対し、AMPページの有無は影響がないと発表しています。一方で、ページの表示スピードに影響を及ぼすことは事実です。
 

検索結果でカルーセル表示が可能

さらに、AMPの仕組みを利用して独自のストーリーを作成し、カルーセルやグリッドビューなどで表示させることができる「ウェブストーリー（Web Stoies）」も利用できます。ストーリーでは、写真やテキストで作られたページを、雑誌をめくるように閲覧することができます。

ウェブストーリーの表示箇所も、モバイル検索結果画面などユーザーの注目度が高い箇所に設定されており、影響力は大きいと言えそうです。
 

AMP対応のデメリットは？

表示できる広告が制限される

AMPページでは、限られた広告しか表示できません。広告の種類によってはAMPページだと全く表示されない場合もあるため、広告収益に影響を及ぼす可能性が高くなります。

実際、AMP導入後、収益が下がったと報告するメディアが多数出ています。
 

AMPページではデザインがシンプルになる

AMPは表示速度を上げるため、利用できるJavaScriptやHTMLタグが制限されています。そのため、元ページよりも表示できるデザインがシンプルになるケースがほとんどです。
 

AMP仕様に従った別ページを制作するのに手間がかかる

AMPページを用意するには、AMPの仕様に従い、通常のページとは別のHTMLページを用意する必要があります。

HTMLタグや動作可能なJavaScriptに制限があるため、仕様を公式ドキュメントで確認したり、テストを行ったりするなど、制作には一定のコストがかかります。
 

AMPの導入方法を大枠で説明すると、AMP対応にしたいページと同じページをもう1つ用意し、そこにAMPページであることを示すHTMLコードを入れ、元のページとAMPページ双方にリンクを張ることで完了します。

AMP対応はHTMLを手動で変更する作業となるため、自社で行うのは困難でしょう。社内に専門的な知識を持った人がいなければ、専門業者に相談するのが得策です。

WordPressなどのCMSでウェブサイトを構築している場合は、プラグインで簡単にAMP対応ができることがあります。

ただし、プラグインではすべてのページでAMPの厳しい条件をクリアすることは難しく、表示が崩れてしまう可能性もあります。
 

モバイルでのページ読み込み時間の短縮は、ユーザビリティ・SEOの両面において重要度を増しています。
その点で、AMPは非常に有用な機能だと言えますが、先述した通り実装した際のデメリットも少なからず存在します。

「そもそも、自社ウェブサイトの表示速度改善にしっかり取り組んでいる」「デザイン性を重視している」「記事に設置している広告からの収益が大きい」などの場合は、無理にAMP対応する必要はないかもしれません。

ユーザビリティ向上のためにAMPを導入するべきか否か。自社のウェブサイトの状況やリソースを考慮した上で判断しましょう。