W Chrome 76 możesz ukryć minipasek informacyjny na ekranie głównym,

Penny McLachlan

Uwaga: TL;DR: zwiększamy Twoją kontrolę nad minipaskiem informacji aplikacji PWA „Dodaj do ekranu głównego”. Od wersji 76 Chrome (lipiec 2019 r.) możesz uniemożliwić wyświetlanie minipaska informacji, wywołując funkcję preventDefault() w zdarzeniu beforeinstallprompt.

Informacje o progresywnych aplikacjach internetowych i minipasku informacji

Progresywne aplikacje internetowe (PWA) to wzór do tworzenia niezawodnych, instalowanych witryn, które wczytują się błyskawicznie i działają jak aplikacje.

Gdy PWA przejdzie sprawdzenie możliwości instalacji na Androidzie, w dolnej części okna przeglądarki pojawi się okno systemowe Chrome, czyli minipasek informacji.

Obecnie pasek informacji Dodaj do ekranu głównego jest wyświetlany w tym samym czasie co zdarzenie beforeinstallprompt.

Zmiany w Chrome 76

Uwaga: wersja Chrome 76 została udostępniona w lipcu 2019 roku.

Słuchamy naszej społeczności i dotarły do nas informacje, że deweloperzy chcą mieć większą kontrolę nad tym, kiedy mogą prosić użytkowników o instalowanie aplikacji PWAs. Wzięliśmy sobie do serca Wasze opinie.

Od wersji 76 Chrome możesz uniemożliwić wyświetlanie minipaska informacji, wywołując funkcję preventDefault() w zdarzeniu beforeinstallprompt.

Zdarzenie beforeinstallprompt może Ci pomóc w promowaniu instalacji progresywnej aplikacji internetowej, ułatwiając użytkownikom dodanie jej do ekranu głównego. Nasze społeczności informują, że użytkownicy, którzy instalują PWA na ekranie głównym, są bardzo zaangażowani. Często wracają do aplikacji, spędzają w niej dużo czasu i w odpowiednich przypadkach osiągają wyższe współczynniki konwersji.

Przykład Pinteresta, który używa banera promującego instalację do promowania możliwości zainstalowania progresywnej aplikacji internetowej. Pełne informacje o dodawaniu aplikacji do ekranu głównego, w tym przykłady kodu i inne wskazówki, znajdziesz w artykule Dodawanie aplikacji do ekranu głównego.

Aby promować aplikację internetową bez paska informacji, nasłuchuj zdarzenie beforeinstallprompt, a potem je zapisz. Następnie zaktualizuj interfejs użytkownika, aby wskazać, że aplikację PWA można zainstalować. Możesz to zrobić na przykład przez dodanie przycisku instalacji, wyświetlenie banera z zachętą do instalacji, użycie promocji w przekazach lub opcji menu. Gdy użytkownik kliknie element instalacji, wywołaj prompt() w zapisanym zdarzeniu beforeinstallprompt, aby wyświetlić wyskakujące okienko dodawania aplikacji do ekranu głównego.

Przyszłość minipaska informacji Dodaj do ekranu głównego

Używanie paska informacji „Dodaj do ekranu głównego” to nadal tymczasowe rozwiązanie. Eksperymentujemy z nowymi wzorcami interfejsu, które będą nadal umożliwiać użytkownikom aplikacji Progressive Web App instalowanie aplikacji w sposób ograniczający bałagan w przeglądarce.