Cómo agregar un favicon a tu sitio web

Los Favicons son regularmente conocidos como el pequeño icono que aparece junto al nombre del sitio web en una pestaña del navegador. Mientras que la idea inicial era mostrar una imagen para identificar un sitio web al guardarlo en favoritos, los favicons fueron utilizados luego también en otros lugares como marcadores del explorador, botones de accesos directos a páginas web y demás. La realidad es que además de quedar bonitos, le agregarán identidad a tu sitio web.

La medida del favicon es de 16x16 px o 32x32 px, y se presenta en formato .ICO, con lo cual, si vas a incorporarlo manualmente en tu sitio web deberás exportar tu imagen en este formato.

Agregar un favicon a un sitio web HTML

Hoy en día, la mayoría de los navegadores detectan automáticamente el archivo llamado favicon.ico localizado en el directorio del sitio web y lo usan como el favicon del sitio. Esta es la forma más rápida y sencilla de agregar un favicon a tu sitio. Entonces: el archivo favicon.ico debe estar almacenado en el directorio raiz de tu sitio web para que el navegador pueda identificarlo.

1. Selecciona una imagen que identifique tu sitio web, por ejemplo tu isotipo o logo, y redúcelo con tu editor gráfico favorito a un tamaño de 16x16 o 32x32. Asegúrate que la forma de la imagen sea cuadrada, porque de lo contrario deberás recortarla.
   
   
2. Expórtalo en formato png. Si el editor gráfico que estás utilizando te permite exportarlo como .ico, adelante, y evitarás el próximo paso.
   
   
3. Si exportaste tu icono en png, ahora deberás convertirlo a .ico. Te dejamos aquí una herramienta para hacerlo rápidamente: Convertico.
   
   
   
   
   
4. Descarga ahora el archivo y renómbralo a favicon.ico.
   
   
5. Sube tu nuevo archivo favicon.ico al directorio de tu sitio web. En los hosts basados en Linux o cPanel generalmente es el directorio public_html, aunque puede variar dependiendo de tu hosting o del directorio de instalación del sitio.
   
   
   Si esto no te funcionó o deseas utilizar otro formato de imagen como icono de favoritos sigue los pasos anteriores, pero esta vez agrega este código a tus HTML entre "head" y "/head".
   

   <link rel=”shortcut icon” type=”image/png” href=”/favicon.png”/>

   
   
   

Cómo agregar un favicon en WordPress

A partir de la versión 4, todos los sitios WordPress permiten cambiar el icono de favoritos de forma nativa con un editor que permite cargar y recortar una imagen para usar como favicon.

Para la mayoría de los usuarios, este es el método más simple para agregar un favicon en su WordPress. Todo lo que necesitas es una imagen que sea de al menos 512×512 pixeles y WordPress se encargará del resto del proceso.

1. Ingresa a tu admin de WordPress.
   
   
   
   
   
2. En el menú principal ve a Apariencia y luego a Personalizar.
   
   
   
   
   
3. En el menú de la derecha haz clic sobre Identidad del sitio.
   
   
   
   
   
4. Selecciona una imagen de tu galería o sube una.
   
   
   
   
5. Al finalizar, haz clic en el botón Elegir.
   
   
6. Listo, tu favicon ya está actualizado en tu WordPress.
   
   Si estás usando un plugin de caché para acelerar tu WordPress, recuerda purgar sus contenidos para que actualice tu nuevo favicon.

Cómo agregar un favicon en el Constructor de Sitios

1. Dentro del Constructor Web, dirígete al menú superior "Herramientas" y luego a "Favicon".
   
   
   
   
2. Sube tu archivo de favicon y presiona "Aplicar".
   
   
   
   
3. Luego publica tu sitio web para subir los cambios.