AMPとは？仕組みとSEO効果・実装する際の注意点などを徹底解説

AMPとは、Webページを高速表示するためのフレームワークです。具体的にはブラウザに保存されたキャッシュを活用して、読み込み速度を短縮化します。

表示までの待ち時間が少なくなりユーザーの利便性が増すだけでなく、SEOにも有効です。今回はSMPの仕組みやSEO効果、実装方法や注意点などを解説します。

もしSEO対策の基本から対策方法まで全て詳しく知りたい場合は「SEO対策とは？検索上位表示を狙う方法まとめ！」の記事でSEO対策の情報をまとめているので参考にしてみてください。

AMPとは

Accelerated Mobile Pagesの略で、Webページを高速表示させるためのフレームワークを指します。

クローラー（Web上の文章や画像などのデータを取得するロボット）がページを読み込む際にGoogleのキャッシュを使用できるので、HTML・画像・動画を一からダウンロードする手間が省け、表示速度が高速化します。

読み込みスピードが速いとユーザーはストレスを感じにくいです。また高速化されたページはGoogleが良いページだと判断するので、SEO的にも有利に働きます。

仕組み

AMPページが通常のWebページと比較して表示速度が速いのは、あらかじめGoogleやTwitterが取得したキャッシュを利用できるからです。

通常はユーザーが見たいと思うページをクリックするとページ内に含まれるHTML・画像・動画のデータを読み込んだ後に反映します。コンテンツがなかなか表示されない場合、HTMLが複雑だったり、画像や動画が多かったりしているため読み込みに時間を要します。

しかしキャッシュを利用すると、端末に保存された情報を使用できるため、はじめからWebページのデータを読み込む必要がありません。データをゼロからダウンロードする場合と比較して、キャッシュを読み取る速度の方が速いため、AMPページは表示速度が上がります。

AMPを導入するには、通常のHTMLと異なる仕様のAMP HTMLを記述しなくてはなりません。一つのコンテンツにつきページが二つ必要になります。また構造化データの記述が必須となるのも注意が必要です。

SEO効果

AMPの導入によってWebページの表示速度を高速化すると、SEO効果（検索順位の改善）が見込めます。Googleはユーザーファーストの観点から、表示速度が遅いWebサイトやページを高く評価していません。表示までに時間を要すると、ユーザーの直帰率や離脱率が悪化してしまいます。

AMPは、近年SEO対策で重要度を増しつつあるモバイルフレンドリーと親和性が高い施策ともいえます。そもそもAMPはモバイル向けサイトの読み込み速度を高速化し、ユーザーの利便性を増すことを目的に始まった施策だからです。

スマートフォンでWebサイトをクリックしたときに読み込みまで時間がかかり、待ちきれず別のページへの移行や検索行動をストップした経験を持つ方もいるでしょう。パソコンと比較して、スマートフォンでWebページを開く場合、より読み込みに時間を要する傾向があります。

AMPはWebサイトを運営するなら確実に対応しておくべきフレームワークです。

AMPを導入したことによるメリット

AMPの導入によって、読み込み速度や表示速度が改善します。Googleは読み込みがスピーディーなWebサイトを価値があると評価するので、検索順位の改善にも効果を示すと考えられます。

また構造化データを実装し、特定の検索機能に対応することで、新たな検索流入も期待できます。

ページの表示速度を上げられる

AMP導入の直接的なメリットは、ページをクリックした後にすぐコンテンツが表示されるようになる点です。待ち時間によるストレスを極力抑えられるため、快適に欲しい情報に辿りつくようになるでしょう。

表示速度が速いとそれだけ「使いやすい！便利だ」と感じるので、ユーザーの利便性が大きく向上します。Webサイト内の他ページへも遷移しやすく、滞在時間の長期化や回遊率の上昇を期待できます。

利用者からの評価が高まると上位表示の可能性も高まり、間接的にコンバージョン率の向上やサイト改善といった期待も持てるでしょう。

検索順位を上げられる可能性がある

