TechBlogSD - Todo para WordPress y desarrollo WEB
Instrucciones de WEB y WordPress, noticias, reseñas de temas y complementos

¿Cómo agregar favicon en el sitio de WordPress?

1

Favicon es una forma abreviada de icono favorito. Microsoft lo introdujo por primera vez sobre el uso de Internet Explorer 5 en marzo de 1999. Más tarde, el Consorcio World Wide Web (W3C) estandarizó el uso de favicon en las recomendaciones HTML 4.01. Favicon también se conoce con muchos otros nombres como ícono de sitio, ícono de URL, ícono de marcadores, ícono de pestaña o ícono de acceso directo. Favicon se hizo popular desde que algún tiempo los motores de búsqueda los muestran en las páginas de resultados de búsqueda. Si está utilizando WordPress, es fácil agregar favicon a su sitio web y le explicaremos el proceso en este artículo.

Relacionado: ¿Cómo agregar favicon en el sitio gratuito de Weebly?

¿Por qué debería usar Favicon?

Dependiendo del navegador, puede ver favicon en diferentes lugares. En general, Chrome y muchos otros navegadores muestran el icono en la pestaña junto con el título de la página.

Ver favicon en la pestaña del navegador

En Mac, puede habilitar o deshabilitar la visualización de favicon en el navegador Safari. Del mismo modo, puede ver el favicon al cambiar de página en los navegadores móviles. Los favicons se utilizan para aumentar la visibilidad de la marca de un sitio web tal como se muestra en los navegadores. Los diferentes navegadores muestran favicon en diferentes lugares:

  • Mostrar en la pestaña del navegador
  • Se muestran como iconos de marcadores y en la lista de lectura
  • Se muestra en la barra de direcciones en algunos navegadores.
  • Icono fijado al fijar la pestaña
  • Ícono de la aplicación al agregar un acceso directo desde el navegador al escritorio o la pantalla de inicio en el dispositivo móvil

Además de los usos en el navegador, hay algunos otros factores de visibilidad. Los motores de búsqueda como Yandex muestran el favicon en los resultados de búsqueda como se muestra a continuación:

¿Cómo agregar favicon en el sitio de WordPress?

Resultados de búsqueda de Yandex

Google alguna vez muestra el ícono y alguna vez no. Sin embargo, el favicon también se puede usar como un ícono de escritorio o táctil de Apple. Esto actuará como el ícono de una aplicación en teléfonos inteligentes y tabletas cuando agregue el acceso directo a la página web.

En resumen, las empresas usan el favicon igual que el logotipo de su marca para que los usuarios puedan recordarlo fácilmente.

Uso general de favicon

El favicon es generalmente un archivo de icono de imagen con extensión .ico. Debe cargar la imagen en el directorio raíz de su sitio. Luego, la imagen del favicon se vincula al sitio utilizando la siguiente metaetiqueta en la sección del encabezado:

<link rel="shortcut icon" href="http://example.com/favicon.ico" />

El tamaño del favicon utilizado es de 16 x 16 píxeles.

¿Cómo agregar favicon en el sitio de WordPress?

Fue una molestia agregar favicon hasta la versión 4.2 de WordPress. Para simplificar las cosas, la adición de favicon se realizó como una funcionalidad principal a partir de la versión 4.3. El módulo "Icono del sitio" del complemento Jetpack se agregó al personalizador de WordPress como una función predeterminada y solo necesita una imagen sin ninguna otra necesidad de metaetiqueta o complemento.

Requisitos de imagen

El icono del sitio de WordPress necesita dos requisitos simples:

  • La imagen debe tener un tamaño cuadrado.
  • El tamaño mínimo debe ser de 512 x 512 píxeles.

No necesita usar una imagen .ico, simplemente prepare una imagen cuadrada .png, .jpg o .gif de 512px para usar como su favicon en el sitio de WordPress. El mismo icono se utilizará como icono de aplicación en todos los dispositivos móviles. Prepare una imagen con un tamaño más pequeño con una visibilidad clara utilizando software como Photoshop o Snagit. Recuerde que la imagen del favicon cambiará de tamaño a 16 x 16 px en la pestaña del navegador. Por lo tanto, prepare la imagen con color oscuro para aumentar la visibilidad. También puede probar nuestras herramientas gratuitas de generación de favicon para generar el archivo de imagen de icono para su sitio.

Subiendo imagen al sitio

Inicie sesión en su panel de administración y navegue hasta el menú "Apariencia> Personalizador". Haga clic en la opción "Identidad del sitio" como se muestra en la imagen de abajo.

¿Cómo agregar favicon en el sitio de WordPress?

Opción de identidad del sitio en el personalizador de WordPress

Haga clic en "Seleccionar imagen" y cargue su imagen de favicon.

¿Cómo agregar favicon en el sitio de WordPress?

Agregar el icono del sitio en el sitio de WordPress

Si subes un tamaño de imagen superior a 512 px, WordPress abrirá automáticamente la pantalla de imagen de recorte. Mueva el área de recorte para ver una vista previa instantánea de su favicon en el navegador y como el ícono de una aplicación en el panel izquierdo.

Opción de recorte de imagen para favicon

Una vez que se cargue la imagen, haga clic en el botón "Publicar".

¿Cómo agregar favicon en el sitio de WordPress?

Publicar sitio con Favicon

¡¡¡Eso es todo!!! Estás listo. Sin necesidad de inserción de metaetiquetas o complementos. Verifique su sitio en el navegador para ver que el favicon es efectivo al instante. Es posible que deba borrar el historial del navegador para eliminar las páginas almacenadas en caché y volver a cargar su página. En cualquier momento puede eliminar o cambiar el favicon de su sitio.

Problemas frecuentes con Favicon

Aunque es fácil cargar favicon en WordPress, los usuarios enfrentan algunos problemas frecuentes.

  • Google / otro motor de búsqueda no muestra el favicon en los resultados de búsqueda; esto ocurre generalmente debido al tamaño de su icono. Aunque WordPress necesita un tamaño de 512 píxeles, el tamaño recomendado de favicon es 16 × 16, 32 × 32 o 48 × 48 píxeles. El tamaño de imagen más grande puede crear problemas, ya que no es un tamaño recomendado. Sin embargo, debería funcionar para los sitios de WordPress, ya que puede verlo en el navegador de este sitio web. Si tiene problemas, elimine el icono del sitio en el personalizador y vuelva a cargarlo. También borre el caché si está utilizando el complemento de almacenamiento en caché y el almacenamiento en caché del lado del servidor si está disponible. Espere unos días para que Google pueda rastrear las páginas nuevamente y mostrar correctamente el ícono. Siempre que vea el ícono en el navegador, no debe preocuparse por si Google se muestra en el resultado de la búsqueda o no.
  • Icono poco claro en el navegador: esto sucede cuando intenta cambiar el tamaño de una imagen más grande a un tamaño más pequeño o viceversa. Recomendamos crear exactamente el tamaño necesario y cargar el archivo.
  • Favicon no visible en el navegador: en este caso, asegúrese de haber cargado la imagen correctamente y compruebe que puede abrir el archivo de imagen en el navegador correctamente.

Fuente de grabación: webnots.com
Deja una respuesta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More