En Chrome 76, puede ocultar la minibarra informativa de Agregar a la pantalla principal

Penny McLachlan
Penny McLachlan

Información general sobre las apps web progresivas y la minibarra de información

Las apps web progresivas (AWP) son un patrón para crear sitios web instalables, confiables y con carga instantánea, similares a las apps.

Cuando tu AWP supere la lista de tareas de instalabilidad en Android, aparecerá un diálogo del sistema de Chrome llamado mini-barra de información en la parte inferior de la ventana del navegador.

Actualmente, la minibarra de información Agregar a la pantalla principal se muestra al mismo tiempo que el evento beforeinstallprompt.

Cambios en Chrome 76

Escuchamos a nuestra comunidad y descubrimos que los desarrolladores quieren tener más control sobre cuándo pedirles a los usuarios que instalen una AWP. Sus opiniones nos importan.

A partir de Chrome 76, puedes evitar la minibarra de información llamando a preventDefault() en el evento beforeinstallprompt.

El evento beforeinstallprompt puede ayudarte a promocionar la instalación de tu app web progresiva, lo que facilita que los usuarios la agreguen a su pantalla principal. Nuestra comunidad compartió que los usuarios que instalan una AWP en la pantalla principal tienen una participación muy alta, con más visitas repetidas, tiempo en la app y, cuando corresponde, tasas de conversión más altas.

Ejemplo de Pinterest que usa un banner de instalación para promocionar la instalabilidad de su AWP.
Ejemplo de Pinterest que usa un banner de instalación para promocionar la instalabilidad de su AWP. Consulta Agregar a la pantalla principal para obtener detalles completos sobre el flujo de agregar a la pantalla principal, incluidos ejemplos de código y otras prácticas recomendadas.

Para promocionar tu app web sin la barra de información en miniatura, escucha el evento beforeinstallprompt y, luego, guárdalo. A continuación, actualiza la interfaz de usuario para indicar que se puede instalar la AWP, por ejemplo, agregando un botón de instalación, mostrando un banner de instalación, usando promociones en el feed o una opción de menú. Cuando el usuario haga clic en el elemento de instalación, llama a prompt() en el evento beforeinstallprompt guardado para mostrar el diálogo modal de agregar a la pantalla principal.

Futuro de la minibarra de información para agregar a la pantalla principal

El uso de la barra de información para agregar a la pantalla principal sigue siendo una medida temporal. Estamos experimentando con nuevos patrones de IU que seguirán brindando a los usuarios de apps web progresivas la capacidad de instalarlas, y lo haremos de una manera que reduzca la confusión en la experiencia de navegación.