PWAとは(Progressive Web Appsとは)

SEOで使われる用語「PWA」について解説しています。

PWAとは

PWAは「Progressive Web Apps」の略称で、モバイル向けWebサイトをGooglePlayストアなどで見かけるスマートフォン向けアプリのように使える仕組みのことです。PWAはそれ自体が何か特殊な一つの技術、というわけではありません。レスポンシブデザイン、HTTPS化など、Googleが定める要素を備えたWebサイトであり、オフラインやプッシュ通知に対応するためのブラウザAPI(Service Workerなど)を利用しているWebサイトをPWAと呼びます。

PWAを実装することでプッシュ通知やホーム画面へのアイコン追加など、アプリの特徴的な機能をWebサイトに持たせる事ができます。これにより、UX向上やユーザーエンゲージメントの改善にもつながるとして注目されています。

PWAの機能

PWAはアプリ的な側面とWebサイト的な側面を併せ持っています。特徴的な機能は以下の通りです。

①ユーザーの手元の端末にインストール可能

モバイル端末のホーム画面にアイコンを設置できるため、ユーザーはアイコンをタッチするだけでWebサイトを閲覧することが出来ます。


似た機能に「ウェブページのショートカットアイコンをモバイル端末のホーム画面に追加する」という既存機能があげられますが、PWAは単にショートカットをホーム画面に設置した場合と異なり、後に紹介するプッシュ通知やキャッシュの利用などの機能が備わっています。また見かけ上でも、PWAのアイコンから起動したWebサイトはURLバーもなくフルスクリーンで表示出来ますし、起動時のスプラッシュスクリーンも設定できます。

ネイティブアプリのインストールではなくPWA対応したサイトをインストールできることは、サイト運営者にとってもサイトユーザーにとってもメリットです。

【サイト運営者側のメリット】
・アプリサイトを経由しないため、アプリサイトの審査不要

ネイティブアプリの場合、GooglePlayやApp Storeなどでアプリを登録する際には審査が必要なため、アプリが実質配信できるようになるには時間がかかります。PWAはストアを経由しないため、PWAを実装したサイトをリリースすればすぐにアイコン設置が可能です。

・OSごとの個別対応が不要

ネイティブアプリの実装はOSに依存するため、インストールする端末がAndroidなのかiOSなのかによってアプリをそれぞれ用意する必要があります。一方PWA対応サイトはあくまでもWebサイトであり、OSには依存しません。AndroidにもiOSにも個別対応する必要がないのです。

【サイトユーザー側のメリット】

・大容量インストールがない
通常アプリをダウンロードするには、大容量データのインストールが不可欠です。PWAではダウンロードする情報量が非常に少なく、アイコン設置にほとんど時間がかかりません。

②キャッシュの利用

PWAでService Workerの機能を利用すると、キャッシュの利用が可能になります。これにより、以下のようなメリットが生まれます。

・ページ表示速度の高速化
キャッシュによってページを先んじて読み込めるため、ページの表示速度が早くなりユーザーがページを移動しやすくなります。

・オフライン対応
インターネットに接続していなくてもキャッシュを利用してページを表示するため、オフラインでもサイトを閲覧できます。オフラインの間のデータは、オンラインになったら送信することもできます。

③プッシュ通知

Service Workerの機能により、従来のWebサイトでは出来なかったプッシュ通知が可能になります。アプリ同様の積極的な通知・呼びかけがWebサイトからも出来るようになるのです。

参考:Service Worker の紹介 | Web | Google Developer

④検索結果やURLから、通常のサイトと同じようにアクセスすることができる

アプリ的な機能が取り上げられがちですが、もともとはWebサイトなので、通常のWebサイトと同じようにアクセスすることが出来ます。知人とページをシェアするときはアプリとは違いURLを送ればページを共有出来ますし、検索エンジンからのPWA対応のサイトを見つけることも出来ます。

PWAをサイトに導入するメリット

これらの機能を備えるPWAですが、実装することで得られるメリットは以下の2点にまとめられます。

①ユーザーエンゲージメントの向上

サイトへのアイコンがユーザーのモバイル端末のホーム画面に設置できるため、ユーザーはより手軽にサイトにアクセスできます。

またサイト側もプッシュ通知を活用することで、一定期間来訪がないユーザーへのアプローチやキャンペーンの通知などを積極的に行うことが出来ます。
これらの取り組みにより、サイトに対するユーザーエンゲージメントを高める事が可能だと考えられます。

