1. Home
  2. コンピュータ
  3. ブラウザ
  4. Google Chrome v76からオムニバーでPWAのインストールができるように!
AmazonAmazon クレジットカードAmazon DashAmazon PrimeAmazon.co.jpAmazon
Windows10のゲームバーで画面録画をしよう!

Windows10のゲームバーで画面録画をしよう!

今回はWindows10に標準で搭載されているゲームバーを使用した画面録画(キャプチャー)の方法について紹介したいと思います。画面を録画すると聞くと専用のソフトをインスト...

HTML+CSSだけで実装された走る馬のアニメーションがすごい!

HTML+CSSだけで実装された走る馬のアニメーションがすごい!

今回紹介するのはHTML+CSSだけで走る馬のアニメーションを実装されているClip Clop Clippity Clop [CSS Only]という作品です。CodePenに実物がアップロードされているので...

Bluetooth対応のスマート体重計・体組成計が送料込み1290円の大特価!

Bluetooth対応のスマート体重計・体組成計が送料込み1290円の大特価!

現在AmazonではBluetooth対応のスマート体重計・体組成計がなんとクーポンコードを使用することで衝撃の1290円で販売されています。スマート体重計・体組成計はスマホやタ...

DearMob iPhoneマネージャーでiTunesなしで簡単に写真を転送する方法!

DearMob iPhoneマネージャーでiTunesなしで簡単に写真を転送する方法!

前回はDearMob iPhoneマネージャーでiPhoneやiPadを簡単にバックアップする方法を紹介しましたが、今回の記事ではiTunesを使用せずにDearMob iPhoneマネージャーで簡単に写...

BOOK☆WALKERで電子書籍が50%還元されるキャンペーン!9/11までに配信された全作品対象!

BOOK☆WALKERで電子書籍が50%還元されるキャンペーン!9/11までに配信された全作品対象!

BOOK☆WALKERでは、BOOK☆WALKERとニコニコ書籍のスマホアプリの統合1周年を記念した「祝!結婚1周年!感謝のコイン最大50%還元キャンペーン」を実施しています。このキャン...

Audio Input FX LEを期間限定でプレゼントするキャンペーンを実施中!

Audio Input FX LEを期間限定でプレゼントするキャンペーンを実施中!

ニコニコ動画などの運営しているドワンゴのニコトクというサービスで、Amazonなどで通常販売価格8000円の音声マルチエフェクトソフトウェア「Audio Input FX LE」が期間限...

無料版あり!DVDFab動画ダウンローダーでYouTube動画を簡単ダウンロード!

無料版あり!DVDFab動画ダウンローダーでYouTube動画を簡単ダウンロード!

前回の記事では「DVDFab 11 Blu-rayコピー」についての紹介を行いましたが、今回はDVDFab動画ダウンローダー(DVDFab Downloader)について紹介したいと思います。DVDFab 11 ...

電子書籍が50%OFFでさらにコイン50%還元のニコニコカドカワ祭り2019!初回は100%還元!

電子書籍が50%OFFでさらにコイン50%還元のニコニコカドカワ祭り2019!初回は100%還元!

現在、電子書籍ストアのBOOK☆WALKERでは、2019年9月4日までに配信されたKADOKAWA作品が50%コイン還元、それに加えて15,000点以上が50%OFFで購入できるニコニコカドカワ祭...

激安10インチ中華タブレットの「ALLDOCUBE iPlay10 Pro」を使ってみた!

激安10インチ中華タブレットの「ALLDOCUBE iPlay10 Pro」を使ってみた!

最近10インチで激安タブレットを探していたのですが、10インチタブレットでなんと価格が1万円ちょっとというALLDOCUBE iPlay10 Proをゲットしたのでレビューを書きたいと思...

NetaGear RSS News

Now Loading

Article

Google Chrome v76からオムニバーでPWAのインストールができるように!

コンピュータ > ブラウザ 
Chrome_PWA_Desktop_000.png

Gooogle Chromeの最新版であるバージョン76からオムニバーでPWAのインストールができるようになりました。これによりPC版でも簡単にPWA対応サイトのPWAインストールを行うことが可能になり、今まで以上に簡単にデスクトップにアプリとしてアイコンが追加できます。

