{"id":4435,"date":"2021-11-06T23:34:00","date_gmt":"2021-11-06T22:34:00","guid":{"rendered":"https:\/\/www.vadavo.com\/blog\/?p=4435"},"modified":"2024-08-26T16:06:48","modified_gmt":"2024-08-26T16:06:48","slug":"que-son-breadcrumbs","status":"publish","type":"post","link":"https:\/\/www.vadavo.com\/blog\/que-son-breadcrumbs\/","title":{"rendered":"Breadcrumbs WordPress: Qu\u00e9 son y c\u00f3mo configurarlos"},"content":{"rendered":"\n

\"\" \u00bfQu\u00e9 son las Breadcrumbs y c\u00f3mo influyen en el SEO web?<\/strong><\/h2>\n\n\n\n

Este curioso nombre, que en espa\u00f1ol se traducir\u00eda por algo as\u00ed como \u00abrastro de migas de pan<\/em><\/strong>\u00bb, alude a aquellas herramientas o mecanismos en forma de enlaces que aparecen en la parte superior izquierda del contenido, y que hacen referencia a la zona de una determinada web en la que estamos. <\/p>\n\n\n\n

Como ya te habr\u00e1s podido imaginar, la utilizaci\u00f3n de este t\u00e9rmino se explica por la alusi\u00f3n, t\u00edpica de los cuentos infantiles, del uso de un rastro de migas de pan para recordar el sendero de regreso a casa. No saber d\u00f3nde exactamente se encuentra uno dentro de la arquitectura de un sitio web puede ser algo frustrante, y esa frustraci\u00f3n desemboca en una experiencia de navegaci\u00f3n pobre para los usuarios (y, posiblemente, en el correspondiente abandono de esa web en busca de una alternativa que ofrezca mayor claridad y soluciones m\u00e1s adaptadas).<\/p>\n\n\n\n

\"\" \u00bfPara qu\u00e9 sirven las Breadcrumbs?<\/strong><\/h2>\n\n\n\n

Las breadcrumbs web<\/strong> se presentan como un medio capaz de mantener informado al usuario, de manera directa e inequ\u00edvoca, acerca de su ubicaci\u00f3n en el contexto de la p\u00e1gina web. Arroja luz sobre la posici\u00f3n concreta del usuario dentro de la jerarqu\u00eda del sitio, poni\u00e9ndole en relaci\u00f3n con el resto de elementos de la plataforma, desde las p\u00e1ginas de la parte alta de la estructura, hasta el conjunto de categor\u00edas y cat\u00e1logos de productos o servicios que se ofrecen. <\/p>\n\n\n\n

Se trata, por tanto, de un sistema de referencia que sirve para que el usuario sepa en todo momento en qu\u00e9 lugar se encuentra y c\u00f3mo ha llegado hasta ah\u00ed. Adem\u00e1s, le permite retroceder hasta las a las p\u00e1ginas superiores de manera r\u00e1pida y en solo un par de clics. Esto, adem\u00e1s de ser mejorar la practicidad del sitio, y con ello reforzar la experiencia de usuario, puede aportar grandes ventajas en t\u00e9rminos de SEO<\/strong>.<\/p>\n\n\n\n

\"\" C\u00f3mo mostrar los Breadcrumbs de WordPress en nuestro sitio web:<\/h2>\n\n\n\n

Mostrar breadcrumbs con el plugin Breadcrumb NavXT<\/a><\/strong><\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Este plugin se puede instalar f\u00e1cilmente accediendo a trav\u00e9s del repositorio de WordPress. Una vez lo descargues y lo deber\u00e1s activar a trav\u00e9s de un widget (Apariencia –> widgets –> arrastra el widget de NavXT al \u00e1rea de la p\u00e1gina web donde quieras que se muestre<\/strong>).<\/p>\n\n\n\n

Otra soluci\u00f3n m\u00e1s t\u00e9cnica o si quieres agregar los breadcrumbs directamente al tema de WordPress, tendr\u00e1s que agregar el siguiente fragmento de c\u00f3digo al tu header.php<\/strong>:<\/p>\n\n\n

\n<div class="breadcrumbs" typeof="BreadcrumbList" vocab="https:\/\/schema.org\/">\n<?php\nif(function_exists('bcn_display'))\n{\nbcn_display();\n}?>\n<\/div>\n<\/pre><\/div>\n\n\n
Cuando acabes, puedes usar el plugin para mostrar los breadcrumbs donde quieras. Para m\u00e1s configuraciones, accede a la p\u00e1gina de configuraci\u00f3n del plugin (Ajustes –> Breadcrumbs NavXT)<\/strong>.<\/p>\n\n\n\n
Desde all\u00ed podr\u00e1s cambiar las taxonom\u00edas para hacer que las rutas de navegaci\u00f3n de tu sitio parezcan \u00fanicas. Tambi\u00e9n puedes darle estilo a los breadcrumbs refiri\u00e9ndote a ellos como una clase especial en tu hoja de CSS3.<\/p>\n\n\n\n
\"\" Beneficios de las Breadcrumbs<\/strong><\/h2>\n\n\n\n
Implementar una buena estrategia entorno a las breadcrumbs <\/strong>puede llevar algo de tiempo, pero sin duda, merece la pena hacerlo. \u00bfPor qu\u00e9? Ve\u00e1moslo.<\/p>\n\n\n\n
\"\" Como ya hemos dicho, mejora la UX:<\/strong><\/h3>\n\n\n\n
Adem\u00e1s de complementar a los men\u00fas para ofrecer una visi\u00f3n completa y clara del sitio, permite al usuario ubicarse dentro de la estructura web, y facilita el acceso a los niveles superiores de forma f\u00e1cil y directa, proporcionando un mayor control y dinamismo a la navegaci\u00f3n. <\/strong>Esto tiene el potencial de reducir la tasa de rebote<\/a><\/strong> hacia p\u00e1ginas con contenidos similares mejor organizadas.<\/p>\n\n\n\n
\"\" Favorece el posicionamiento SEO<\/strong><\/h3>\n\n\n\n
Si a esta mejora de la experiencia de usuario le sumamos un uso adecuado de enlaces, anclas u otras estrategias de optimizaci\u00f3n del rastro, lograremos, con las breadcrumbs de WordPress, una mayor visibilidad en los resultados de b\u00fasqueda<\/strong>, lo que har\u00e1 que el posicionamiento de nuestra p\u00e1gina mejore.<\/p>\n\n\n\n
\"\" Y todo ello sin necesidad de invertir muchos recursos<\/strong><\/h3>\n\n\n\n
As\u00ed es, el coste de implementaci\u00f3n es relativamente bajo<\/strong>, especialmente si tenemos en cuenta la mejora en la operatividad que se desprende del mecanismo. Su uso, en la mayor\u00eda de los casos, ofrece grandes ventajas, y a\u00f1adirlos a las p\u00e1ginas no cuesta casi nada. Si nuestro sitio web es de gran tama\u00f1o o tiene m\u00e1s de un nivel jer\u00e1rquico (es decir no todas las p\u00e1ginas cuelgan de la portada), entonces el uso de estos rastros es muy recomendable.<\/p>\n\n\n\n
\"\" Tipos de Breadcrumbs<\/strong><\/h2>\n\n\n\n
Suelen dividirse en tres bloques b\u00e1sicos:<\/p>\n\n\n\n
\"\" Breadcrumbs de exploraci\u00f3n:<\/strong><\/h3>\n\n\n\n
Son los que ense\u00f1an el recorrido que hemos seguido hasta llegar a la p\u00e1gina en la que nos localizamos.<\/p>\n\n\n\n
\"\" Breadcrumbs de ubicaci\u00f3n:<\/strong><\/h3>\n\n\n\n
Aquellas que indican al usuario en qu\u00e9 nivel jer\u00e1rquico de la web se ubica.<\/p>\n\n\n\n
\"\" Breadcrumbs de atributo:<\/strong><\/h3>\n\n\n\n
Es caracter\u00edstico de los sitios de comercio electr\u00f3nico. En estas plataformas los productos tienen distintos atributos (tipo de producto, categor\u00eda, marca, modelo, funci\u00f3n, etc.). A cada uno de ellos se le atribuir\u00e1 un breadcrumb, lo que permitir\u00e1 buscar diferentes productos desde diferentes ubicaciones o categor\u00edas.<\/p>\n\n\n\n
\"\" Buenas pr\u00e1cticas de uso de las Breadcrumbs<\/strong><\/h2>\n\n\n\n
Para terminar, haremos un repaso por las principales recomendaciones <\/strong>relacionadas con las formas de gestionar esta herramienta para que sea lo m\u00e1s atractiva y pr\u00e1ctica posible para el usuario. Aqu\u00ed van:<\/p>\n\n\n\n