Breadcrumbs o migas de pan son una de las ayudas de navegación más antiguas en los sitios web y siguen teniendo una función útil para mejorar la experiencia del usuario (UX), y al igual que las paginaciones, es una buena manera de incrementar el rastreo por parte de los motores de búsqueda aportando rutas adicionales de acceso a distintas URLs de un sitio.
Proporcionan una manera muy fácil de hacer clic hacia una página principal, una página de categoría / índice o la página de inicio de un sitio web sin tener que depender del botón «Atrás» del navegador.
Sin embargo, las breadcrumbs también tienen un impacto significativo en la optimización de motores de búsqueda. Van desde la capacidad de los robots de los motores de búsqueda para rastrear correctamente tu sitio web, hasta cómo aparecen tus páginas en los resultados de búsqueda (SERP).
En este artículo, veremos la definición de rutas de navegación de sitios web y algunas de las diferentes formas en que se pueden implementar, tanto para fines de navegación como para SEO.
¿Qué vas a leer?
Las breadcrumbs proporcionan información útil para los usuarios. Debido a que reflejan la posición de la página en la jerarquía general del sitio, actúan como un fragmento del mapa del sitio para que el usuario pueda ver de un vistazo dónde está la página actual en relación con la categoría principal.
Esto tiene implicaciones para los robots de los motores de búsqueda que rastrean la página, pero también puede ayudar a los visitantes humanos a encontrar otro contenido relacionado en la misma categoría o área de tu sitio web.
Por lo general, las rutas de navegación aparecen como una línea de texto dividida en enlaces individuales a las páginas actual y anterior y/o a páginas de nivel superior en la jerarquía del sitio web.
Puedes encontrar un ejemplo de breadcrumbs en acción en la parte superior de esta misma publicación de blog. Puede encontrar una captura de pantalla a continuación:
Esas mismas rutas de navegación aparecerán en las SERP de Google, donde se muestran en la parte superior de cada resultado de búsqueda, para darle al resultado un contexto jerárquico.
Técnicamente, no hay ninguna motivo por el que no debas implementar una ruta de navegación en cualquier lugar de tu sitio web. Entonces, si tienes la posibilidad de incluir un breadcrumb tanto en el footer como en el header de tu web, son todo beneficios.
Cualquier cosa que proporcione contexto adicional a los robots de los motores de búsqueda puede ser útil en la optimización del rastreo, pero las rutas de navegación en las webs pueden:
- Ayudan a los robots de búsqueda a descubrir más páginas en su sitio web siguiendo sus enlaces de ruta de navegación.
- Es probable que incluyan palabras clave de SEO como texto de anclaje para sus enlaces de ruta de navegación.
- Ayudan a los visitantes humanos que llegan a una página desde los resultados de búsqueda a moverse a otras partes de su sitio, mientras que el botón de retroceso regresa a la página de resultados de búsqueda de la que provienen.
La combinación de estos beneficios hace que las breadcrumbs sean una forma poderosa de ayudar a la optimización de motores de búsqueda de sus páginas, a menudo junto con otras tácticas como mapas del sitio para todo el sitio y la optimización de su contenido principal.
La implementación de rutas de navegación en un sitio web como una función de navegación depende del tipo de ruta de navegación que planeas utilizar, así como de tu CMS y cualquier otra herramienta que utilices para editar sus páginas web.
Breadcrumbs en código HTML
En su forma más simple, una ruta de navegación solo se puede crear utilizando una serie de hipervínculos HTML, generalmente separados por un guión, una barra vertical o un símbolo de flecha.
Sin embargo, si cambias la jerarquía de tu sitio web o de un artículo, editar manualmente todas las rutas de navegación página por página llevará mucho tiempo y será laborioso.
Breadcrumbs en un CMS
Los plugins SEO populares como Yoast SEO o Rank Math para WordPress pueden agregar rutas de navegación a tus páginas, y los diferentes complementos tienen diferentes opciones para personalizar su apariencia.
Si estás utilizando un CMS, un blog alojado u otra plataforma de comercio electrónico diferente, verifica si las rutas de navegación son compatibles como parte de las plantillas de página para no tener que agregarlas página por página.
Hacia fines de 2019, las páginas de resultados del motor de búsqueda de Google ya no mostraban la URL sin procesar para cada resultado, sino que mostraban una serie de rutas de navegación que apuntaban a la página de destino con un poco más de contexto para su posición en el sitio web principal.
Si bien esto se hace automáticamente, hay formas de influir en las rutas de navegación que aparecen para tus páginas cuando están en las SERP de Google.
Google lanzó unas directrices detalladas sobre las rutas de navegación para que los desarrolladores de sitios web y los SEO comprendan mejor los datos estructurados, generalmente recomiendan el marcado estandarizado de Schema.org.
Al pegar los datos estructurados correctamente en el lugar correcto de su página, puede decirle a Google directamente qué rutas de navegación desea asociar con su página.
Google ofrece su herramienta de prueba de resultados enriquesidos para validar la correcta implementación del código y comprobar que todo funciona según lo previsto.
Si realizas cambios en páginas que ya se han publicado, puedes utilizar las herramienta de inspección de URL para comprobar cómo ve Google el contenido antes de rastrearlo e indexarlo nuevamente, incluidos los datos estructurados.
Schema.org se ha convertido en el estándar para incluir datos estructurados en páginas web especialmente desde que la página de testeo de Google redirige a la web de esteo de Schema.org; y, a menudo, se menciona como un formato aceptable en las pautas para desarrolladores de Google.
Para incluir un breadcrumbs como datos estructurados en el código de tu página, debes agregar un elemento de Schema.org usando el @type ‘BreadcrumbList’.
Dentro de este elemento, luego agrega una serie de itemListElements con el @Type ‘ListItem’ y le das a cada elemento un nombre, una URL (si es necesario) y una posición (de acuerdo con su posición en la ruta de navegación).
Cada ruta de navegación debe tener al menos lo siguiente:
- Un elemento BreadcrumbList.
- Dos o más ListItems.
- El último ListItem debe apuntar a la propia página actual.
Puedes definir varias BreadcrumbLists en la misma página si se puede acceder a la página de diferentes maneras, y si solo usa una línea de hipervínculos HTML visibles en lugar de datos estructurados de Schema.org, es aceptable para fines de SEO tener más de uno también.
¿Merecen la pena las rutas de navegación del sitio web? La respuesta es sí, de lo contrario no habrían estado allí tanto tiempo.
Como característica básica de HTML, una ruta de navegación es muy útil para la navegación y le brinda cierto control sobre cómo se mueven tus usuarios en lugar de depender de los botones de retroceso del navegador, que pueden no funcionar como se esperaba.
Para la optimización de motores de búsqueda, las rutas de navegación son más importantes que nunca para que tus páginas se muestren en contexto en las SERPs. Son compatibles específicamente con Google mediante HTML estructurado y marcado de datos estructurados de Schema.org.