Qué es un favicon y cómo puedes hacer uno para tu página

Seguro que, en más de un ocasión, has escuchado charlar de un favicon. Esto está muy relacionado con el diseño web, y es un punto importante que en toda página, ya sea una tienda online, un blog, una web, etc. te van a pedir. Pero, ¿qué es un favicon? ¿Para qué sirve? Y lo más importante de todo, ¿cómo se hace?

Si tienes muchas dudas acerca de esto, aquí vamos a darte las claves para que lo entiendas y, sobre todo, para que puedas presentarlo interiormente de tu esquema y quedes con una mejor presentación. ¡Te lo aseguramos!

Qué es un favicon

Vamos a principiar explicándote qué es un favicon para que lo entiendas. Y, para ello, carencia mejor que darte un ejemplo práctico. Imagina que ahora mismo estás navegando (de hecho, nos estás leyendo). Pero no tienes solo una pestaña, sino varias de ellas. Te habrás poliedro cuenta que, en cada una de ellas, aparece el nombre de lo que refleja esa página, ya sea Youtube (porque estás escuchando música de fondo), Gmail (porque tienes campechano tu correo) o esta página.

Al costado de cada nombre, a la izquierda, te aparece una pequeña imagen, en cuadradito. La de Youtube y Gmail seguro que la identificas con los logos que tienen, pero, ¿y el resto de pestañas?

Pues eso que ves es en efectividad el favicon. En otras palabras, se tráfico de un icono que protector relación con la página que estás visitando, de ahí que sea tan importante el prestar atención a este detalle, porque cuando agregas a favoritos o a accesos directos una página, el favicon se convierte en la «imagen» de esa página y es por lo que hay que cuidar su diseño para que se relacione a la perfección (y sobre todo se vea perfectamente para distinguirlo de otras).

Este pequeño icono suele tener un tamaño establecido que está en 16×16 píxeles (aunque igualmente se puede poner en 32x32px). Dentro del mismo tienes que cuidar que todo lo que pongas se vea de modo correcta ya que, de lo contrario, aparecerá como una mancha poco identificable (y que dará muy mala imagen de tu página).

¿Por qué es tan importante el favicon?

Ahora que sabes lo que es el favicon, y que has localizado este en las páginas que abres asiduamente, ¿te has poliedro cuenta que hoy día cada vez son menos páginas a las que les errata? Esto es porque en realidad es muy importante para dar una visión de elegancia y de enterarse hacer. Es afirmar, que vas a transmitir una imagen de marca o de corporación que se preocupa por los detalles.

Sin retención, el favicon igualmente tiene otros usos como son:

• Servir de identificación de tu página. Normalmente este favicon está relacionado con el logo que tienes en tu página web, solo que a un tamaño más pequeño. Pero cuando el logo es demasiado amplio y no se verá en el botoncito, se tiende a nominar poco que relacione con el mismo.
• Ayudarás a que los usuarios que tengan guardada tu página puedan identificarla visualmente. Así, aunque no se acuerden de la url, o del nombre de la empresa, por la imagen del favicon sí que la van a colocar.
• Para estar «a buenas» con el SEO. Esto hay que tomarlo con pinzas. Y es que tener o no tener un favicon no va a afectar directamente al SEO (es afirmar, que no te va a posicionar mejor o peor por tenerlo o no). Ahora perfectamente, cada vez es más habitual que, cuando un navegador entra en una página, averiguación ese favicon y, cuando no lo encuentra, entonces da un error 404. Y ya sabes que esos errores no son buenos para el SEO de una página.

Cómo hacer un favicon

Después de lo manido, está claro que un favicon es un medio ambiente imprescindible a la hora de tener una página web. Ahora perfectamente, ¿cómo se hace uno?

Debes enterarse que, en la mayoría de los casos, lo que hace es escogerse el logo de esa web, o si es demasiado amplio, poco que lo identifique. Por ejemplo, imagina que tienes una web de televisión que has llamado de alguna forma. Pero eso, en el favicon, es demasiado amplio. En cambio, puedes poner una imagen de una televisión para que lo relacionen. En estos casos sí se recomienda que lleve los mismos colores que tu web para que lo identifiquen mejor.

Y ahora perfectamente, ¿cómo podemos crear un favicon? Pues tienes varias opciones:

Photoshop, Gimp…

En otras palabras, hablamos de programas de impresión de imágenes ya que un favicon se crea exactamente igual que una imagen. Eso sí, tienes que guardarla en formato .ico para que la reconozca como tal porque no se puede dejar como jpg, gif o similar.

Esta forma de hacerlo te permite personalizar mucho mejor el favicon, logrando crearlo desde cero y dándole el arruinado que tu quieras. Normalmente para esto se trabaja con una imagen en un tamaño regular y luego se adapta al tamaño de ese capullo.

Después de hecho, se debe subir y probar en diferentes navegadores para ver si se ve perfectamente, es representativo y, sobre todo, se entiende.

Usando herramientas online

En este caso nos referimos a páginas web que se ocupan de convertir cualquier imagen que quieras en un favicon en cuestión de segundos. Pero igualmente tienes la opción de diseñar directamente con esas páginas tu favicon.

Si quieres lo primero (subir la imagen y convertirla), entonces te recomendamos Favicon Generator o Favic-o-matic. Pero si quieres lo segundo (diseñarlo de cero), envite por favicon.io o x-icon editor.

Con WordPress

¿Tu página está hecha en WordPress? ¿Y sabes que puedes usar ese sistema para crear tu favicon. Para ello puedes utilizar algunos plugins que te permiten crear este capullo en saco a alguna imagen que hayas subido (o que subas). También a través de «Apariencia/Personalizar» puedes hacerlo.

Una vez tienes el favicon hecho, solo tienes que ponerlo en tu web y que esta lo reconozca para poder mostrarse en la zona izquierda del nombre de tu página, así como a la hora de guardarla en favoritos. De esta forma te reconocerán fácilmente sin privación de pararse a ojear si es la página que en realidad querían presentarse.