¿Qué es un favicon?
Para aquellos que no sepan qué es un favicon, les daremos una pequeña ayuda que les permitirá estar al tanto de las cosas. Un favicon es un pequeño icono de 16x16 o 32x32 píxeles, que suele contener un logo, la primera letra de la marca o una imagen característica que refleja el tipo de negocio o la temática del sitio.
¿Por qué es importante el favicon?
El favicon realiza las siguientes funciones:
Marca.
Identificación del sitio por parte del usuario (usabilidad).
Da al sitio web un aspecto profesional.
Detengámonos en más detalle sobre las principales ventajas de usar un favicon.
Reconocimiento de marca
Un favicon es como una pequeña identidad de sitio. Como se indicó en la introducción, el favicon ayuda al usuario a recordar su sitio entre los muchos sitios que ha visitado. Ya sea que se trate del historial de navegación, los resultados de búsqueda de Google o la lista de sitios marcados en su navegador, los íconos de página ayudan a los usuarios a reconocer y visitar fácilmente su sitio.
La confianza
Los usuarios tienden a juzgar a los vendedores de bienes y servicios en Internet en función de la profesionalidad de su sitio web. La falta de un favicon (los motores de búsqueda muestran un sitio sin un favicon con un icono de documento en blanco) puede conducir fácilmente a una pérdida de credibilidad, especialmente cuando los usuarios lo comparan con sus competidores.
Visitas repetidas
Se sabe que las personas responden mejor a las imágenes que al texto. Ahora, suponga que un visitante de su sitio tenía prisa cuando lo visitó por primera vez y decidió marcarlo para volver más tarde. Digamos que esta persona posteriormente decide volver a visitar su sitio, por lo que hace referencia a sus marcadores. Estás de suerte si tienes un favicon reconocible, como la prominente y única letra G de Google, y el usuario te encontrará. Si no hay un favicon, es posible que incluso lo eliminen de la lista de marcadores.
Ahorra tiempo al usuario
Los favicons ahorran el tiempo que el usuario dedica a identificar un sitio en marcadores, historial u otros lugares donde el navegador coloca un favicon para una identificación rápida. Simplemente hace la vida más fácil para el visitante promedio de su sitio.
Beneficios SEO
Si su sitio tiene un favicon, será mejor visible en los resultados de búsqueda que los sitios que no lo tienen y, por lo tanto, podrá atraer más visitantes.
¿Cómo creo un favicon?
Existen muchas herramientas para crear un favicon en minutos. Si no tiene habilidades de diseño o no sabe cómo hacer esto, puede intentar generar un favicon usando Logaster.
Para hacer esto, siga las instrucciones paso a paso:
Paso 5. Crea un favicon
Ahora que tiene un logotipo, haga clic en "Crear un favicon con este logotipo" en la página del logotipo.
Paso 6. Seleccione el diseño de favicon deseado
Al igual que con el logotipo, Logaster generará docenas de favicons hermosos y listos para usar. Elige el diseño que más te guste. Una vista previa le permitirá ver cómo se verá su favicon en el sitio.
Si necesita cambiar el favicon, puede hacerlo mediante la edición del logotipo, ya que los favicons se crean en función del diseño del logotipo. Por lo tanto, si desea, por ejemplo, un color de favicon diferente, debe volver a la página del logotipo, cambiar su color y luego crear el favicon nuevamente.
Puede encontrar inspiración para un favicon en los sitios:
Paso 7. Descarga el favicon
Puede comprar el favicon por separado por $ 9.99 o comprar el paquete de diseño, que incluye no solo el favicon, sino también el logotipo, la tarjeta de presentación, el sobre y el membrete. Puede averiguar cómo comprar el paquete de diseño.
Después del pago, puede descargar el favicon en formatos ico y png.
¿Dónde puedo usar un favicon?
Puedes usar un favicon:
En el sitio;
Dispositivos móviles. El usuario puede agregar un favicon a la pantalla de inicio de su dispositivo (algo así como un marcador) - Android, IOS, Windows Phone, etc.;
Programas y aplicaciones para PC / Mac.
¿Cómo instalar un favicon en un sitio web?
Después de recibir un favicon, su instalación en el servidor no tardará más de un par de minutos y se realiza en dos etapas. Para hacer esto, necesitará acceso al directorio raíz de su sitio y un editor de texto para cambiar el HTML del sitio.
Paso 1.Debe cargar el archivo favicon.ico en el servidor. Para hacer esto, necesita descargar e instalar un cliente ftp como FileZilla. Luego ingrese su nombre de usuario y contraseña y cargue el archivo. Puede leer instrucciones más detalladas sobre cómo descargar el archivo favicon.
Paso 2.Ahora necesita editar la página HTML de su sitio para ayudar a los navegadores a encontrar su imagen de favicon. Con la ventana FTP abierta, busque y descargue el archivo index.html o header.php del servidor.
Abra el archivo index.html en un editor de texto: Bloc de notas, Bloc de notas ++, Sublime Text.
Si su sitio contiene HTML puro, pegue el código personalizado en el área HEAD del archivo index.html.
El código se puede copiar en la página de favicon del sitio web de Logaster.
Si está utilizando WordPress, pegue el código a continuación en el área HEAD de su archivo header.php.
Una vez hecho esto, suba el archivo a donde lo obtuvo. ¡Hecho! Vuelva a cargar la página de su sitio para ver el favicon.
La mayoría de los navegadores modernos son lo suficientemente inteligentes y pueden encontrar el archivo favicon incluso sin dicho código, pero solo si el favicon tiene una imagen de 16x16 píxeles, el nombre favicon.ico y está guardado en el directorio raíz de su sitio.
Esperamos que este artículo le haya brindado información útil para ayudarlo a crear un favicon que hará que su sitio sea más exitoso y atractivo.
Favicon (abreviado del inglés FAVorites ICON - "icono de favoritos", del nombre de la carpeta con marcadores en MSIE) - el icono de un sitio web o página web. El navegador lo muestra en la barra de direcciones antes de la URL de la página, así como en una imagen junto al marcador, en pestañas y en otros elementos de la interfaz.
La mayoría de los sitios web profesionales tienden a tenerlos, por un lado, esto no solo colocará a su sitio en la fila de profesionales, sino que también lo ayudará a diferenciarse del resto de los sitios.
Si quieres uno, entonces este es un ícono muy fácil con nuestro generador. Todo lo que necesita es una imagen (de cualquier tamaño), envíela usando el formulario a continuación, y en unos segundos tendrá varias imágenes comprimidas nuevamente para usar como un favicon. ¡Es realmente fácil!
La mayoría de las versiones de los principales navegadores admiten favicons. Por ejemplo, Internet Explorer 5/6/7 +, Firefox 1/2 +, Mozilla 1/2 +, Netscape 7+, Opera 7+, Avant 1.1, Konqueror 3 +, Safari y otros.
Imagen original (tamaño máximo: 150 KB):
Favicon: la cara de su recurso en el navegador
Muy a menudo, al abrir un sitio en un navegador, los usuarios ven un pequeño icono junto a la URL del recurso: favicon, que, de hecho, es el rostro de un proyecto de Internet. Favicon es una abreviatura de la frase en inglés "icono de favoritos", que significa "icono de favoritos". Si ha "equipado" su recurso con un favicon, entonces podrá destacar favorablemente en el contexto de otros sitios abiertos por el usuario en las pestañas del navegador. Muy a menudo, un favicon es una copia en miniatura del logotipo de un proyecto o empresa de Internet (por ejemplo, como el de Wikipedia, Google o Facebook), pero también puede ver iconos especialmente creados que simplemente reflejan la esencia o el tema del proyecto. El primer favicon apareció en 1999, cuando la corporación de búsqueda Microsoft presentó su navegador web Internet Explorer 5: fue en esta versión del navegador donde comenzó el soporte para iconos en miniatura para sitios. Y en 2003, el formato de favicon se registró oficialmente con la Autoridad de Números Asignados de Internet (IANA). Ahora Microsoft ha perdido su monopolio en este nicho, y todos los navegadores modernos (tanto de escritorio como móviles) admiten favicons. ¿Para qué sirve la herramienta Favicon Generator? Con la herramienta "Favicon Generator" puede crear un favicon único para su sitio. Para hacer esto, solo necesita cargar la imagen original en un campo especial, cuyo tamaño no debe exceder los 150 Kb, seleccione el tamaño requerido del icono futuro (16x16 o 32x32 píxeles) y haga clic en el botón "Convertir". El icono resultante en formato ICO se puede utilizar para publicar en la Web: será compatible con la mayoría de los navegadores modernos. Tenga en cuenta que muchos navegadores web modernos cargan automáticamente favicon.ico desde la raíz del recurso sin necesidad de especificarlo en los códigos de página. Sin embargo, si el webmaster desea utilizar un favicon separado para cada página del sitio, debe indicar su posición dentro de la sección en el código HTML del recurso. También tenga en cuenta que el icono no se mostrará en el navegador si su tipo de contenido en la respuesta del servidor web no coincide con el campo de encabezado especificado en el código de la página. ¿Cómo debería verse un buen favicon? A pesar de que el tamaño del favicon es muy pequeño (16x16 o 32x32 píxeles), este icono tiene una carga semántica muy grande, y su creación es un proceso bastante complicado que lleva a los diseñadores web tanto tiempo como el desarrollo de un completo logotipo de pleno derecho. A menudo sucede que el logotipo de una empresa es absolutamente inapropiado para el papel de un favicon. En este caso, tendrás que utilizar toda tu habilidad e imaginación. El futuro favicon debería estar incrustado en la memoria del usuario con tanta fuerza que en el futuro este icono se asociará exclusivamente con su recurso. Al crear un favicon, no podrá "dispersar" píxeles: cada uno de los 256 (o 1024) píxeles tiene un significado. Ajuste de antemano manualmente los píxeles que tienen un color "brumoso", porque al comprimir una imagen, el icono puede resultar borroso y requerirá corrección en un editor de gráficos. Tenga en cuenta que el editor de fotos de Adobe Photoshop no guarda imágenes en formato ICO, por lo que puede convertir una imagen a este formato utilizando nuestro servicio "Favicon Generator".
Favicon Generator es un servicio en línea gratuito que le permite crear iconos e insignias (archivo favicon.ico) para su sitio web. Esta herramienta le permite crear favicons de todos los tamaños populares, como: 16x16, 32x32, 48x48, 64x64, 128x128. Seleccione el tamaño y la imagen (JPG, GIF, PNG) que desea convertir al formato ICO desde su computadora y haga clic en Crear.
Crear favicon
Para crear un favicon necesitas:
- Seleccione el tamaño de su favicon
- Seleccione el archivo y haga clic en Crear favicon
- Guarde el Favicon resultante en su computadora
¿Cómo agregar un favicon a su sitio?
Nota. Si el enlace al favicon se especifica varias veces en el código HTML de la página, el robot seleccionará el icono de su elección. Por ejemplo, se indican 2 iconos diferentes para corresponder a diferentes motores de búsqueda.
Requisitos de Yandex para favicon
Nota: Para que se muestre en los resultados de búsqueda, Yandex descarga un favicon de la versión HTTPS del sitio, si está disponible. De lo contrario, no se muestra el favicon.- El tamaño: 16 × 16, 32 × 32, 120 × 120 píxeles.
- Formato: ICO (recomendado), GIF, JPEG, PNG, BMP.
Requisitos de favicon de Google
- Tamaño: el icono del sitio debe ser cuadrado y tener un múltiplo de 48 píxeles, por ejemplo: 16 × 16, 48 × 48, 96 × 96, 144 × 144 pixeles
- Formato: ICO (recomendado), GIF, JPEG, PNG, BMP.
- Asegúrese de que el ícono del sitio se vea bien a 16x16 píxeles, ya que el ícono se escalará para aparecer en los resultados de búsqueda. Tenga en cuenta que no debe agregar un icono de 16 x 16 píxeles.
- El icono del sitio debe servir como representación gráfica de su marca. Esto ayudará a los usuarios a reconocer rápidamente su sitio al mirar los resultados de búsqueda.
Visualización de favicons
Si el robot ha subido un favicon, aparecerá en los resultados de búsqueda en por dos semanas.Generador de favicon: lo ayudará a transformar y editar cualquier imagen, convirtiéndola en un favicon para el sitio. Hoy es un artículo sobre el mejor generador de favicon para sitios de hoy.
Ahora es difícil imaginar un sitio que no tenga favicon. Un favicon es un icono que se encuentra en la barra de direcciones del navegador o en el título de la ventana (dependiendo del navegador), y que distingue el sitio / pestaña abierta de muchos otros. Inicialmente, estos iconos se diseñaron en IE para resaltar un sitio en la lista de marcadores del navegador (en IE, estos marcadores se llamaban Favoritos y, por lo tanto, el nombre Favicon, el icono de favoritos).
Pero hacer un favicon con tus propias manos no es tan fácil. Debe tener un formato ICO que requiera un software especial para hacer algo que valga la pena y una habilidad considerable. Por lo tanto, para simplificar la vida, es mejor usar un generador de favicon en línea.
Hay muchos servicios que le permiten generar un favicon a partir de imágenes (puede ser un logotipo o una ilustración especialmente diseñada). Pero la mayoría de ellos tienen problemas de transparencia.
Problemas de transparencia con el servicio generador de favicon
Para mayor claridad, presentamos la ilustración "Cómo los diferentes generadores de favicon manejan la transparencia y la reducción de imagen".
En esta comparación, usamos los resultados de los servicios favicon.cc y favicon-generator.org. Para ser honesto, hasta hace poco, ellos mismos usaban el servicio favicon.cc, pero recientemente hubo un excelente sustituto: el generador de favicon # 1.
Mejor generador de favicon - www.xiconeditor.com
Al igual que favicon.cc, este generador de favicon tiene su propio editor de iconos en línea incorporado, pero su ventaja es que funciona muy bien con transparencia.
Es bastante obvio que hay una diferencia en la calidad de la transferencia de transparencia (aparentemente la diferencia está en la calidad de cambiar el tamaño de la imagen cargada).
Además, xiconeditor.com tiene otra ventaja: un excelente sistema de vista previa de favicon, que le permite ver el resultado en diferentes formas sin cargar el favicon generado. Sus vistas previas son mucho más informativas que favicon.cc.