速度の向上によって、検索順位が上昇する可能性を高めます。読み込み速度が速いページとしてGoogleから高評価をもらい、順位アップに寄与するという仕組みです。

Googleは「ユーザーに焦点を絞れば、他のものはみな後からついてくる」と述べており、ユーザーファーストの理念を掲げています。

SEO的にもユーザーにとって便利、かつ快適なWebサイトを高く評価します。読み込みスピードが速いサイトは利便性が高いといえるので、ユーザーにとって良いコンテンツだと評価し、上位表示しやすくなるのです。

新たな検索流入を増やせる

AMPの導入によって、カルーセルやリッチリザルトなど特定の検索機能へ対応させることができ、検索流入の入り口を増やせます。

カルーセルとは、回転台・回転木馬・回転コンベアの意味を持つ言葉です。ページにおいては画像コンテンツを左右に切り替えて表示する仕組みを指しています。

訴求力のある部分に複数の情報を提示できるようになるので、特に表示範囲が狭いスマートフォン向けサイトで効果を発揮します。

リッチリザルトは検索結果の画面により多くの情報を載せるための機能です。通常の検索結果ではタイトル・URL・強調スニペットなどが掲載されますが、これらの情報はユーザーにとって不十分だと判断した場合に表示されます。

リッチリザルトの代表例に挙げられるのは、検索KWに関する「よくある質問とその回答」です。カルーセルやリッチリザルトなどの検索機能によって、露出頻度が高まり、Web上での存在感を増すことにつながります。

構造化データのマークアップが必要ですが、検索流入を期待する方は実装しておいて損はないでしょう。HTMLファイルに直接、構造化データ専用のコードを記述することで導入できます。

AMPを導入したことによるデメリット

AMPの導入によってWebサイトの表示速度が早くなる反面、意図しないデザインの変更や管理の負担増大などのデメリットが発生します。

デザインを簡素にして読み込みスピードを高めようとするので、今まで表示されていた画像や動画などがなくなり、見た目に大きな変化を及ぼす可能性があるのです。

また、通常ページ以外にAMP用のプログラミング言語で記述した管理ページが必要です。単純に考えてページ数が2倍に増えるので、管理の負担が増える可能性は高いです。サイト構造によってはAMP化がうまくいかない恐れもあります。

元のページとのデザインが異なってしまう恐れがある

AMPを導入すると、デザインが元のページからガラッと変わってしまう恐れがあります。具体的には画像デザインをできる限りシンプルにして表示速度を高める方法なので、実装後に別のサイトかと見間違うほど変化が生じる危険があります。

特に動的なコンテンツを作成する際に用いるJavaScriptは、AMP化されたWebサイトでは使用できません。すでにJavaScriptを導入している場合、実装には要注意です。

基本的にコンテンツの内容がテキスト中心であればさほど影響はないと考えられますが、ページデザインにこだわる場合、AMP導入を考える際は注意が必要です。

AMP専用ページを作成する必要がある

AMP専用のHTMLで記述したページのほかに正規ページも必要になります。管理するページが増えるので、運用の手間が大きくなりやすいことに注意しましょう。

AMPページはページごとに作成するのでWebサイト内に多数のコンテンツがあるほど、管理の負担が膨れ上がります。現状の体制で運用を続けることに限界を感じたら人を雇う必要があり、新たに人件費の負担も伴います。

できるだけ効率的に管理したい方は、WordPressによるサイト構築がおすすめです。プラグインの導入によってHTMLを記述する手間を省けるだけでなく、ページごとにAMP化の切り替えが簡単になるため、運用の手間が大きく軽減します。

サイトの構築状況によっては上手くAMP化できない恐れがある

サイトの構築状況によってはAMPテストでエラーが出てしまい、スムーズに移行できない恐れがあります。AMPの導入方法はサイト構造ごとに異なるのでWebサイトによってはエラーが頻発し、修正に多くの工数が生じる場合があるのです。

