Instalação da barra de endereço para Progressive Web Apps no computador

É fácil instalar os Progressive Web Apps com um novo botão de instalação na barra de endereço (omnibox) do Google Chrome.

No desktop, normalmente não há nenhuma indicação para o usuário de que um servidor Web Progressivo O app pode ser instalado e, se for, o fluxo de instalação fica oculto nas três menu de três pontos.

No Chrome 76 (Beta em meados de junho de 2019), facilitaremos a instalação para os usuários. Progressive Web Apps na área de trabalho adicionando um botão de instalação ao endereço (omnibox). Se um site atende aos Critérios de instalação de Progressive Web App, O Chrome vai mostrar automaticamente um ícone de instalação na barra de endereço. Clicando no botão solicita que o usuário instale o PWA.

Como outros eventos de instalação, é possível detectar o appinstalled para detectar se o usuário instalou o PWA.

Como adicionar seu próprio comando de instalação

Se o PWA tiver casos de uso em que seja útil para os usuários instalarem o app, Por exemplo, se você tem usuários que usam seu app mais de uma vez por semana, promover a instalação do PWA na IU da Web do app.

Para adicionar seu próprio botão de instalação personalizado, ouça o evento beforeinstallprompt. Quando é disparada, salvar uma referência ao evento e atualizar a interface do usuário para permitir que o usuário sabem que podem instalar seu App Web Progressivo.

Padrões para promover a instalação do PWA

Há três maneiras principais de promover a instalação do PWA:

  • Promoção automática do navegador, como o botão de instalação da barra de endereço
  • Promoção da interface do aplicativo, em que os elementos da interface aparecem no aplicativo do site, como banners, botões no cabeçalho ou no menu de navegação etc.
  • Os padrões promocionais inline interligam as promoções no conteúdo do site.

Confira os padrões para promover a instalação do PWA (dispositivos móveis). para mais detalhes. O foco dele é o dispositivo móvel, mas muitos dos padrões são aplicáveis para computador ou podem ser facilmente modificados para funcionar em experiências desktop.