AMPとPWAのガイド

公開: 2021-03-01

AMPとPWAは、今後1年間で最も議論されるコンテンツマーケティングトピックの2つになるはずです。このガイドでは、AMPとPWAの簡潔な定義や、それらを使用してコンテンツを配信する方法など、両方に関する重要な情報を提供します。また、特にSEOに関して、マーケティング目標の達成を支援するためにAMPとPWAを使用できる明確な方法についても説明します。

AMPプロジェクト（Accelerated Mobile Pages Project）とは何ですか？

AMPは、加速されたモバイルページの略であり、基本的に、それがあなたに与えるものです。

AMPページは、オンライン記事など、既存のウェブページと基本的に同じコンテンツを配信します。コンテンツは、HTMLとCSSの単純な要素を組み合わせ、JavaScriptの使用を制限する、AMPHTMLと呼ばれる独自の言語に基づいた簡略化された形式でモバイルユーザーに配信されます。これは、AMPページが通常ベースになっている元のウェブページよりもはるかに速く読み込まれることを意味します。

モバイル検索ユーザーは、Googleが検索結果でウェブページのAMPバージョンの配信を開始した2016年2月に初めてAMPコンテンツにアクセスできるようになりました。執筆時点では、モバイル検索結果ページ内のAMPコンテンツは、カルーセル形式と特集記事形式の両方で配信されており、いずれの場合も、ユーザーは複数のソースから関連するコンテンツをスワイプできます。コンテンツはGoogle検索結果に表示され、AMPアイコンが青い円の中に白い稲妻として描かれています。

Google AMP検索機能での配信に適したAMPコンテンツを作成する最も簡単な方法は、既存のコンテンツのHTMLをAMP HTMLに編集してから、ページを検証して検出できるように準備することです。 Amp.devは、HTMLページをAMPHTMLページに変換する方法に関する簡単なチュートリアルを開発者に提供します。

AMPページは、ほとんどの場合、他のページと正規に関連付けられています。これは、URLに「正規の」relタグがあり、検索エンジンにページがWebサイトのページと同じであることを通知することを意味します。ページの非AMPバージョンは、SEOの観点から優位性があります。

このルールには重要な例外があり、現在一部のオンラインパブリッシャーによって作成されているAMPのみのWebサイトの形式です。

Googleウェブマスタートレンドアナリストのジョンミューラーは、ウェブマスターに、AMPのみのウェブサイトは良いことだとアドバイスしています。

「AMPのみのサイトの使用に問題はありません。高速サイトを比較的簡単に作成するための優れたフレームワークです。 基本的にHTMLであるため、他のHTMLページと同じように機能します。 より多くのAMPのみのサイトがポップアップするのを見るのは素晴らしいことです。コンテンツごとに単一のURLがあるだけで、物事が非常に簡単になります（クロール、インデックス作成、およびSEO全般）。」

独自のAMPのみのサイトをテストする場合は、WordPressで設定し、AMP for WP – AcceleratedMobilePagesプラグインを使用することをお勧めします。

AMPは進行中のオープンソースプロジェクトであり、電子メールや広告、およびWebコンテンツにアプリケーションが含まれています。プロジェクトに関する完全で最新の情報については、Amp.devにアクセスしてください。

PWAとは何ですか、なぜそれらを使い始める必要がありますか？

プログレッシブウェブアプリ（PWA）は、主にネイティブアプリで従来から見られる機能とユーザーエクスペリエンス（UX）要素でウェブページを補強するウェブアプリです。つまり、Webコンテンツをアプリコンテンツのように動作させます。

PWAのユーザーエクスペリエンスには、次の手順があります。

ユーザーはモバイルデバイスを介してPWAページを開きます。通常のWebページのように機能します。
ユーザーは、デバイスのホーム画面にページを追加するように求めるプロンプトを受け取ります。
ユーザーはプロンプトを受け入れます。その後、ページが表示され、ホーム画面にアプリとして機能します。
ウェブサイト/PWAの進行中のUXには、ネイティブアプリのUXに特有の要素があります。

WebコンテンツをPWAに変換することは、Web開発者の仕事であり、HTMLとJavaScriptの能力が必要です。

Googleには、「ベースライン」PWAまたは「模範」PWAを構成するものに関する広範な基準があります。

ベースラインPWA：

HTTPS経由で提供
タブレットやモバイルデバイスで応答します
すべてオフラインで読み込まれるURLが含まれている
「ホーム画面に追加」のメタデータを提供する
3Gでも高速ロード
クロスブラウザで動作する（Chrome、Edge、Firefox、Safariを含む）
ページ間の高速遷移を提供します
各ページに専用のURLを用意する

これらの基準を満たすことは、PWA（またはPWAになる予定）の実行可能性とGoogleChromeでの潜在的なリーチにとって非常に重要です。

例示的なPWAの基準は、より詳細です。詳細については、Googleのプログレッシブウェブアプリのチェックリストをご覧ください。

