見出し画像

PWAに対応しているサイト11選

唐突ですがPWAって便利ですよ ね。

PWAとは

「Progressive Web Apps」の略で、スマホ向けのWebサイトをApple StoreやGoogle Playからインストールしたアプリのように利用できる仕組みのことです。

ユーザにとっては、
・ストレージの容量を圧迫しない
・ブラウザで見るより動作が軽い
・アドレスバーが無いので表示領域が広い
・通信量が少なくて済む
・URLでページを共有できる
・アップデートしなくてよい

サイト運営者にとっては、
・アプリのような審査が不要
・OSの違いによる対応が不要
・プッシュ通知を利用できる
・キャッシュを利用できる
・Googleなどの検索エンジンから流入が見込める

といったメリットがあります。

判別方法

PWAに対応しているサイトに訪れると、
PCであればブラウザのアドレスバーに+マークのアイコンが表示されます。

画像1

スマホであれば下からひょこっと通知が出現します。

画像2

いくつかオススメのPWAに対応したサイトを紹介します。

Twitter

画像3

TwitterはPWAからでもフォローしたりツイートすることが可能で、アプリと動作や表示はほぼ同じです。

The Weather Channel

画像4

The Weather Channel は天気予報を確認できるWebサイトです。
1時間ごとの天気だったり雨雲レーダーも表示できるので、天気予報アプリとして充分に役に立ちます。

TechFeed

画像5

TechFeedは主にエンジニアやデザイナー向けのネットニュースを収集しているWebサイトです。
今、どの記事が多くの人に注目されているのか客観的に知ることができます。情報収集したい方にお勧めです。

新R25

画像6

新R25は業界で成功している人や名前が知られている人に対談した記事を載せているWebサイトです。
主に10代,20代の若者を対象に情報発信していますが、キャリアに悩む全ての人にとって気付きが得られます。
コンテンツの都合上、文字や画像が多いのでPWAの方が動作もスムーズ&表示範囲も広がって読みやすいです。

Qiita

画像7

エンジニアにとってはお馴染みのプログラミングに関する知識を記録・共有できるWebサイトです。
こちらも文字や画像が多いのでPWA版で閲覧した方が見やすいです。

Forbes Japan

画像8

Forbes (フォーブス)は世界的に有名なビジネスマン向けの情報メディアです。
世界各国のニュースや話題も得たい人にオススメです。

PRESIDENT Online

画像9

PRESIDENT Onlineもビジネスマン向けの情報メディアです。
Forbesは海外のニュースが割りと中心ですが、こちらは日本を主軸に置いたニュースが多いです。

Dev.to

画像10

Dev.toは知識や知見を共有したり発信したりするWebサイトです。海外版Qiitaといったところ。
海外のエンジニアのレベルの高さを伺えます。

web.dev

画像11

Lighthouseを使用してサイトのパフォーマンスを計測したり最新のWebの技術や知識を学べるWebサイトです。
アクセシビリティ・ネットワーク・セキュリティ・PWA・ローディング時間・・などなどWebに携わる者にとって学ぶべきことはたくさんあります。

サル先生のGit入門

画像12

「猿でもわかる」でお馴染みのGitについて学べるWebサイトです。Gitを扱う人であれば一度は訪れたことがあるのでは?
PWAに対応したことによって、Gitについて何か見たり調べたい時、よりサクッと可愛いお猿が閲覧できるようになりました。

The Cube

画像13

ルービックキューブで遊べるWebサイトです。
PWAとして表示すればWebサイトではなく、一般的なゲームアプリとほぼ同じです。
HTML5の技術を駆使すればこういったゲームも作れる、というところにWebの面白さと難しさを感じます。

この記事が気に入ったらサポートをしてみませんか?