No está configurada para una pantalla de presentación personalizada

Published on Updated on

Translated to: English, Português, 한국어, 中文

Una pantalla de presentación personalizada hace que su aplicación web progresiva (PWA) se sienta más como una aplicación creada para ese dispositivo. De forma predeterminada, cuando un usuario inicia su PWA desde la pantalla de inicio, Android muestra una pantalla en blanco hasta que la PWA está lista. El usuario puede ver esta pantalla en blanco durante máximo 200 ms. Al configurar una pantalla de presentación personalizada, puede mostrarles a sus usuarios un color de fondo personalizado y el ícono de su PWA, para ofrecer una experiencia atractiva y de marca.

Cómo falla la auditoría Lighthouse de la pantalla de presentación

Lighthouse marca las páginas que no tienen una pantalla de presentación personalizada:

Auditoría Lighthouse que muestra que el sitio no está configurado para una pantalla de presentación personalizada

In the Lighthouse report UI the full PWA badge is given when you pass all of the audits in all of the PWA subcategories (Fast and reliable, Installable, and PWA optimized).

Cómo crear una pantalla de bienvenida personalizada

Chrome para Android muestra automáticamente su pantalla de presentación personalizada siempre que cumpla con los siguientes requisitos en el manifiesto de su aplicación web:

  • La propiedad name se configura como el nombre de su PWA.
  • La propiedad background_color se establece en un valor de color CSS válido.
  • La matriz icons especifica un icono de al menos 512 x 512 px.
  • El icono especificado existe y es un archivo PNG.

Consulte el documento Agregar una pantalla de presentación para las aplicaciones web instaladas en Chrome 47 para obtener más información.

Si bien la auditoría de Lighthouse se aprobará cuando haya un solo ícono de 512x512 px, existe cierto desacuerdo sobre qué íconos debería incluir una PWA. Consulte la Auditoría: cobertura del tamaño de los iconos para obtener una discusión sobre los pros y los contras de los diferentes enfoques.

Recursos

El código fuente de la auditoría No está configurada para una pantalla de presentación personalizada

Last updated: Improve article

We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.