Formato y tamaño del favicón

No todos los navegadores requieren las mismas dimensiones para el favicón. Por eso, además de los faviconos con 16 x 16 píxeles o 32 x 32 píxeles, se recomiendan otras variantes.

Favicón: ¿para qué es necesario el icono de imagen?

Con el término favicón (que resulta de la combinación de “favorite” y “icon”) se hace referencia al pequeño gráfico que, entre otros lugares, se muestra en las pestañas abiertas en un navegador, lo que facilita que los usuarios encuentren una página web abierta. Aunque en un principio se puede usar el logo de una marca o una empresa como favicón, las estrictas dimensiones que debe respetar este icono gráfico hacen que a menudo solo se use como tal una parte del logo o una variación de este. En los dispositivos móviles, además, estos pequeños iconos también se usan como icono táctil. Para más información sobre estos iconos gráficos, también puedes consultar nuestro artículo “¿Qué es un favicón? Definición e importancia”.

¿Qué tamaño se recomienda para un favicón?

Es recomendable que todas las páginas web incluyan un favicón. De este modo, es más sencillo encontrar la página buscada. Además, contribuirás a que la página web muestre un aspecto más profesional y conseguirás que funcione mejor desde el punto de vista del SEO. No obstante, hay normas estrictas sobre las dimensiones que debe tener un favicón. En la mayoría de los navegadores se requieren las medidas 16 x 16 píxeles o 32 x 32 píxeles. Mientras que para pantallas de alta resolución se recomienda el favicón de 32 x 32 píxeles, el de 16 x 16 píxeles suele usarse con otros fines. Por ello, lo más sencillo es incluir ambos en el código.
Consejo
En la Digital Guide puedes encontrar distintos consejos de gran utilidad sobre el logo, uno de los principales signos distintivos de tu marca: respondemos a la pregunta sobre qué caracteriza un buen logo, incluimos información sobre el tamaño de un logo y el formato de un logo y te presentamos los programas más importantes para la creación de logos. Incluso si quieres crear una guía de estilo para tu página web, aquí encontrarás lo que buscas.

Tamaño de favicón para Google

Además de estos dos tamaños para faviconos presentados, hay formatos que también son útiles y que es mejor incluir, sobre todo para Google. Los resultados de búsqueda en esta plataforma se ofrecen con un favicón que debería cumplir con las dimensiones de 48 x 48 píxeles. Como alternativa, se puede optar por un formato múltiplo de estas dimensiones. Este tamaño de favicón también es importante para Android, que utiliza faviconos en este tamaño para los accesos directos de la pantalla de inicio. Para dispositivos con una resolución de pantalla alta, también es útil el favicón de 192 x 192 píxeles.

Tamaño de favicón para dispositivos Apple

En el caso de Apple, el tema se complica. Los tamaños de favicón más apropiados varían en función del dispositivo final en el que se muestra. Para el iPhone, se utiliza el formato 60 x 60 píxeles, aunque también se puede usar una resolución mayor, siempre que sea un múltiplo de este valor. Esto permite una visualización óptima a alta resolución, que se reduce para otros fines. Por tanto, un icono de imagen de 180 x 180 píxeles es una buena opción. Los iconos del iPad, en cambio, se muestran con 83,5 x 83,5 píxeles. En el caso de las pantallas Retina y Super Retina, se recomienda unas dimensiones de favicón de 167 x 167 píxeles.

Los tamaños de favicón más importantes de un vistazo

Para algunos navegadores y dispositivos se aplican otras excepciones. Los dispositivos más antiguos, en particular, requieren en teoría de otras dimensiones para que el tamaño del icono del navegador sea el correcto. Te presentamos una lista con las dimensiones de favicón más comunes:
Navegador o dispositivo
Tamaño
La mayoría de los navegadores modernos
16 x 16 o 32 x 32 píxeles
Google y Android
48 x 48 o 192 x 192 píxeles
iPhone (modelos más recientes)
60 x 60 o 180 x 180 píxeles
iPad (modelos más recientes)
83,5 x 83,5 o 167 x 167 píxeles
Webstore de Chrome
128 x 128 píxeles
Google TV
96 x 96 píxeles
Internet Explorer 9
24 x 24 píxeles
Pantalla de inicio de iPad
72 x 72 píxeles
iPhone (modelos más antiguos) y iPod Touch
57 x 57 píxeles
iPhone 4 pantalla de inicio
114 x 114 píxeles
Marcador rápido de Opera
195 x 195 píxeles

Extensiones de archivo: ¿qué formatos puede tener un favicón?

Puedes utilizar varios formatos de imagen para tu favicón. Sin embargo, es el formato de archivo de imagen de Windows .ico, compatible con numerosos navegadores, el que se usa con una frecuencia mayor. Por su parte, el formato .png se recomienda para gráficos de mayor tamaño que también pueden funcionar como iconos táctiles. Otros formatos son .svg o .gif.

Generador para crear un favicón

Dado que son varios los aspectos a los que prestar atención a la hora de establecer el tamaño de un favicón adecuado para tu página web, lo más sencillo es utilizar un generador. Este te guiará por todos los pasos y comprobará que el favicón es compatible con todos los navegadores importantes. Finalmente, puedes añadir el favicón en WordPress o poner un favicón en HTML.
Consejo
El favicón perfecto con unos pocos clics: crea el favicón perfecto para tu presencia online de forma gratuita con IONOS. De este modo, podrás beneficiarte de todas las ventajas de estas pequeñas imágenes.
¿Le ha resultado útil este artículo?
Page top