PWAで起動するとアドレスバーやタブ無しでPWAが動作が可能となているので、単独アプリのように動作します。PWAの場合はWEBページのショートカットとはちょっと動作が違うのですが、よく使う場合はブラウザとは別に単独起動できるというメリットもあるので、是非活用してみると良いでしょう。

PWA(ServiceWorker)で「ホーム画面に追加」を実装する方法!




まず、今回のオムニバーからPWAのインストールは、PWA対応サイトでないとできません。当ブログはFC2を使用しているためPWA化できていないのですが、他に運営しているDuelLinks.netNetaGearなどのサイトは上記の方法でPWA化を行っています。

そのため今回の方法でデスクトップにアプリとしてアイコンを追加することができますが、PWA対応を行っていないサイトではオムニバーに追加アイコンが表示されません。サイトを運営している方は、簡単なのでぜひPWAを実装しておくとアクセスが増えるかもしれません。サイトの表示速度上昇や色々なメリットがありますのでおすすめです。

オムニバーからPWAのインストールする方法!


Chrome_PWA_Desktop_001.png
1 「ヘルプ」→「Google Chromeについて」を表示して、Google Chromeのバージョンが76以上になっていることを確認します。76以上でない場合はアップデートしてください。

Chrome_PWA_Desktop_003.png
2 PWA対応サイトを開きます。今回は私の作成したサイトのNetaGearはPWA対応してあるので、そちらを使用して試してみます。オムニバー(アドレスバー)の右側に+ボタンのアイコンが表示されるので、それをクリックすると「アプリをインストールしますか?」と表示されるので「インストール」を押します。



Chrome_PWA_Desktop_004.png
3 そうすると、このように単独のアプリとしてサイトが表示されるようになります。アドレスバーなどが表示されないので、単独のアプリのように見えます。PWAの特徴として表示速度の向上など色々なメリットがありますが、私のサイトの場合はそれほど恩恵はなさそうです。オフライン動作可能なPWAを作っていれば、かなり有効で便利だと思います。

Chrome_PWA_Desktop_007.png
ちなみに遊戯王デュエルリンクスの条件検索でカード検索ができるDuelLinks.netの方でも試してみました。



Chrome_PWA_Desktop_005.png
DuelLinks.netだとこんな感じの表示になっています。

Chrome_PWA_Desktop_006.png
PWAでインストールすると、デスクトップにアイコンが追加されて普通のアプリと同様に起動が可能になります。NetaGearとDuelLinks.netのアイコンが追加されています。よく使うサイトでPWA対応サイトであれば、デスクトップにアイコンを追加しておくと便利かもしれませんね。

今回の個人的感想




今回はChromeのオムニバーからPWAのいストールが可能になったというお話でした。手軽にPWAをデスクトップにインストールできるようになったのでPWAの需要も少し上がるといいですね。単独のアプリとして動作してくれるのは面白いですし、使い勝手も上がるとは思います。

ただ、私の作っているサイトもそうなのですが、スマホ向けに実装しているため戻るボタンがないので、PC版では簡単に戻れないという問題も発見しました。iOS12から横にスワイプで戻る機能が追加されましたし、Androidでは標準で戻るボタンがありますが、PC版では右クリックして「戻る」を押さないといけないので少し面倒ですね。

あとtarget="_blank"で他サイトを開く場合はChromeのタブに飛ばされてしまうのは困りますね。結局ブラウザを開いてしまうので私の作っているNetaGearなどのサイトではデスクトップ版PWAの恩恵は微妙なように感じました。スマホだとかなり便利なんですけどね。デスクトップだとなかなか難しい感じがしました。

興味のある人はぜひPWAを活用してみてはいかがでしょうか?

Related article

COMMENT TO THIS ENTRY

Most Popular

Now loading...

Social Links

Sponsored Link

Popular Article

Access Ranking

Now Loading...

当ブログにリンクしていているサイトの中でアクセス数の多いサイト上位15位が表示されます。今ならリンクするだけで簡単に上位に表示されます。