¿Qué es un favicon y para qué sirve?
Definición de favicon
Un favicon es un ícono pequeño que se utiliza como identificador visual de un sitio web. El término «favicon» proviene de la combinación de las palabras «favorito» e «icono», ya que originalmente se utilizaba en los navegadores web para marcar un sitio web como favorito o agregarlo a la lista de marcadores.
El favicon aparece en la pestaña del navegador junto al título de la página web, y también se muestra en la barra de direcciones, en los marcadores y en los resultados de búsqueda. Por lo general, tiene un tamaño de 16×16 píxeles o 32×32 píxeles y se representa en formato de imagen, generalmente en formato ICO, PNG o GIF.
¿para qué sirve un Favicon?
La función principal de un favicon es proporcionar una identidad visual reconocible y distintiva para un sitio web. Ayuda a los usuarios a identificar rápidamente un sitio web en medio de múltiples pestañas abiertas, mejora la experiencia del usuario y brinda coherencia visual a la marca o el tema del sitio web.
Además de su uso en navegadores web, los favicons también pueden ser utilizados por aplicaciones móviles y otros sistemas que admitan íconos personalizados.
¿Cómo añadir favicon a tu web?
Para añadir un favicon a tu sitio web, puedes seguir los siguientes pasos:
-
-
-
- Crea tu favicon: Diseña o selecciona una imagen que deseas utilizar como favicon. Asegúrate de que tenga un tamaño cuadrado, preferiblemente de 16×16 píxeles o 32×32 píxeles, para garantizar la mejor visualización.
- Guarda la imagen: Guarda tu favicon en un formato de imagen admitido, como ICO, PNG o GIF. Asegúrate de recordar la ubicación y el nombre del archivo.
- Sube el archivo a tu sitio web: Accede al servidor o panel de control de tu sitio web y busca la carpeta raíz, donde se encuentran los archivos principales de tu sitio. Si utilizas un administrador de contenido como WordPress, busca la opción «Apariencia» y «Personalizar» para subir el favicon.
- Renombra el archivo si es necesario: Si tu archivo de favicon no se llama «favicon.ico», renómbralo a ese nombre para asegurarte de que los navegadores lo reconozcan correctamente.
- Añade el código HTML: Abre el archivo HTML de tu sitio web (generalmente se llama «index.html») en un editor de texto. Añade el siguiente código dentro de la sección «<head>» del archivo HTML, justo antes de la etiqueta «</head>»:
<>link rel=»icon» href=»ruta/al/favicon.ico» type=»image/x-icon»</> - Guarda y sube los cambios: Guarda los cambios realizados en el archivo HTML y sube el archivo actualizado al servidor.
- Verifica el resultado: Abre tu sitio web en un navegador y verifica si el favicon se muestra correctamente en la pestaña y en la barra de direcciones. Si no aparece de inmediato, puede ser necesario borrar la caché del navegador o esperar un poco para que se actualice.
¿Logo o Favicon en los resultados de búsqueda de Google?
El favicon también puede aparecer en las SERP de Google. La pequeña imagen que aparece al lado del la URL en los resultados de búsqueda de Google (SERP) es porque esa web ha subido el favicon y Google lo ha reconocido como tal.
¿Necesitas posicionamiento web?. ¿Quieres que tu página web esté en las primeras posiciones de los buscadores?. Contacta con Berbel
-
-
