O que é necessário para a instalação?

Pete LePage

Os Apps Web Progressivos (PWAs, na sigla em inglês) são aplicativos modernos e de alta qualidade criados com tecnologia da Web. Eles oferecem recursos semelhantes aos apps para dispositivos móveis e computadores, são confiáveis mesmo em condições de rede instáveis e podem ser instalados, facilitando a localização e o uso.

A maioria dos usuários está familiarizada com a instalação de aplicativos e os benefícios de uma experiência instalada. Os aplicativos instalados aparecem nas plataformas de inicialização do sistema operacional, como a pasta "Aplicativos" no macOS X, o menu "Iniciar" no Windows e a tela inicial no Android e iOS. Os aplicativos instalados também aparecem no seletor de atividades, nos mecanismos de pesquisa de dispositivos, como o Spotlight, e nas páginas de compartilhamento de conteúdo.

A maioria dos navegadores indica ao usuário que o App Web Progressivo (PWA) pode ser instalado quando atende a determinados critérios. Os indicadores de exemplo incluem um botão "Instalar" na barra de endereço ou um item de menu "Instalar" no menu de overflow.

Imagem ampliada do botão "Instalar" na barra de URL do computador.
Promoção de instalação fornecida pelo navegador (computador)
Close-up do banner na parte de baixo da tela do dispositivo móvel, pedindo ao usuário para "Adicionar o Airhorner à tela inicial".
Promoção de instalação fornecida pelo navegador (dispositivo móvel)

Além disso, quando os critérios são atendidos, muitos navegadores acionam um evento beforeinstallprompt, permitindo que você ofereça uma UX personalizada no app que acionará o fluxo de instalação.

Critérios de instalação

No Chrome, o App Web Progressivo precisa atender aos seguintes critérios antes de acionar o evento beforeinstallprompt e mostrar a promoção de instalação no navegador:

  • O app da Web ainda não está instalado.
  • Atende às heurísticas de engajamento do usuário:
    • O usuário precisa ter clicado ou tocado na página pelo menos uma vez, a qualquer momento, mesmo durante um carregamento de página anterior.
    • O usuário precisa ter passado pelo menos 30 segundos visualizando a página, a qualquer momento.
  • Ser veiculado por HTTPS.
  • Inclui um manifesto do app da Web que inclui:
    • short_name ou name
    • icons : precisa incluir um ícone de 192 px e um de 512 px
    • start_url
    • display : precisa ser um de fullscreen, standalone, minimal-ui ou window-controls-overlay
    • prefer_related_applications não pode estar presente ou ser false

Outros navegadores têm critérios semelhantes para instalação, embora possa haver pequenas diferenças. Confira os sites respectivos para mais detalhes: