Hosting WordPress Webempresa

Breadcrumbs en WordPress, Qué son y cómo configurarlos

por | Ago 17, 2022 | Aprender WordPress

Breadcrumbs en WordPress, Qué son y cómo configurarlos

Conoce qué son las migas de pan o breadcrumbs de WordPress y cómo influyen en el posicionamiento y el SEO de tu página web.

Pocas cosas son más frustrantes para un usuario que está navegando por un sitio web que no saber en qué página encuentra o dónde se localiza esta página en la estructura o arquitectura de dicho sitio.

Y ya sabemos qué ocurre cuando un usuario encuentra una dificultad, por leve que sea, al navegador por un sitio web: lo abandona y utiliza un buscador para localizar otra página que le dé solución a lo que necesita.

Se hace necesario, por tanto, de un mecanismo que mantenga informado al usuario de su localización dentro de la estructura jerárquica del sitio web, en relación con otros elementos, ya sea físicos (como páginas de nivel superior en la estructura) o conceptuales (por ejemplo, dentro de una categoría dentro de un catálogo de productos o servicios).

A primera vista, puede parecer que los menús proporcionan esta o parte de esta información, pero lo menús sirven principalmente como acceso rápido a páginas destacadas dentro de la arquitectura web: en general, no informan al usuario de dónde se encuentran o cómo han llegado hasta ahí.

Las migas de pan o, en inglés, breadcrumbs en WordPress, son la herramienta que, directa e inequívocamente, proporcionan esta información al usuario, junto con otras posibilidades que mejoran su capacidad de navegación.

A continuación, veremos en qué consisten estas migas de pan en WordPress, qué beneficios nos reportan, tanto desde el punto de vista del usuario como del posicionamiento orgánico en buscadores (SEO) y cómo podemos implantarlo en una página web en WordPress.

  Qué son las Breadcrumbs en WordPress

 

Aunque sea intuitivamente, todos tenemos una idea muy aproximada de lo qué es Breadcrumbs en WordPress. Al fin y al cabo, también somos usuarios de Internet y navegamos asiduamente, por lo que nos lo hemos encontrado a menudo.

Aunque, posiblemente, muchas veces no les hayamos prestado demasiada atención o incluso ni hayamos reparado en ellas. Su propósito principal es contestar a la pregunta “¿Dónde estoy, cómo he llegado hasta aquí y cómo puedo volver atrás o ir a otras páginas similares?”.

Para conseguir esta funcionalidad, las migas de pan “marcan” el camino que se debe seguir, a través de la arquitectura del sitio web, para llegar desde la página principal del sitio web (esto es, la portada) hasta la página que está visualizando el usuario.

Para hacernos una idea, la estructura de un rastro de migas de pan (breadcrumbs) tendrá un formato parecido al siguiente: Portada > Página nivel 1 > Página nivel 2 > … > Página actual

Habitualmente, como veremos en las buenas prácticas, cada nivel incluye un enlace a la página principal de ese nivel. El recuadro verde de la siguiente imagen muestra un ejemplo:

 

Breadcrumbs o rastro de migas de pan

Haz clic en la imagen para ampliarla  

 

En este caso, la página principal es el “Blog”, que no tiene enlace. El siguiente nivel del rastro de migas corresponde a una categoría de este blog, “WordPress”, que tiene un enlace a la página índice de dicha categoría.

Y, finalmente, está el título, truncado para que no sea demasiado largo, del artículo, que no tiene enlace puesto que es la página actual.

Gracias a este rastro de migas de pan, si el artículo actual no es de interés del usuario, éste puede ver que pertenece a una categoría, que tendrá más artículos sobre el tema y puede acceder directamente a la página de categoría para verlos.

 

Si os preguntáis el porqué de la expresión “migas de pan”, está basado en la historia de Hansel y Gretel, que utilizaron un trozo de pan para desmigarlo y dejar un rastro de migas por el camino que les permitiera volver después a su casa.

 

También se puede encontrar la expresión “hilo de Ariadna”, basado en la mitología griega del laberinto del minotauro, pero en este caso la cultura anglosajona se ha impuesto (como casi todo lo que se relaciona con Internet).

  Ventajas de los Breadcrumbs en WordPress

 

Raro es el sitio WordPress que no incluya breadcrumbs (en las buenas prácticas veremos en qué caso no es recomendable su utilización). Por tanto, debe aportar ventajas significativas como para que el esfuerzo de su implementación valga la pena para optimizar WordPress.

A continuación veremos cuáles son las ventajas de las migas de pan en WordPress, además de las más evidentes que se deducen directamente de su definición en el apartado anterior:

  • Mejora la experiencia de usuario pues, junto con los menús, ofrece una visión de la estructura del sitio web, y, por sí mismo, ubica al usuario en un lugar dentro de esa estructura, facilitando el acceso y la navegación a sus niveles superiores.
  • Reduce la tasa de rebote, puesto que si el usuario no sabe dónde se encuentra dentro del sitio web o la página que está viendo no satisface su inquietud, el rastro de migas le guía y le da la opción de navegar directamente a otras páginas de temática o contenido similar que sí podrían ser de su interés.
  • Favorece el SEO, desde dos perspectivas: como consecuencia directa de la mejor experiencia de usuario (fundamental en los algoritmos de búsqueda actualmente), y por la colocación en el breadcrumbs de enlaces y textos-ancla que los rastreadores de Google pueden utilizar para evaluar el posicionamiento de esas páginas.
  • Mayor visibilidad en los SERP’s; es decir, en los resultados de búsqueda. Si el rastro de migas está bien implementado, utilizando datos estructurados (como Schema), Google puede incorporar ese rastro en los resultados de búsqueda, haciéndolo más visible, como en la imagen siguiente, mediante fragmentos enriquecidos (“rich snippets”):
  • Fragmentos enriquecidos con breadcrumbs

  • Aumenta el control de navegación por parte del usuario, que dispondrá de una herramienta adicional, además de los menús, para navegar a través del sitio web. Con la ventaja añadida de que parte de un punto de partida conocido.
  • El coste de implementación es bajo y no usarlos no aporta ninguna ventaja, salvo casos excepcionales. Dicho de otra forma, añadirlos a las páginas “no molesta” al usuario, que solo los utilizara cuando los necesite (idealmente, casi nunca).

  Para qué sirven las Breadcrumbs

 

Como se ha podido ver, las Breadcrumbs no se incluyen como herramienta de navegación por el sitio web (para eso está fundamentalmente el menú de WordPress y los enlaces internos), sino para proporcionar al usuario las dos funciones siguientes:

  • 1. Ubicarlo dentro de la estructura, sea física o conceptual, del sitio web, de forma que sepa dónde se encuentra y, junto con el menú, comprenda mejor dicha estructura para navegar por ella.
  • 2. Facilitarle el acceso directo y rápido a niveles superiores de esta estructura, a través de enlaces internos, donde pueda encontrar con mayor acierto lo que está buscando.

Dado que las breadcrumbs “navegan” a través de la estructura del sitio web, ¿tiene sentido utilizarlos en sitios web planos o con pocas páginas?

Sitios web pequeños, con solo un nivel jerárquico (todas sus páginas cuelgan directamente de la portada), no aprovecharían las ventajas del rastro de migas, ni desde el punto de vista de navegación del usuario ni de optimización para el posicionamiento (que bastaría con enlaces internos).

Por tanto, en tales casos, no deberíamos incluir rastro de migas que, incluso, podrían dar una falsa apariencia al usuario de que el sitio web es más grande y quedarse frustrado que las migas no le llevan a ninguna parte de interés.

Por otro lado, añadir Breadcrumbs en WordPress es muy sencillo, por lo que si tenemos previsión de que el sitio web crecerá en el futuro, podremos implantarlos fácil y rápidamente cuando su utilidad tenga sentido (con solo una condición que veremos más adelante).

  Buenas prácticas de uso de las Breadcrumbs en WordPress

 

Un concepto tan sencillo como las breadcrumbs no significa que se pueda utilizar e implementar de cualquier forma, sino que hay que seguir una serie de buenas prácticas para aprovechar al máximo sus beneficios, especialmente para la optimización SEO.

Dado que su principal función es de cara al usuario, hay que ser cuidadoso en su presentación a éste, para que no le moleste cuando no lo necesite, pero que le aporte valor cuando el usuario lo requiera.

Así, las recomendaciones de buenas prácticas para utilizar Breadcrumbs incluyen los siguientes puntos:

  • El rastro de migas siempre debe empezar por la portada, no por una página interior. De lo contrario, el usuario no podrá ubicarse dentro de la estructura jerárquica del sitio web.
  • Se debe indicar el camino completo (todos los directorios o categorías) desde la portada, para que el usuario tenga acceso a todos los niveles.
  • Se debe colocar en la parte superior de la página, en un lugar visible pero discreto, que no interfiera con los elementos principales de navegación y contenidos.
  • La portada es la base de la jerarquía, no debe mostrar ningún rastro de migas.
  • Siempre que sea posible, utilizar palabras o frases completas, no abreviaturas o recortadas con puntos suspensivos.
  • La dirección web (URL’s) y el camino de las Breadcrumbs debe ser consistente; es decir, una reflejo de la otra. De lo contrario, el usuario se siente confundido por dos ubicaciones aparentemente distintas, al igual que los rastreadores de los buscadores.
  • No usarlas en sitios web con estructura casi plana y pocas páginas, pues no aportan valor ni al usuario ni a los buscadores.
  • Utilizar datos estructurados (Schema) validados por Google para favorecer la creación de fragmentos enriquecidos en los SERP’s.
  • En caso de utilizar Breadcrumbs basados en atributos (sitios eCommerce), prevenir la posible confusión del usuario si llega a un mismo producto por dos caminos distintos.
  • Todas las migas del rastro deben llevar un enlace a la página correspondiente, con un texto-ancla relevante desde el punto de vista del posicionamiento, excepto la miga de la página actual, que no debe llevar enlace.
  • Las migas de pan son un recurso complementario de navegación. No se debe eliminar ni modificar la navegación principal, basada en menús, del sitio web.
  • Las Breadcrumbs se sitúan dentro de la página, no en el título de la ventana del navegador, que deberá llevar un texto propio relevante y significativo para el posicionamiento.

  Cómo influyen las Breadcrumbs en el SEO del sitio

 

Hasta ahora hemos nombrado varias veces los efectos positivos que las Breadcrumbs tienen en el posicionamiento orgánico en buscadores (SEO).

  • Mejoran la experiencia de usuario, reduciendo la tasa de rebote y aumentando el tiempo de permanencia en el sitio web. Ambos factores afectan al posicionamiento de una página en las búsquedas.
  • Los enlaces del rastro de migas de pan suponen una oportunidad más para añadir textos-ancla relevantes, con variaciones de las palabras clave, a cada nivel de la estructura jerárquica. Se debe evitar la sobre optimización de textos-ancla y siempre ofrecer un texto relevante y natural para los usuarios, no para los rastreadores.
  • Igualmente, esos enlaces fortalecen el enlazado interno de las páginas principales de cada nivel, mejorando su posicionamiento en los buscadores.
  • La implementación de las Breadcrumbs deben incluir un esquema de datos estructurados en WordPress (como Schema) para que Google, si lo considera oportuno, las incluya en los resultados de búsqueda como fragmento enriquecido.
  • Este esquema de datos estructurados no solo ofrece información de la estructura del sitio web a los usuarios, sino que los rastreadores lo utilizan también para determinar la arquitectura web del sitio.
  • Su sencillez de implementación tiene escaso o nulo impacto en el rendimiento y velocidad de navegación del sitio web, por lo que no penaliza su posicionamiento.

  Cómo instalar y activar las Breadcrumbs en WordPress

 

Ahora que tenemos claro qué son las Breadcrumbs o migas de pan en WordPress, cuál es su función principal y los efectos que tiene sobre el posicionamiento orgánico, queremos instalarlas en nuestro sitio web en WordPress… ¿Cómo podemos hacerlo?

Disponemos de tres alternativas de implantación de las Breadcrumbs:

  • Código personalizado. Consiste en editar los ficheros .PHP de nuestro sitio web e incluir las instrucciones de código que muestre el rastro de migas para cada página. Requiere conocimientos de la API de programación de WordPress y de su arquitectura.
  • Tema sin soporte de Breadcrumbs. Si el sitio web tiene un tema que no está preparado para incluir migas de pan, se puede instalar un plugin de WordPress con esta función. Sin embargo, requiere editar algunos ficheros .PHP e incluir las líneas de código, siguiendo las instrucciones del manual del plugin.
  • Tema con soporte para plugins de Breadcrumbs.La solución más rápida y sencilla. Basta instalar el plugin con el que nuestro tema sea compatible y configurarlo para que tenga la apariencia y funcionalidad que nos interese.

Actualmente, muchos temas incluyen ya sea soporte propio de Breadcrumbs (es decir, implementado en su código) o para los plugins más populares de Breadcrumbs en WordPress. Salvo que nos encontremos cómodos modificando los ficheros .PHP de WordPress, deberíamos procurar utilizar esos temas.

A continuación veremos dos vídeos para ver cómo instalar y configurar dos de los plugins más utilizados para incorporar migas de pan en nuestro sitio web.

  Breadcrumbs con el plugin Yoast SEO para WordPress

 

El plugin Yoast SEO para WordPress incluye una funcionalidad básica de “migas de pan”, suficiente para sitios pequeños y medianos. Algunos temas incluyen por defecto posibilidades de configuración en su personalización.

En las configuraciones de Yoast SEO, en Apariencia del buscador, en la pestaña Migas de pan encontrarás la configuración de estas para tu instalación de WordPress.

Configurar migas de pan en Yoast SEO

En el siguiente vídeo puedes ver el proceso de configuración para activarlas.

 

  Breadcrumbs con el plugin Breadcrumb NavXT

 

