Migas de pan web: todo lo que tienes que saber

Luis Souto

migas de pan web

Migas de pan web: todo lo que tienes que saber

Al igual que Hansel y Gretel, a Google le gustan las migas de pan. Es una forma de crear un enlazado interno entre las distintas categorías superiores de la web.

Las breadcumbs se encargan de realizar la ruta desde la página de inicio hasta la página en la que nos encontremos.

¿Qué son las migas de pan SEO en una página web?

Las migas de pan web son un elemento de navegación que suele estar debajo del menú de la web.

También conocidos como “Breadcrumbs”, facilitan al usuario el desplazamiento por la página y le indica en que parte de la web se encuentra en todo momento.

Las migas de pan SEO facilitan el rastreo a los motores de búsquedas y les muestra la jerarquía de la página web.

¿Cuáles son las ventajas de las migas de pan web?

Podemos clasificar las ventajas en 3 grandes grupos:

Posicionamiento web (SEO)

Crean un enlazado entre categorías, subcategorías y productos que favorece el rastreo de toda la web por parte de los motores de búsqueda.

Experiencia del usuario

Estas son las ventajas que proporciona en la usabilidad web:

  • Los usuarios pueden navegar por otras secciones facilitando sus búsquedas
  • El cliente puede regresar a la página de inicio o a la categoría superior en cualquier momento
  • Facilita las búsquedas a los usuarios

Incrementa la retención del usuario

Los breadcrumbs nos pueden ayudar a aumentar el tiempo que los usuarios permanecen en nuestra página y a su vez reducir la tasa de rebote.

Por ello, es un detalle interesante a tener en cuenta para implementar en tu web si todavía no lo has hecho.

Tipos de migas de pan web o breadcrumbs

Principalmente, existen dos formas de presentar las migas de pan:

Migas de pan históricas

Este tipo de breadcrumbs se basan en el historial realizado en la página desde el primer sitio por donde entramos:

Inicio > url 1 > url 2 > url 3 > url actual

Migas de pan jerárquicas

Los breadcrumbs jerárquicos son los más habituales en todo tipo de webs. Se encargan de mostrar el camino de las categorías superiores desde la página de inicio a la página en la que se encuentra el usuario.

Inicio > camisetas hombre > manga larga > camiseta manga larga blanca (página actual)

¿Cómo colocar migas de pan en Wordpress?

Las breadcrumbs las podemos colocar a través de algún plugin y si no de forma manual.

Migas de pan Yoast SEO (con plugin)

En apenas unos minutos tendrás instalado el plugin de Yoast SEO. Con solo unos pasos podrás implementar los breadcrumbs en tu página de Wordpress.

Para realizarlo, una vez instalado el plugin, realizaremos lo siguiente:

  • Vamos al apartado de Yoast SEO (SEO > Apariencia en el buscador > Migas de pan)
  • Entramos en “apariencia del buscador”
  • Presionamos sobre la pestaña “migas de pan”
  • Para finalizar, hacemos clic en el botón de activar

Si después de realizar estos pasos, nuestra plantilla no nos da la opción de activar las breadcrumbs, Yoast nos trae la solución. Acudiremos a editar el archivo functions.php de nuestro tema hijo y añadimos lo siguiente:

function anadir_breadcrumbs(){
    if ( function_exists('yoast_breadcrumb') && is_front_page() == false  ){
        yoast_breadcrumb( '<p id="breadcrumbs">','</p>' );
    }    
}
add_action('[HOOK_DE_TU_TEMA]', 'anadir_breadcrumbs', 100 );

Tenemos que cambiar el “[HOOK_DE_TU_TEMA]” por el Hook que corresponda al tema que tengamos instalado.

Este código verifica si la función “yoast_breadcrumb” existe, si es así, y la página es distinta de la de inicio, se mostrarán las migas de pan.

Sin plugins

Evitar el uso de plugins nos permite tener una página mucho más rápida. Para hacerlo seguiremos los siguientes pasos:

Crear un tema hijo o Child theme, en caso de que no lo hayas hecho. Es importante, porque si no, perderás los cambios que vayas realizando cuando se actualice la plantilla.

Acudimos al archivo functions.php de nuestro tema hijo, lo abrimos y añadimos el código siguiente:

function crear_breadcrumbs() {
    if (!is_front_page()) {
        echo '<a href="/">Inicio</a> » ';
        if (is_category() || is_single() || is_page()) {
            if(is_category()){
                $category = get_the_category();
                echo $category[0]->cat_name;
            }else{
                the_category(' - ');
            }if(is_page()) {
                echo the_title();
            }if (is_single()) {
                echo " » ";
                the_title();
            }
        }
    }
}
add_filter( '[HOOK_DE_TU_TEMA]', 'crear_breadcrumbs' );

Para que funcione debemos sustituir “[HOOK_DE_TU_TEMA]” por el Hook de la plantilla que estés utilizando. Puedes consultar la documentación caso de no saber el Hook de tu tema o contactar directamente con el soporte técnico del tema.

Lo que conseguimos con este código es que, si detecta que el usuario se encuentra en cualquier página distinta al inicio, mostrará las breadcrumbs.

Buenas prácticas en las migas de pan

Algunos de los consejos que puedo daros a la hora de colocar las migas de pan son:

Optimizar los textos ancla de las breadcrumbs

En este punto tenemos que tener en cuenta dos cosas:
Primero, no sobreoptimizar los anchor text de las breadcrumbs, hacerlo de forma natural, como buscaría un usuario.

Y de segundo, no usar textos demasiado largos en las migas de pan, ya que debemos priorizar la usabilidad web.

Los breadcrumbs no reemplazan la navegación principal

Aunque dispongamos de migas de pan, debemos tener siempre un menú con una estructura vertical que siga una jerarquía lógica. En el menú exponemos al usuario todas las categorías y subcategorías de nuestra web.

El menú se dispone en una estructura vertical, sin embargo, las breadcrumbs van en disposición horizontal.

Van situados en la parte superior izquierda

Funcionan y se ven mucho mejor en la parte superior de la web, justo por debajo del menú. Es importante que, el color del fondo permita leer con claridad el texto de las migas de pan.

Emplear el símbolo > para la división de los niveles

Es probable que este sea el separador entre niveles más efectivo, debido a que los usuarios lo reconocen visualmente como un avance.

Colocar en negrita el último término

Al colocar en negrita el último término es más fácil para el usuario reconocer en que página se encuentra. Al ser el último término no debe ser cliqueable.

Comprobar la navegación en dos direcciones

Comprobar si nos podemos desplazar en ambas direcciones (ascendente y descendente) a través de las migas de pan.

Migas de pan si o no

En webs pequeñas de una o dos categorías no es necesario añadir breadcrumbs. El camino que realizará el usuario por la web siempre será corto y sencillo.

Espero que con este artículo descubráis todos los beneficios que pueden aportar las migas de pan SEO a nuestra página web.

Si tenéis alguna duda o queréis dejar algún aporte, siempre será bien recibido en los comentarios.

Mis mejores deSEOs para tod@s

Categorías: SEO
Luis Souto

Luis Souto

SEO

Mi nombre es Luis Souto, hace años empecé con un proyecto web personal que, me dió muchas oportunidades laborales. Poco a poco fui descubriendo todo lo relacionado al posicionamiento orgánico y sigo en ello a día de hoy.

Soy autodidacta, curioso por naturaleza y con ganas de seguir aprendiendo día a día. He trabajado tanto webs personales como ecommerce de multitud de productos.  

Contenido Relacionado

0 comentarios

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *