Cómo Añadir un Favicon en su Sitio Web de WordPress

¿Se ha fijado alguna vez en los pequeños iconos que aparecen junto a los títulos de los sitios web en las pestañas del navegador? Se llaman favicons.

Ayudan a los visitantes a reconocer fácilmente su sitio web y a establecer una identidad para los lectores habituales. Por lo tanto, son una parte pequeña pero importante de tu marca y no deben pasarse por alto.

En este artículo, aprenderá a crear un favicon de WordPress y a añadirlo a su sitio web con facilidad.

Los beneficios de usar un favicon en su sitio web de WordPress

Sabemos que los favicones aparecen principalmente en las pestañas del navegador. Sin embargo, ese no es el único lugar donde los verás. Aquí están todos los espacios donde sus lectores pueden encontrar los favicons de su sitio web:

• Pestañas del navegador de escritorio - Los favicons aparecen junto al título del sitio web en la pestaña del navegador.
• Resultados de búsqueda - Los motores de búsqueda como Google y Yandex muestran los favicons en sus resultados de búsqueda.
• iOS Web Clip - Cuando los usuarios de iPhone y iPad fijan tu sitio web en su pantalla de inicio, el enlace parece una aplicación nativa y utiliza los faviconos como iconos de la aplicación.
• Android Chrome - Los usuarios de Android Chrome también pueden añadir un sitio web a sus pantallas de inicio, donde el favicon se utiliza como el icono de la aplicación.
• Windows Metro - Los usuarios de Windows 8 y 10 pueden anclar su sitio web en su menú de inicio. El sitio aparecerá como un mosaico, similar a una aplicación nativa de Windows, y utilizará el favicon para el icono del mosaico.

Al añadir un favicon, tu sitio web parece profesional y creíble en muchos espacios, lo que mejora la percepción y la confianza de los clientes.

Además, cuando un usuario ha abierto un gran número de pestañas en su navegador, el título de tu sitio web puede quedar cortado. En ese caso, los visitantes pueden volver a su sitio web reconociendo el favicon.

Cómo crear un favicon de WordPress

Puedes crear un favicon manualmente usando tu logo. Los únicos requisitos son que debe estar en formato PNG o ICO y debe tener 512 x 512 píxeles.

Si no tienes un logo, puedes crear uno utilizando herramientas online gratuitas como Canva. Desde el panel de control, dirígete a Crear un diseño > Tamaño personalizado. Indique la altura y la anchura del proyecto como 512 píxeles y haga clic en "Crear diseño".

Aparecerá una página en blanco en el proyecto en la que podrás añadir logotipos utilizando la pestaña de elementos de la barra lateral izquierda. Sólo tienes que buscar un logotipo y hacer clic en el que te guste para copiarlo en la página en blanco. Aunque la mayoría de los iconos están disponibles de forma gratuita, algunos están bloqueados tras un plan Canva Pro.

Luego puedes cambiar el tamaño y los colores del logo según la identidad de tu sitio web y tus preferencias. Cuando hayas terminado, Canva te permite descargar el logotipo en formato PNG, con o sin fondo.

Si ya tienes un logotipo, puedes utilizar un software de edición de imágenes como Adobe Photoshop o incluso la aplicación preinstalada Fotos de Windows para recortarlo en forma cuadrada y guardarlo como archivo PNG.

Herramientas basadas en la nube

Aparte de esto, también puedes utilizar herramientas basadas en la nube como Real Favicon Generator y Favicon Generator para crear tus favicons a partir de una imagen existente.

Aquí, lo que debes hacer es subir una imagen desde tu computador y hacer clic en el botón Generar. Las herramientas crean un paquete de iconos para descargar que puedes utilizar en tu sitio web.

La herramienta incluso te permite personalizar la apariencia del favicon en dispositivos iOS, Android, Windows y macOS. Incluso te permite manipular factores como los algoritmos de compresión y escalado.

Después de descargar el favicon, utilizaremos dos métodos para añadirlo a nuestro sitio web de WordPress.

Añadir el favicon usando el personalizador de WordPress

La forma más fácil de añadir un favicon a tu sitio web de WordPress es utilizando el personalizador de WordPress. Desde tu panel de control de WordPress, dirígete a Apariencia > Personalizar > Identidad del sitio.

Aquí, haz clic en el botón "Seleccionar icono del sitio" para subir o elegir tu favicon de tu biblioteca. Antes de subir la imagen, asegúrate de que tiene al menos 512 x 512 píxeles.

Si tu imagen no es cuadrada, puedes incluso recortarla antes de finalizarla. La página muestra una vista previa en vivo en la parte derecha de la página de recorte. Haz clic en "Recortar imagen" cuando hayas terminado. Con eso, tu favicon estará activo y deberías poder ver inmediatamente los cambios.

Añadir un Favicon usando un plugin de WordPress

Real Favicon Generator, la herramienta que hemos utilizado anteriormente, también tiene un plugin que proporciona algunas opciones más de compatibilidad para varios dispositivos e iconos de aplicaciones. Este método también es ideal para sitios web con la versión 4.2 de WordPress o inferior.

Después de instalar el plugin, dirígete a Apariencia > Favicon. Aquí, tendrás que subir la imagen maestra para generar favicons.

Cuando hagas clic en el botón "Generar Favicon", serás redirigido al sitio web de la herramienta. Al igual que antes, podrás personalizar el favicon y generar los archivos.

A continuación, se te enviará automáticamente a tu panel de administración de WordPress. Un mensaje confirmará que el favicon ha sido activado.

De esta forma tu sitio web de WordPress contará con un icono distintivo que te ayudará a mantenerte diferenciado de la competencia, generando una imagen de marca sólida y consistente.