Installazione della barra degli indirizzi per le app web progressive sul desktop

Le app web progressive sono facili da installare grazie a un nuovo pulsante per l'installazione nella barra degli indirizzi (omnibox) di Chrome.

Sui computer, in genere l'utente non ha indicazioni sul fatto che un L'app è installabile e, in questo caso, il flusso di installazione è nascosto con il menu a discesa.

In Chrome 76 (beta a metà giugno 2019), semplifichiamo l'installazione da parte degli utenti App web progressive sul desktop aggiungendo un pulsante di installazione all'indirizzo (omnibox). Se un sito soddisfa Criteri di installabilità delle app web progressive, Chrome mostra automaticamente un'icona di installazione nella barra degli indirizzi. Facendo clic sul chiede all'utente di installare la PWA.

Come per gli altri eventi di installazione, puoi ascoltare l'evento appinstalled per rilevare se l'utente ha installato la tua PWA.

Aggiunta della tua richiesta di installazione

Se la tua PWA prevede casi d'uso in cui è utile per un utente installare l'app, Ad esempio, se alcuni utenti utilizzano la tua app più di una volta alla settimana, devi promuovere l'installazione della PWA nella UI web dell'app.

Per aggiungere un pulsante di installazione personalizzato, esamina l'evento Evento beforeinstallprompt. Quando viene attivato, salvare un riferimento all'evento e aggiornare l'interfaccia utente sapere che possono installare la tua app web progressiva.

Pattern per promuovere l'installazione della PWA

Esistono tre modi principali per promuovere l'installazione della PWA:

  • Promozione automatica del browser, ad esempio il pulsante di installazione nella barra degli indirizzi.
  • Promozione nell'interfaccia utente dell'applicazione, in cui gli elementi UI vengono visualizzati nell'applicazione come banner, pulsanti nell'intestazione o nel menu di navigazione e così via.
  • I pattern promozionali incorporati intrecciano le promozioni all'interno dei contenuti del sito.

Consulta i pattern per promuovere l'installazione di PWA (dispositivi mobili) per ulteriori dettagli. Il suo obiettivo principale è il mobile, ma molti dei modelli sono applicabili per computer o possono essere facilmente modificate per adattarle a quelle desktop.