Pese a que Google extrañamente las llame «Rutas de navegación/exploración», oficialmente los/as profesionales del mundo del SEO conocemos a esta característica como Breadcrumbs o Migas de Pan. Últimamente, se están produciendo muchas novedades al respecto y es por eso que hemos decidido hacer una guía en la cual te mostramos qué son, como se implementan paso a paso, maneras de validar una implementación y finalmente, cómo monitorizar su progreso en Search Console.

¡Vamos allá!

¿Qué son los Breadcrumbs o Migas de Pan?

Los Breadcrumbs o Migas de pan son una característica cuya finalidad es mejorar la navegación del usuario e indicar claramente, tanto a los motores de búsqueda como a los usuarios, la jerarquía de las páginas. De esta manera, se permite que el usuario visite rápidamente tanto la la página final como las categorías a las cuales pertenece esta página.

Maneras de implementar los breadcrumbs

A nivel de implementación, actualmente tenemos dos posibilidades, la opción visible para los usuarios y la opción en código. Realmente, ambas deberían de ser siempre implementadas conjuntamente y no por separado.

Visible

En la opción visible, la web implementa los breadcrumbs o migas de pan en la parte superior de cada página para que el usuario que visita la página, sepa perfectamente dónde está. Por ejemplo, si estamos viendo un ficha de producto de un ecommerce (un ordenador HP Envy), en las migas de pan, veríamos lo siguiente:

Inicio > Ordenadores > HP > Envy

De esta manera, le estamos indicando al usuario que el producto que está viendo se engloba dentro de la categoría ordenadores y que además pertenece a la familia de ordenadores HP. A nivel de navegación, esta funcionalidad es muy importante ya que si el usuario quisiera ver más modelos HP o seguir viendo ordenadores, esto estaría a golpe de clic.

Sin esta funcionalidad, esta navegación se convierte mucho más difícil y las posibilidades de que el usuario abandone la web son mucho más altas.

Código

Si la anterior opción nos permitía añadir las migas de pan para el usuario, esta opción lo que hará es decirle a los motores de búsqueda de qué manera están categorizados nuestros contenidos. Es muy importante que esta implementación esté correctamente realizada ya que Google no entiende los breadcrumbs que son solo visibles.

A continuación, puedes ver un ejemplo de implementación de Breadcrumbs o migas de pan mediante un fragmentos de script JSON-LD.

<script type=»application/ld+json»>
{
«@context»: «https://schema.org»,
«@type»: «BreadcrumbList»,
«itemListElement»: [{
«@type»: «ListItem»,
«position»: 1,
«name»: «Books»,
«item»: «https://example.com/books»
},{
«@type»: «ListItem»,
«position»: 2,
«name»: «Authors»,
«item»: «https://example.com/books/authors»
},{
«@type»: «ListItem»,
«position»: 3,
«name»: «Ann Leckie»,
«item»: «https://example.com/books/authors/annleckie»
},{
«@type»: «ListItem»,
«position»: 4,
«name»: «Ancillary Justice»,
«item»: «https://example.com/books/authors/ancillaryjustice»
}]
}
</script>

El código anterior nos dice que el libro «Ancillary Justice» ha sido realizado por la autora Ann Leckie y es un libro.

Libros > Autores > Ann Leckie > Ancillary Justice

Si hemos hecho el desarrollo de nuestra web con desarrollo propio o algunos de los lenguajes principales, deberemos de realizar la implementación manual. Sin embargo, si utilizamos WordPress, tenemos a nuestra disposición varios plugins que nos ayudarán a realizar esta implementación:

Validar la implementación

Una vez realizada la implementación, lo más importante será verificar que se ha realizado correctamente. Mientras que verificar la implementación «visible» será muy sencillo ya que tan solo tendremos que comprobar que todos los elementos estén correctamente enlazados y funcionen bien, para realizar la verificación de la implementación de código necesitaremos un poco más de esfuerzo.

Aún así, tenemos a nuestra disposición una herramienta de Google y una extensión para Chrome que harán nuestra vida mucho más fácil.

Herramienta de Datos Estructurados de Google:

Mediante la herramienta de Google, podremos validar nuestros datos estructurados tanto mediante la url, como a nivel de código si introducimos directamente el fragmento.

Datos Estructurados Google

Herramienta de Datos Estructurados de Google

Si introducimos una url, Google nos devolverá el análisis de la misma con todos los datos estructurados que han sido detectados.

Prueba Datos Estructurados

Ejemplo del análisis de una url en la herramienta de datos estructurados de Google.

Si por el contrario, queremos probar primero el código JSON-LD de Breadcrumb antes de implementarlo, podremos utilizar la herramienta «fragmento de código», la cual nos dará el siguiente resultado:

Fragmentos Código Datos Estructurados

Herramienta de validación de fragmentos de código de de datos estructurados.

Structured Data Testing Tool (extensión de Google Chrome)

Si en lugar de visitar la herramienta de Google, queremos validar los datos estructurados de Breadcrumb (y otros más) directamente desde el navegador, podemos utilizar la extensión «Structured Data Testing Tool«, la cual nos indicará todos los datos estructurados detectados y además, si existe algún error.

Structured Data Chrome

Extensión de Chrome para validar Datos Estructurados con un ejemplo de un artículo de SEO Alive.

Monitorizar breadcrumbs en Google Search Console

Ya para finalizar, una vez hemos hecho la implementación y la validación de la implementación, solo nos restará monitorizar la actividad en Google Search Console, lo cual nos permitirá realizar un seguimiento diario y detectar cualquier anomalía.

BreadCrumbs Search Console

Visualización del informe de breadcrumbs en Search Console (lanzado en Septiembre de 2019).

Para finalizar, nos gustaría preguntarte: ¿cuáles han sido los errores más comunes que te has encontrado al realizar la implementación?

Nos gustaría realizar una recopilación y poder publicarla en este artículo para ayudar a otros/as profesionales SEO.

¡Muchas gracias y no olvides comentarlos!

Referencias