android html ios browser favicon

android - ¿Qué es el estado de arte de los favicons en 2013?



html ios (1)

Hay algunos consejos oficiales en http://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html que parecen confirmar su lista.

Idealmente, el archivo favicon.ico debería contener varias resoluciones en un archivo, ya que los navegadores actualizados ahora pueden aprovechar esto y un ícono de 16 x 16 nunca se verá muy bien en una pantalla de retina.

Aparentemente, Microsoft ahora recomienda que el archivo favicon.ico contenga al menos 16 × 16, 24 × 24, 32 × 32 y 64 × 64.

Acabo de lanzar una herramienta en línea gratuita que creará favicons como este en: http://iconifier.net

Consulte la página Léame en el sitio web para obtener más enlaces a la información más reciente sobre favicon.

El negocio de Favicon se complicó en los últimos años. Nuevos tipos de dispositivos (re) inventados, como tabletas y teléfonos inteligentes inteligentes. Usan favicons de nuevas formas (por ejemplo, como íconos de aplicaciones en las pantallas de inicio) y requieren formas específicas de proveedores para vincularlos. De manera similar, los navegadores ahora permiten crear accesos directos de escritorio para aplicaciones web (que también usan favicons para íconos). Peor aún, ahora tenemos pantallas de alta resolución ("retina") en dispositivos portátiles y portátiles, que requieren imágenes de mayor resolución para los íconos. Peor aún, los diferentes navegadores (y versiones) admiten diferentes formatos de imagen para iconos y tamaños diferentes. Comenzando con 16x16 solo .ico-solo IE6 y terminando con Opera, que ahora admite iconos .svg.

¿Qué debo hacer para admitir iconos nítidos en la mayoría de los dispositivos y navegadores actuales?

Hasta ahora, el mejor recurso que pude encontrar fue html5boilerplate , que recomienda tener los siguientes archivos:

apple-touch-icon-114x114-precomposed.png apple-touch-icon-144x144-precomposed.png apple-touch-icon-57x57-precomposed.png apple-touch-icon-72x72-precomposed.png apple-touch-icon-precomposed.png apple-touch-icon.png favicon.ico # 32x32

sin poner ningún enlace a ellos en la etiqueta <head> .

Edición: otra consideración es que los archivos .ico pueden almacenar varias imágenes con una resolución diferente. ¿Es esto útil o compatible?