PWAには多くの利点があります。最初のロード後、通常、ほとんどの従来のWebページよりも速くコンテンツをロードします。これにより、ユーザーが複数のコンテンツアイテムをナビゲートするときに、コンテンツの読み込みが遅いためにナビゲートする可能性のある時間枠が狭くなるため、ユーザーの注意を引くことができます。ユーザーに一連のコンテンツアイテムを連続して消費するように促したい場合は、PWAを介してそのコンテンツを配信するのが賢明です。

もう1つの重要な利点は、PWAがユーザーのモバイルデバイスのホーム画面でブランドに継続的な存在感を与えることができることです。多くのパブリッシャーが混雑したネイティブアプリ市場で競争するのに苦労しているため、この機会はタイムリーです。90日後のアプリの保持率は4％と低く、ユーザーはアプリ全体の使用時間の77％を上位3つのアプリに費やしています（出典：アプリのダウンロードと使用の統計（2019）–アプリのビジネス）。

PWAは、ユーザーがオフラインのときにコンテンツを読み込むことができるため、ジェットセッターや地方の読者をターゲットとするパブリッシャーにとって、ゲームチェンジャーになる可能性があります。

PWAの潜在的な欠点の1つは、Googleの検索結果でPWAが予期しないパフォーマンスを示す場合があることです。

Ignite Visibilityによると、SEOの目的でPWAによってコンテンツのインデックスを作成することを目的としたサイトは、「HTMLベースを持ち、その上にプログレッシブWebアプリをロードするか、prerender.ioやpushstateなどのツールを使用する」必要があります。

コミュニティ主導のウェブサイトPWAStatsは、Tinderの読み込み時間の短縮から、Best Westernの収益の増加まで、PWAへの切り替えを通じてブランドが生み出した結果に関する統計のライブリストを維持しています。

AMPとPWAの違いは何ですか？

AMPとPWAは同じ目的を果たすライバルテクノロジーであるという一般的な誤解があります。

両方のテクノロジーの重要な役割がユーザーのコンテンツをより速くロードすることであることは事実ですが、AMPとPWAには、マーケティング担当者の観点から、明確な長所、短所、および戦術的な用途があります。

AMPページは、最初のクリックで非常に高速な読み込み時間を提供します。これにより、読み込みが遅いためにユーザーがバウンスする可能性が低くなるため、新しい読者を引き付けるのに最適です。また、Googleの検索結果内で優れた発見性を備えています。ただし、AMPは、動的コンテンツやプッシュ通知などの高度なプラットフォーム機能をサポートしていません。

PWAページは、最初の読み込みでは比較的ゆっくりと読み込まれますが、2回目の読み込み以降は非常に速く読み込まれます。これにより、リーダーとコンテンツの間の継続的な関係において、読み込み時間が短縮され、バウンス率が低下します。さらに、PWAは、動的コンテンツ、オフラインブラウジング、プッシュ通知などの高度なプラットフォーム機能をサポートできるため、マーケターはユーザージャーニーに影響を与えてコンバージョンを増やすことができます。

オンラインパブリッシャーは、2つのテクノロジーを一緒に使用することにより、AMPとPWAの利点を組み合わせることができます。 Instapageは、PWAとAMPに関する記事でそのようなアプローチの1つを説明しています。

「AMPページをウェブサイトへのフックとして考えてください。瞬間的な負荷でユーザーを捕らえ、プログレッシブWebアプリケーションに巻き込みます。これにより、高速読み込みのAMPページを[..]動的PWAと組み合わせることができます。」

もう1つのオプションは、AMPページ内でPWA機能を有効にすることです。

または、AMPを使用してPWAを開発することもできます。この方法は、AMP HTMLでPWAを記述し、amp-install-serviceworkerというコンポーネントを使用して高度なPWA機能を有効にすることに基づいています。

SEOと検索ランキングには、AMPとPWAのどちらのオプションが適していますか？

私たちの見解では、AMPとPWAはどちらもSEOをさまざまな方法で支援するため、答えは両方とも少しです。

PWAは、サイトコンテンツをより魅力的にするため、ユーザーのコンテンツ消費レベルを高めることができます。一方、AMPは、モバイルページの読み込み速度を大幅に向上させることにより、バウンス率を低下させます。

どちらの場合も、主要なWebページのランキング要素に関するGoogleへのフィードバックが改善されています。これらの要素は、ページとそのドメインの検索ランキングと全体的な検索の可視性を決定する役割を果たします。

したがって、この記事の前のセクションで説明したように、SEOの観点からの最善のアプローチは、AMPとPWAを組み合わせて使用することです。

AMPを取り巻く論争について私が聞いたすべてのことは何ですか？

AMPがWebコンテンツを配布し、ロードを高速化するための強力なツールであることは間違いありませんが、プロジェクトを取り巻く大きな論争があることに注意する必要があります。

一部のコメンテーターは、AMPをGoogleがオンラインパブリッシャーのWebサイトを否定し、コンテンツを利用して、ユーザーをGoogle向けに最適化され、Google内に基づいたエクスペリエンスに固定する方法と見なしています。

TheRegisterのライターであるScottGilbertsonは、次のように述べています。

「それは本当にスピードではありません。独自の修正バージョンの標準を回避するものと同様に、それはロックインに関するものです。 Google AMPマークアップのページ数は、Google専用に最適化され、主にGoogleによってインデックスが作成され、主にGoogleユーザーに表示されるページ数を意味します。これは、Facebookのプラットフォームに匹敵するGoogleの試みです。はい、FacebookはAMPよりもはるかに劣っていますが、それではGoogleAMPは良い考えではありません。少なくともFacebookは、オープンなふりをしようとはしていません。」

さらに、AMPページは、発行者自身のURLと独自のブランドの要素なしで表示されるため、コンテンツと発行者の関連付けが効果的に解除されます。

おそらく、AMPの使用を支持する最も強力な議論は、出版社に対するものです。 TheGuardianやDailyMailのような主流のニュースプロバイダーから、WiredやSocial Media Todayのような特別な関心のある出版社まで、世界をリードするメディアコンテンツプロデューサーの多くがそれを使用しています。これは疑問を投げかけます：あなたの分野の主要な出版社がAMPを使用している場合、あなたの出版物は使用しない余裕がありますか？

AMPを取り巻く論争の詳細については、RavenToolsの共同創設者であるJonHenshawとのインタビューを特集した、高速Webサイトの構築方法に関するデジタルマーケティングポッドキャストのエピソードをご覧ください。

プログレッシブウェブアプリケーション（PWA）はアプリの未来ですか？

2019年12月、TechCrunchは、アプリストアパブリッシャーの上位1％が新規ダウンロードの80％を推進しているという驚くべき発見を報告しました。

これは、ユーザーのモバイルデバイスでの持続的なブランドプレゼンス、ユーザーエンゲージメントの向上、プラットフォームの所有権、完全な分析アクセス、そしておそらく最も重要な最適なモバイルなど、アプリがもたらすメリットにアクセスしたいデジタルパブリッシャーにとって暗い状況を描きます。 UX。

ネイティブアプリのダウンロード数が減少している状況に対して、PWAは、最大のオンラインパブリッシャーを除くすべての人がこれらのメリットにアクセスするための最善の方法を提供しているようです。彼らは、通常のWebページエクスペリエンス内でユーザーをアプリに移行する代わりに、Webユーザーがアプリマーケットプレイスからアプリをインストールすることを躊躇することを回避します。

ネイティブアプリは、グローバルなダウンロードと使用時間の点でまだ成長しており、その意味で、ネイティブアプリは間違いなくアプリの未来であり続けます。これには、成長が主要な出版社の強力な少数派によって推進されているという警告が伴います。

とはいえ、PWAは、モバイルコンテンツの消費の将来において大きな役割を果たす可能性があるようです。この分野では、PWAのUXの利点により、読者とパブリッシャーの間でテクノロジーの普及が促進される可能性があります。

結論：マーケターはAMPとPWAにどのように対応すべきですか？

コンテンツのパフォーマンスとUXの側面を改善するAMPとPWAの実証済みの可能性は、これらのテクノロジーがオンラインパブリッシャーが調査するための重要な手段であることを示唆しています。

AMPは、限られた規模でテストするのが2つのうち簡単です。いくつかのコンテンツページをAMP HTMLに変換し、結果を観察するだけです（GoogleがAMPパブリッシャーに提供する比較的限られた分析の範囲内で）。 PWAは、パブリッシャーが継続的にリーダーにアプリスタイルのエクスペリエンスを提供することを暗黙的に約束しているため、軽々しく行うべきではありません。

反対に、AMPと比較した場合、PWAは比較的希釈されていない利点を提供するようです。戻ってきた読者は、読み込み時間が短縮されるだけでなく、AMPに欠けている高度なアプリスタイルの機能を利用できます。重要なのは、発行者がコンテンツのより優れた制御と所有権を維持することです。

AMPとPWAを検討しているオンラインパブリッシャーへのアドバイスは、いくつかのコンテンツページでAMPをテストすることから始め、PWAを大規模に展開するオプションを徹底的に調査することです。単独で使用する場合でも、組み合わせて使用する場合でも、2つのテクノロジーは、モバイルユーザーが今後何年にもわたってWebコンテンツをどのように消費するかを理解しているようです。

今すぐ無料メンバーシップを取得-クレジットカードはまったく必要ありません

デジタルマーケティングツールキット
独占ライブビデオ学習セッション
デジタルマーケティングポッドキャストの完全なライブラリ
デジタルスキルベンチマークツール
無料のオンライントレーニングコース

無料会員