Favicon: Qué es

Una elegante y sencilla forma de facilitar la identificación visual de tu sitio web en listados de páginas o grupos de pestañas es implementando un favicon. Hoy vamos a ver qué es un favicon, cómo se puede crear un favicon en HTML y, sobre todo, a analizar en qué casos se recomienda utilizarlo.

Qué es un favicon

Un favicon es un icono en miniatura, descriptivo de una página web en concreto, que identifica a la página en varios ámbitos; su relación de aspecto es 1:1 (un cuadrado perfecto), y su tamaño suele oscilar entre los 16x16 o los 32x32 píxeles.

Quizá la definición quede algo etérea, pero podrás verlo mejor con un par de ejemplos:

  • Cuando se abre una página web en un navegador, si te fijas en la parte superior izquierda de la pestaña, verás un pequeño icono.

  • Además, si consultas los Favoritos de tu navegador, verás que el nombre de cada sitio web guardado está precedido de esa misma imagen en miniatura.

Para qué sirve un favicon: ¿es realmente necesario?

El favicon es un pequeño icono que acompaña a la página web, y que ayuda a su identificación visual, en especial cuando comparte listado con otras páginas web. Supone una ayuda para la navegación, ya que permite identificar la página fácilmente cuando se tienen abiertas varias pestañas al mismo tiempo.

Asimismo, cuando la página es incorporada a un listado de Favoritos o a una barra de Marcadores, permite una rápida identificación visual al usuario, que la distinguirá del resto con facilidad.

¿Necesario? Quizá no lo sea, pero no cabe duda de que es altamente recomendable, porque proporcionarás una herramienta a los usuarios para diferenciar tu página de las demás.

Y no olvides que el favicon actuará como imagen de marca de tu página: será un logotipo que ayude a asociar a los usuarios tu sitio web con una iconografía concreta.

Cómo hacer un favicon

Favicon en Wordpress

WordPress es quizá el CMS más popular para crear sitios web sin necesidad de tener conocimientos de desarrollo de aplicaciones. En el menú Apariencia – Personalizar, la interfaz te permitirá cargar una imagen y convertirla en el favicon de tu página. Eso sí: tendrás que encontrar la imagen tú.

Herramientas online

También puedes crear un favicon desde cero en sitios web gratuitos como favicon.cc, favicon.io o x-icon editor; o si lo que quieres es editar o transformar una imagen que ya tengas, puedes valerte de Genfavicon o Favicon Generator.

Programas de diseño gráfico

Este es, sin duda, el método más profesional: si te atreves a crear un favicon desde cero, y te manejas con herramientas de diseño gráfico como Illustrator o Photoshop, bastará con que diseñes tú mismo la imagen (ajustándote al tamaño recomendado) y la guardes en formato .ico, para después incorporarla en el HTML de tu página directamente, o a través del CMS que estés utilizando.

Ahora que sabes qué es un favicon, quizá te animes a incorporar estos pequeños iconos a tu sitio web para hacer más accesible la navegación a tus visitantes. Además, si el logotipo elegido es único y personal, estarás contribuyendo a que los internautas asocien la imagen con tu sitio web: como ves, ¡es un sencillo truco de marketing!