El plugin Breadcrumbs NavXT para WordPress, en cambio, ofrece migas de pan con muchas posibilidades de configuración, muy útil para sitios web grandes y portales de comercio electrónico. Más complejo que el Yoast SEO, también dispone de Widgets para facilitar su inclusión en distintas zonas de nuestras páginas web:

 

  Breadcrumbs con el plugin Rank Math SEO

 

Al igual que hicimos en el plugin Yoast SEO para configurar “breadcrumbs” con el plugin Rank Math SEO sucede lo mismo y es importante activarlo para que el usuario tenga una mejor experiencia de navegación por el sitio web.

Migas de Pan en Rank Math SEO
 

La funcionalidad de “migas de pan” en el plugin Rank Math SEO solo está disponible en la versión comercial (de pago) PRO.

 

Las opciones configurables para “breadcrumbs” en Rak Math SEO son:

  • Carácter separador (Separator Character)
  • Mostrar enlace de la página de inicio (Show Homepage Link)
  • Etiqueta de la página de inicio (Homepage Label)
  • Enlace de la página de inicio (Homepage Link)
  • Prefijo Breadcrumb (Prefix Breadcrumb)
  • Formato de archivo (Archive Format)
  • Etiqueta (Label)
  • Ocultar el título de la entrada (Hide Post Title)
  • Mostrar categoría (Show Category)
  • Ocultar el nombre de la taxonomía (Hide Taxonomy Name)

Puedes consultar la documentación oficial de Rak Math SEO sobre “breadcrumbs” para conocer detalles y opciones adicionales de configuración del plugin.

  Breadcrumbs en WooCommerce

 

Como todo plugin de WordPress, también WooCommerce puede ser configurado a nivel “migas de pan” sobre todo si tienes en cuenta que una tienda creada con este plugin puede albergar cientos o miles de subpáginas de productos, por lo que facilitar la navegación y sobre todo “mostrar la ruta de navegación” al visitante o comprador, es esencial si quieres garantizar una buena experiencia durante el proceso de compra.

Por suerte para ti, por defecto, WooCommerce añade breadcrumbs a las páginas de productos y archivos. Sin embargo, no añade Breadcrumb Schema.

Con el plugin Rank Math SEO puedes añadir Breadcrumb Schema en WooCommerce sin perder ventajas de las opciones de personalización que Rank Math ofrece para Breadcrumbs.

Si optas por esto tendrás que desactivar la función de breadcrumbs por defecto en el Tema en uso añadiendo una función que haga esto de forma global para WooCommerce y sus productos.

Puedes utilizar plugins como Code Snippets para añadir la función de forma sencilla sin tener que editar archivos de código de tu Tema.

La función en cuestión es la siguiente:


/** Función para desactivar las migas de pan de WooCommerce */
function remove_wc_breadcrumbs() {
remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20, 0 );
}
add_action( 'init', 'remove_wc_breadcrumbs' );

Una vez desactivadas las “migas de pan” nativas de WooCommerce podrás hacer uso de la funcionalidad de “breadcrumbs” de Rank Math SEO y así unificar el método para todo el sitio web, sobre todo si además en tu tienda utilizas un Blog.

  Conclusiones

 

Solemos prestar poca atención a un elemento presente en prácticamente todos los sitios web: las Breadcrumbs de WordPRess o rastro de migas de pan. Y casi siempre en la misma parte de la página web: parte superior, izquierda o derecha, justo debajo de la cabecera.

Sin embargo, cuando lo necesitamos, ya sea porque hayamos navegado por varias páginas del sitio web y nos hayamos perdido dentro de su estructura, o porque queremos consultar páginas de niveles superiores, esperamos encontrarlo ahí y que nos sirva de guía para conseguir más información.

Pero no solo su impacto es positivo para los usuarios, sino que, desde el punto de vista de la optimización del posicionamiento orgánico (SEO), las Breadcrumbs ofrecen información a los buscadores para evaluar y posicionar las páginas, tanto por el enlazado interno que potencia, sino por su inclusión en los resultados de búsqueda como fragmentos enriquecidos.

La incorporación de Breadcrumbs en webs WordPress, gracias a los plugins, es muy sencilla, destacando el Yoast SEO, para webs pequeñas y medianas, y el Breadcrumbs NavXT, para webs de mayor envergadura.

En ambos casos, la situación ideal es que el tema sea compatible con el tema, de forma que no requiera insertar código PHP en los ficheros del sitio web. De no ser así, ambos plugins disponen de guías para hacerlo y, dada su popularidad, la documentación técnica de los temas también incluyen sus propias guías.

¿Te ha resultado útil este artículo?

Hosting Divi - Wp Fácil - Webempresa