②ユーザー体験の改善

PWAによりサイト読み込み速度が飛躍的に早くなり、またオフラインでもサイトを利用する事ができるようになります。データサイズやインターネット環境などの要因でユーザーの閲覧が阻害されないため、ユーザーがより快適にサイトを利用できるようになります。

0.1秒遅れるごとに売上が1%減ると言われるほど、Webサイトにおいて快適なユーザー体験は重要な要素です。ユーザー体験の改善によって、間接的にサイト上でのユーザー指標が改善すると考えられます。
参考:How Loading Time Affects Your Bottom Line

導入事例(日本国内で馴染みあるサービスに限る)

日本国内に限っても、PWAを導入し成果があったサイトがいくつか存在します。ぜひアクセスしてPWAを体験してみてはいかがでしょうか。

TwitterLite

https://lite.twitter.com/
日本でも馴染み深いSNS「Twitter」もPWAに対応しています。3億人を超えるアクティブユーザー(/月)を持ち、その80%がモバイルユーザーです。

【実装の成果】
・1セッションあたりのページビューが65%増加
・ツイートが75%増加
・離脱率が20%減少
参考:Twitter Lite PWA Significantly Increases Engagement and Reduces Data Usage | Web | Google Developers

日経電子版

https://r.nikkei.com/
日本最大級の経済紙である日経の電子版サイトです。毎月900本の記事を配信し、無料会員も含めると300万人に閲覧されている日経電子版では、ページ速度の改善などを目的にPWAを導入しました。

【実装の成果】
・モバイルに比べパフォーマンスが2倍に改善
・PC版と比べるとSpeed IndexとStart Renderが3分の1に短縮
参考:日経電子版 サイト高速化とPWA対応 / nikkei-high-performance-pwa // Speaker Deck

SUUMO

https://smp.suumo.jp/
日本の大手物件検索サイトもPWAに対応しました。毎月4000万人が物件を検索するサイトで、その多くがモバイルユーザーです。

【実装の成果】
・読み込み時間が75%減少
・プッシュ通知の開封率は31%
参考:Suumo | Web | Google Developers

PWAの注意点

①アプリストア経由で新規ユーザーに接触出来ない

PWAは基本的に、Webサイトを訪問したユーザーに直接インストールしてもらいます。ネイティブアプリのように「アプリストアで偶然見つけてもらう」ということはありません。Webサイトとネイティブアプリを運用していれば、Webからもアプリストアからも新規ユーザーを獲得する機会がありますが、ネイティブアプリを持たずWebサイトにPWAを実装させた場合、アプリストアなどで新規ユーザーを獲得する機会は得られません。

ネイティブアプリも運用しながらPWAも導入することももちろん可能ですが、その場合はネイティブアプリとPWAの両方を維持・運用するためのコストも二重になります。ネイティブアプリとの兼ね合いでは検討が必要です。

②iOSでは一部機能が制限される

iOSはiOS11.3からService Workerへのサポートを始めましたが、Androidに比べると一部の機能が制限されています。

【制限される機能の例】(2018年3月現在)
・オフラインのデータ容量が制限される
・プッシュ通知や、PWAのインストールを促すバナーが使えない
参考:iOSの11.3からのPWA対応でできるようになったこと

まとめ

WEBページでありながらアプリのような機能を持ったPWAにより、ユーザーへのアプローチができる、ユーザー体験を改善できるなど、Webサイトの可能性が広がりつつあります。

以前はiSOに対応しておらず国内ではなかなか広がらなかったPWAですが、Safari11.1がService-Workerに対応たことで、今後様々なサイトで実装が進むと考えられます。
※詳細な実装方法はこちらをご覧ください

関連記事

Webサイトの運用でお困りではありませんか?

私たちが得意とするコンテンツマーケティングやSEOに限らず、Webの運営・改善に関する総合的な知見を持つ私たちなら、きっと御社の悩みを解決できると考えています。

サイト内検索

SEO・サイト運用・コンテンツマーケティングでお困りの際には ぜひお気軽にご相談ください

初級者から上級者まで幅広くコンテンツマーケティングの知識を学べるセミナーもございます

実務に役立つeBookが
無料でダウンロードできます

SEOやコンテンツマーケティングに
ご関心のある方はぜひご利用ください。

×