AMP化に成功しているか確認するツールは、chromeデベロッパーのコンソール機能・AMPテストツール・サーチコンソール上のAccelerated Mobile Pagesなどが挙げられます。エラーメッセージが出ても修正箇所や改善方法も教えてくれるので、焦る必要はありません。

AMPに対応したページを作成する方法

専用のプログラミング言語を用いて、AMP対応のページを作成する手順を具体的に解説します。ちなみにWordPressを使用したサイトの場合、MPプラグインをインストールすれば簡単にAMP対応ページを作成できます。

AMP HTMLを宣言する

通常のHTML5と同様、HTMLタグの前にDOCTYPE宣言を行い、「!DOCTYPE」を記述してください。「!DOCTYPE」は正確にはHTMLタグとは異なりますが、HTML文書を作成する際、最上部に書くべき定型文句です。

Webブラウザの多くはDOCTYPE宣言の有無に応じて、標準準拠モードや互換モードというように文書の表示方法が異なるため、「DOCTYPEスイッチ」と呼ぶ場合もあります。

通常のHTML5と同じく、ヘッダ情報を記述するheadタグと本文を書き入れるbodyタグが必須です。headタグやbodyタグがないと他に問題がなくても文書が表示されなくなってしまうため、忘れないよう注意しましょう。

AMP対応ページの場合、GoogleにAMPコンテンツと認識させるために「html amp lang=”ja”」と記述します。「amp」の部分は「⚡」（カミナリマーク）で置き換えることが可能です。

ちなみにAMP対応ページはスマホでGoogle検索したときに、灰色のカミナリマークが表示されます。

meta要素を記述する

meta要素として、「UTF-8」および「viewport」を指定しましょう。UTF-8は文字コードのひとつで、世界中の言語を取り扱える守備範囲の広さが特徴です。

Webサイトの場合、日本語・アルファベット・数字が混在するケースが頻繁にあるので、AMP対応ページに限らず、文字コードにはUTF-8が適しています。

Viewportは一言でいえば表示領域で、端末画面の幅に合わせたり自ら領域の幅を指定したりすることが可能です。Googleも推奨している端末画面の幅に合わせるための記述は「meta name=”viewport” content=”width=device-width,initial-scale=1″」です。

application/ld+jsonを指定する

構造化マークアップとして、「application/ld+json」を記述する必要があります。構造化マークアップを使用すると、検索エンジンのページに対する理解度を向上させられます。

その結果としてリッチリザルトやよくある質問への表示など、検索結果画面でよりユーザーの目を惹くことが可能です。流入経路が増えたため検索順位の向上をもたらす場合もあります。

構造化データを記述したAMPページはテキストだけでなく、画像やページのロゴなども検索結果に表示できます。ただしマークアップすれば確実に画像付きになるとは限りません。

構造化マークアップの方法にはいくつかありますが、Google推奨のJSON-LDの使用がおすすめです。JSON-LDの場合、構造化データをすべて中括弧の内部に入れ込みます。

AMP用のJSライブラリを記述する

AMP化ページを正確に表示するために、AMP用のJSライブラリを記述します。JSライブラリの記述をしないと速度以前にページがきちんと表示されない恐れもあるため、AMP化には必須の情報です。

記述内容は「<script async src=”https://cdn.ampproject.org/v0.js”></script>」です。記述する場所はheadタグの最後です。JSライブラリの「JS」とは、動的なWebページの作成に使用するJavaScriptのことです。

JSライブラリの内容によっては、データをすべて組み合わせてブラウザのウィンドウにページ内容を描画するレンダリングという工程において、表示速度に遅延を生じさせる恐れがあります。

AMP用のJSライブラリでは、HTMLやCSS、画像データの読み込み速度に影響を出さないために、非同期のJavaScriptだけしか許可されていないのが特徴です。

canonicalタグを指定する

canonicalタグはWebサイト内に重複・類似したページがある場合に、正規のURLがどれか検索エンジンに伝えるためのHTMLタグです。

AMPを導入する場合、AMP対応ページとは別に通常のHTML言語で記述したページが必要です。つまり必然的に似たコンテンツが出来上がってしまうわけです。

AMP化においてcanonicalタグを指定しないと、重複コンテンツとしてGoogleのペナルティを受ける危険があります。AMPを導入する場合、カノニカル設定は必須です。記述内容は「<link rel=”canonical” href=”ページのURL”>」です。

AMP化していない元のページにアノテーションタグ（link rel=”amphtml” ）を付けることも忘れないようにしましょう。アノテーションタグによって、AMPページをGoogleが発見しやすくなるからです。

amp-boilerplate要素を指定する

AMP HTMLの場合、amp-boilerplate要素（AMPボイラープレートコード）の指定が必須です。Boilerplateは日本語で一般的な表現や定型文といった意味を持つ英単語であり、AMPを導入するなら必ず入れなくてはいけません。

効果としてはJSライブラリの読み込み中の一定時間にわたり、コンテンツを非表示にできるため高速表示が可能です。amp-boilerplate要素を記述しないと、せっかくのAMPも存分に効果を発揮しなくなります。

AMPの有効性を確認する方法

AMPの有効性を確認できるツールの種類は次の通りです。

• AMPテスト
• Google Search Console
• デベロッパーツール

AMPテストはGoogleが提供しているツールで、URLを入力するだけでチェック可能です。「有効なAMPページです」という文言が出れば、検索結果に設定したページが問題なく表示されます。

「有効なAMPページではありません」と出た場合は必要な修正を施し、有効性が確認できるまでチェックを続けてください。

デベロッパーツールはChromeに搭載されたAMPテスト機能です。ツールを導入せずページにアクセスするだけでAMPチェックを終わらせられるのが特徴です。Chromeデベロッパーのコンソール機能や拡張アドオンのAMP Validatorを使用します。

アクセス解析ツールのGoogle Search Consoleでも、Accelerated Mobile Pages機能を用いることでAMPページの状態がわかります。

構造化データをマークアップしている方は、別途、マークアップ内容が適切か検証が必要です。Googleは構造化データのチェックに必要なツールとして「リッチリザルトテスト（RTT）」と「Schema Markup Validator」を提供しています。

RTTはリッチリザルトに表示される構造化データしか対応していません。一方でSMVはリッチリザルトにかかわらず構造化データの正しさをチェックできます。

AMPを実装する際の注意点

AMPを導入する前に注意してほしいのが、そのWebサイトがAMPに適しているのか確かめることです。AMPはすべてのサイトに適用すべき万能なフレームワークではないからです。

またGoogleは以前までAMP化したページに優遇措置を取っていましたが、AMPには従前ほどのメリットはありません。ここではAMPに向いていないサイトとはどんなものか、優遇措置の終了によって何が変化したのか解説します。

AMP化に向いているサイトと向いていないサイトがある

すべてのページがAMP化に適しているわけではありません。一例を挙げると情報の更新頻度が高いWebサイトはAMP化すべきでないと考えられています。理由は日々更新されるのでキャッシュの活用が難しく、毎回一から読み込む必要に迫られるためです。

たとえば不動産情報サイトや求人情報サイトなどが該当します。こうしたWebサイトで高速表示を実現したい場合、AMP実装以外の方法を推奨します。

またデザインが崩れる危険があるため、画像中心のコンテンツやデザインにこだわりがあるページにも不向きです。複雑なコードを多用しているページはAMP化によって正しく表示されない危険が高いです。

逆に導入をおすすめしたいのが文章コンテンツ中心のWebサイトです。レイアウト崩れのリスクを抑えて高速表示を実現できるため、実装しておいて損はないでしょう。

ほかにもコーディングの負担が大きくない場合や、AMPプラグインの導入だけで実装できるWordpressサイトのケースも導入を推奨します。

GoogleによるAMPの優遇措置は終了している

Googleは以前までAMP化したページに次に掲げる優遇措置を行っていました。

• GoogleニュースにAMP化を示すカミナリマークを表示
• モバイルの検索結果画面の上部に表示されるトップニュースに掲載されるのはAMP化されたページのみ

