Generador de Manifiesto de Aplicación Web - Cree manifest.webmanifest para una PWA
Generador de Manifiesto de Aplicación Web
Haga instalable su sitio con un manifest.webmanifest válido
Manifiesto Válido
Construye el JSON con los nombres de campo correctos y omite los valores vacíos. El resultado se comprobó con el esquema JSON del manifiesto web.
Lista de Instalabilidad
Vea de un vistazo si tiene nombre, URL de inicio, modo de visualización y los iconos de 192 y 512 píxeles que buscan los navegadores.
Etiquetas HTML Incluidas
Obtenga las etiquetas link, theme-color y apple-touch-icon para pegar en el head de su página.
Privado
Todo se genera en su navegador. No se sube nada.
Qué Hace un Manifiesto de Aplicación Web
Un manifiesto de aplicación web es un pequeño archivo JSON que indica al navegador cómo debe verse y comportarse su sitio cuando se instala en un teléfono o en un escritorio: su nombre, su icono, sus colores, la página con la que se abre y si oculta la barra del navegador. Enlácelo desde cada página con <link rel="manifest" href="/manifest.webmanifest">.
Chrome y otros navegadores ofrecen la instalación cuando el manifiesto tiene un nombre, una start_url, un modo de visualización distinto de browser e iconos de al menos 192 y 512 píxeles, y el sitio se sirve por HTTPS. Un icono maskable, dibujado con margen extra, permite que Android lo recorte en un círculo o un cuadrado redondeado sin cortar el dibujo. Ya no hace falta un service worker para el aviso de instalación en el Chrome actual, pero sigue siendo necesario si la aplicación debe funcionar sin conexión.
Puntos Clave
- Contrastado con el esquema: Cientos de manifiestos generados se validaron con el esquema JSON de los manifiestos web.
- Defina un id: El id identifica su aplicación con independencia de su start_url, de modo que puede cambiar la URL más adelante sin crear una segunda instalación.
- Herramientas relacionadas: Use el Generador de Favicon desde Imagen para crear los archivos de iconos y el Generador de Meta Etiquetas para el resto de las etiquetas del head.