Un favicon es un icono que se muestra en la barra de direcciones del navegador de Internet para identificar una página web de forma reconocible. Los favicones también se muestran en el borde de las pestañas abiertas del navegador y en la lista de favoritos junto al nombre de la página web. En este artículo te explicamos los conceptos básicos y cómo crear tu propio favicon con el generador de favicon de IONOS.

¿Por qué debo utilizar un favicon?

Con un favicon, puedes hacer que tu página web sea inconfundible y aumentar el valor de reconocimiento. Incluso en listas de favoritos extensas, tus clientes o lectores reconocerán inmediatamente tu página web gracias a un favicon memorable.

Para lograr el mejor valor de reconocimiento posible, el favicon debe basarse en tu logo y en los colores de tu página web o tu identidad corporativa. Los favicons se muestran en todos los navegadores, independientemente del sistema operativo utilizado.

Generador de favicon IONOS

Con el generador de favicon de IONOS, puedes crear tu favicon personal e individual de tres maneras:

  • Editor gráfico: diseña en una cuadrícula de píxeles con varias herramientas y colores.
  • Generador de letras: escribe hasta dos letras y edítalas gráficamente.
  • Carga de imágenes: sube el logo de tu empresa u otro archivo de imagen, por ejemplo, para escalarlo automáticamente al tamaño del favicon.

Nota

El generador de favicon genera varios tamaños de salida para favicons e iconos táctiles (consulta el artículo Crear un icono Touch) basados en tu gráfico. Estos se ponen a tu disposición en un archivo zip al final del proceso.

Utilizar favicon

Ya dispones de un favicon en el formato de archivo «.ico». El favicon tiene unas dimensiones en píxeles de 16x16, 32x32 o 48x48.

Opción 1: Almacenamiento en el directorio base de su dominio
  • Cambia el nombre de archivo de tu favicon por el obligatorio por defecto «favicon.ico».
  • Sube este archivo vía FTP/sFTP al directorio base de tu espacio web.

Consulta el artículo Transferir archivos de forma segura con FTP para consultar cómo subir archivos a tu espacio web.

Opción 2: Referenciación mediante código HTML

Añade este código HTML al área <head> de tu página web:

<link rel="icon" href="/favicon.ico" type="image/vnd.microsoft.icon">.

La mayoría de los creadores de páginas web, como MyWebsite Now y los sistemas de gestión de contenidos, como WordPress, tienen su propia función para utilizar favicons.