2021年4月に上記の優遇措置を終了すると公表し、現在は撤廃されています。Googleニュースからカミナリマークは外れ、AMP化したページもそうでないページもすべて平等にトップニュース枠に表示されるよう変化しました。

したがって、依然と比べてAMP化による恩恵は少なくなったのです。とはいえ、動作が早いページがユーザーの利便性に貢献します。離脱率の低下や滞在時間の長期化も期待できるため、AMP化の価値は変わらず高いです。

新たな方針ページエクスペリエンスとは

優遇措置が終了したAMPに代わって、Googleが新たな基準として重視すると明らかにしたのがページエクスペリエンスです。

ページエクスペリエンスとは、提供する情報の価値以外の部分でユーザーエクスペリエンスの尺度となるシグナルのことです。ページエクスペリエンスが含む代表的なシグナルは次の通りです。

• LCP（読み込みパフォーマンスの尺度）
• FID（インタラクティブ性の尺度）
• CLS（視覚的安定性の尺度）

LCPはLargest Contentful Paintの略で、ユーザーがあるページにアクセスしたときにそのページが表示され終わったと感じるタイミングを指します。

FIDはFirst Input Delayの略で、ユーザーがあるページ上で動作を行った際、実行までにどれだけ待つか示した指標です。CLSはCumulative Layout Shifの略で、アクセスしたあるページにレイアウトの崩れがどの程度発生しているか表しています。

表示や実行までに時間がかかると、ユーザーはストレスを感じやすくなります。またレイアウトにずれが生じると良好なユーザー体験を阻害してしまうため、Webに関する主な指標に掲げた3つはサイト評価の重要な基準です。

LCPやFIDの改善にはJavaScriptやCSSを最小化したり、CLSの場合は画像や動画のwidth・heightを明示したりする取り組みが有効です。

AMP化の優遇措置が終了したからといって、ページの表示速度は軽視して良いわけではありません。読み込みスピードが遅いだけで、ユーザーの離脱を招くケースは少なくないためです。ページエクスペリエンスは今後さらに重要性が増す可能性があります。

AMPについてSEO専門家の見解

AMPを知る際には、同時にCDNについても知っておくべきでしょう。
どちらもサイトの表示速度を向上させるための方法です。
AMPは、AMPページを作成することで、モバイル端末の表示速度を上げる技術です。
CDNはコンテンツを複数のサーバーに分散しては配信することで、表示速度を上げる技術です。AMPと異なり、PCでもモバイル端末でも表示速度を上げることができます。

どちらが良いということはありませんが、CDNは「Amazon CloudFront」などの、CDNサービスプロバイダーと契約して設定する必要があります。
一方で、AMPページはAMPフレームワークを利用して、無料で作成できるので、AMPの方が導入しやすいです。

サイトの表示速度を高めることで、ユーザエクスペリエンスが向上し、コンバージョン率の向上や、間接的なSEO評価の向上を期待できます。

ただ、まずは「画像のファイルサイズの削減」や「不要なJavaScriptの削除」など、簡単な方法をおすすめします。

まとめ

AMP化によって高速表示が可能になったページはSEO効果や検索流入の拡大なども期待できます。AMP用のHTMLを記述する必要がある、サイトの構造によってはうまく表示されない恐れもあるなどデメリットも存在しますが、ユーザーの利便性が向上するので実装して損はない施策です。

ただし、GoogleによるAMPに対する優遇措置はすでに終了したことは知っておきましょう。Googleの評価基準はページエクスペリエンスという新たな指標に移りつつあります。高速表示には目を向けながらも、トレンドや今後の動向に注目してください。

この記事の監修者が手掛けたSEO記事一覧

