¿Qué se necesita para que se pueda instalar?

Pete LePage

Las apps web progresivas (AWP) son aplicaciones modernas y de alta calidad compiladas con tecnología web. Las AWP ofrecen capacidades similares a las de las apps para dispositivos móviles y computadoras, son confiables incluso en condiciones de red inestables y se pueden instalar, lo que facilita que los usuarios las encuentren y las usen.

La mayoría de los usuarios están familiarizados con la instalación de aplicaciones y los beneficios de una experiencia instalada. Las aplicaciones instaladas aparecen en las superficies de inicio del sistema operativo, como la carpeta Aplicaciones en macOS X, el menú Inicio en Windows y la pantalla principal en Android y iOS. Las aplicaciones instaladas también aparecen en el selector de actividades, los motores de búsqueda de dispositivos, como Spotlight, y en las hojas de uso compartido de contenido.

La mayoría de los navegadores le indican al usuario que tu aplicación web progresiva (AWP) se puede instalar cuando cumple con ciertos criterios. Entre los indicadores de ejemplo, se incluyen un botón Instalar en la barra de direcciones o un elemento de menú Instalar en el menú de desbordamiento.

Acercamiento del botón Instalar en la barra de URL de escritorio.
Promoción de instalación proporcionada por el navegador (computadora)
Primer plano del banner en la parte inferior de la pantalla del dispositivo móvil, en el que se le solicita al usuario que agregue Airhorner a la pantalla principal.
Promoción de instalación proporcionada por el navegador (dispositivo móvil)

Además, cuando se cumplen los criterios, muchos navegadores activan un evento beforeinstallprompt, lo que te permite proporcionar una UX personalizada en la app que activará el flujo de instalación dentro de tu app.

Criterios de instalación

En Chrome, tu aplicación web progresiva debe cumplir con los siguientes criterios antes de activar el evento beforeinstallprompt y mostrar la promoción de instalación en el navegador:

  • La app web aún no está instalada.
  • Cumple con la heurística de participación del usuario:
    • El usuario debe haber hecho clic o presionado la página al menos una vez, en cualquier momento, incluso durante una carga de página anterior.
    • El usuario debe haber pasado al menos 30 segundos viendo la página, en cualquier momento.
  • Se debe publicar a través de HTTPS.
  • Incluye un manifiesto de app web que incluye lo siguiente:
    • short_name o name
    • icons (debe incluir un ícono de 192 px y uno de 512 px)
    • start_url
    • display (debe ser uno de fullscreen, standalone, minimal-ui o window-controls-overlay)
    • prefer_related_applications no debe estar presente o debe ser false

Otros navegadores tienen criterios similares para la instalación, aunque puede haber pequeñas diferencias. Consulta los sitios respectivos para obtener todos los detalles: