モバイルサイト上でネイティブアプリのようなUXを提供するPWAには、どのようなメリット、効果があるのでしょうか？「PWAがいまいちどんなものなのかわかっていない」そんな方のためにこのページでは機能や効果、実際の事例などを総ざらいしていきます。ぜひここで疑問点を解消していってください。

PWA(Progressive Web Apps)とは？

PWAとは「Progressive Web Apps」を略した言葉で、モバイルサイト上でネイティブアプリのようなUXを提供する技術です。アプリのインストールが不要にもかかわらず、ホーム画面へアイコンを追加したり、プッシュ通知を設定できます。また、ページ表示や読み込み速度を高速化できたり、オフライン閲覧もできたりとPWAにはさまざまなメリットがあります。

PWAがSEOにもたらす効果

PWAは直接的にSEOに良い効果をもたらしてくれるわけではありません。UIの改善によるアクションの向上など、ユーザビリティの観点から間接的にSEOの効果を期待できます。例えばPWAを活用すると、以下のような効果が期待できます。

PWAとアプリとの違い

PWAとブラウザとの違い

PWAの主な機能

ここでは、PWAの機能について3点解説します。

1.ユーザーの端末へインストール可能

PWAでは、ユーザーの端末へアプリやサイトを直接インストールでき、スマホやデスクトップのホーム画面にアイコンとして設置できます。

インストール後はネイティブアプリのように使用することができ、ユーザーはアイコンをタップするだけでアプリを起動可能。アイコン化することで、検索エンジンなどの外的要因に左右されず、ユーザーに直接サービスを提供できるため、Webページへのアクセスやコンバージョンの拡大が期待できます。

2.キャッシュ機能の利用

PWAでは、キャッシュ機能を設定できます。

キャッシュ機能とはWebで表示されたデータをデバイスに一時的に保存することで、キャッシュが完了しているページは表示速度が非常に速く、オフライン状態でも不備なく閲覧できます。このように表示速度が早くなるとUXの向上が期待でき、結果としてSEO的に評価される可能性につながります。

3.プッシュ通知機能によるユーザーアクション

PWAでは、プッシュ通知機能を設定できます。プッシュ通知機能とは、アプリやサイトのお知らせを自動通知してくれる機能です。例えば、SNSやメールなどのお知らせは、プッシュ通知としてスマホ画面に表示されます。

プッシュ通知はアプリが起動されていない状態でも機能するため、ブラウザで表示するよりユーザーとの接触回数を増やせます。

PWAを導入するメリット・デメリット

【一覧】PWA導入・成功事例3選

ここでは、PWAの成功事例について3つご紹介します。

事例1:Twitter

参考：Google Developers「Twitter Lite PWA Significantly Increases Engagement and Reduces Data Usage」

Twitterでは、「Twitter Lite」というPWAがリリースされています。
Twitter Liteの実装により、使用時のスマホ内容量を制限されることなく、Twitterを操作できるようになりました。もちろんホーム画面にTwitterのアイコンを追加し、ネイティブアプリのように利用することも可能です。

実際にGoogleが公開しているケーススタディーを見ると以下のような成果が得られています。

【成果】

参考：Google Developers「Twitter Lite PWA Significantly Increases Engagement and Reduces Data Usage」

事例2:日経電子版

参考：Google Developers「日本経済新聞社は複数ページのPWAで新しいレベルの品質とパフォーマンスを実現」

日経電子版のようなニュース系アプリでは、ページの表示速度がUXの向上に直結します。そこで日経電子版では、速度改善を目標にPWAを導入しました。

実際にGoogleが公開しているケーススタディーを見ると以下のような成果が得られています。

【成果】

参考：Google Developers「日本経済新聞社は複数ページのPWAで新しいレベルの品質とパフォーマンスを実現」

事例3:Suumo

参考：Google Developers「Suumo」

大手物件検索サイト「Suumo」もPWAを導入しています。

大手物件検索サイトでは、膨大なデータから検索条件を絞り込むため、情報の表示速度はUXに大きな影響を及ぼします。
実際にGoogleが公開しているケーススタディーを見ると以下のような成果が得られています。

【成果】

参考：Google Developers「Suumo」

PWAの特徴をつかんでユーザビリティの高いコンテンツを作ろう！

今回はPWAの機能や効果、導入するメリット、導入事例について解説しました。
PWAの導入はSEO対策に効果的です。他社のコンテンツに差をつけるためにも、ぜひこの機会にPWAを導入したSEO対策を始めてみてはいかがでしょうか。

SEO対策にはPWA以外にもたくさんの成功ポイントがあります。もしSEOに関して何か不安があれば、いつでも弊社へご相談ください。SEOを考慮した最適解をご提示いたします。