記事タイトル	記事の内容
・SEO対策とは？検索上位表示を狙う方法まとめ！	SEOの基本から、おこなうべきSEO対策など、SEOについて総合的に解説しています。
・いきなりGoogleの検索順位が下がったのは何故！原因と対策方法をご紹介	検索順位が下がってしまった原因とその対処法を紹介しています。
・【メディア運営者が教える】ChatGPTでSEOに強い記事を作成する方法！	ChatGPTでSEOに強い記事を作成する方法を、実際に利用している経験からアドバイス。
・SEOライティングのコツ10選！SEO初心者が意識すべきポイントもご紹介	初心者でも読むだけでSEOに強い記事をかける、ライティングのコツを解説しています。
・【2023年最新版】SEO外部対策とは？ポイントや注意点を解説！	SEO外部対策の効果や、おすすめの外部対策方法を解説しています。
・ 上位表示されやすいロングテールキーワードのSEO対策方法をご紹介！	ロングテールキーワードでのSEO対策方法や、ロングテールSEOの成功事例を解説しています。
・内部リンクとは？SEO効果と設置の際のポイントを解説	内部リンクのSEO効果と、正しい設置方法を解説しています。
・Googleペナルティのチェック方法！対策法も詳しく解説	SEOでGoogleペナルティの対象になる原因と、ペナルティ解除方法を解説しています。
・記事外注で後悔しない！おすすめの記事代行サービス12選と発注前の準備	失敗しない記事外注のコツと、記事代行サービスをご紹介しています。
・コンテンツSEOとは？メリットやデメリット、成功事例など	コンテンツSEOの方法と、成功事例などをご紹介しています。
・ローカルSEOとは？ローカルSEOの種類や対策方法などを解説	ローカルSEOの対策方法を詳しく解説しています。
・【2023年最新版】SEOの内部対策は何をするべき？対策方法を解説	おこなうべきSEO内部対策を解説！内部対策チェックリストも有ります。
・SEO対策にかかる費用は？依頼先の選び方も紹介	SEO対策を業者に依頼する場合の費用を対策内容別に解説しています。
・相互リンクにSEO効果はある？相互リンクのやり方と注意点を徹底解説	危険な相互リンク・安全な相互リンクを解説しています。
・被リンクのSEO効果は？良質な被リンクの獲得方法や悪質な被リンクの防ぎ方	被リンクのSEO効果や、おすすめの被リンク対策をご紹介しています。
・ホワイトハットSEOのやり方を解説！ブラックハットSEOとの違いは？	ホワイトハットSEOの内容とやり方を解説しています。
・11サイトのSEO成功事例とSEOを成功させるための大切なポイント	SEOで成功しているサイトの事例を紹介！SEOで成功するポイントも解説しています。
・SEOコンサルとは？実績のあるSEOコンサルティング会社15選を紹介	SEOコンサルティングの内容と、依頼した場合の費用などを解説しています。
・SEOに強いディレクトリ構造の作り方！正しい階層の設定方法	SEOに効果的なディレクトリ構造の整え方を解説しています。
・失敗しないSEO会社の選び方や注意点・悪質業者を見分けるコツ	失敗しないSEO会社の選び方や、悪質なSEO会社の見分け方を解説しています。
・競合分析がSEOで重要な理由は？競合調査する方法やコツをご紹介	SEO専門会社が実際におこなっているSEOの競合分析方法をご紹介しています。
・コーポレートサイトのSEO対策のコツを紹介！自社サイトの検索順位の上げ方	コーポレートサイトのSEO対策方法を詳しく解説しています。
・【Google公式情報あり】SEOのE-E-A-Tとは？重要性と対策を解説	E-E-A-T評価についてGoogleのガイドラインを基に詳しく解説しています。
・Googleが推奨するSEO対策とは？Google公式の見解をご紹介！	Google公式が発表しているSEOのガイドラインを基に、Googleが推奨しているSEO対策を解説しています。
・コンテンツマーケティングとは？内容と取り組み方、成功事例を紹介	コンテンツマーケティングのやり方や実例をご紹介します。
・逆SEOとは？利用目的と手法・被害に遭った際の対処法も解説	正しい逆SEOのやり方、攻撃的逆SEOを受けた際の対処法などをご紹介します。