Breadcrumbs

MarcaGo > Diseño Web > Breadcrumbs

Breadcrumbsque son los breadcrumbs
Califica este artículo

En este post, te hablaremos de un aspecto clave para desarrollar la arquitectura de tu página web, la cual consta de las Breadcrumbs. Este concepto va referido a la construcción de una estructura digital, la misma generará secciones que organizan tu contenido. De esa manera, el usuario podrá descubrir otras áreas sin complicaciones.

Simplemente, estas migas digitales funcionan para guiar al visitante en explorar cada categoría de nuestra web. Por eso mismo, con esta herramienta, tus usuarios no se perderán para volver al menú de tu web, sino que lograran saber en dónde están y cómo salir de las secciones sin problemas.

A continuación, te explicaremos detenidamente las características, lineamientos y funcionalidades de las breadcrumbs o también llamadas como migas de pan.

¿Cómo se ven y se utilizan las breadcrumbs?

Generalmente, las migas de pan se estructuran a base de iconos o en forma de palabras puntuales. De esa manera, puedes encontrarlas en el menú de navegación o al final de un artículo con unas palabras acentuadas con un enlace vinculado. Asimismo, se ejecutan claramente para un mayor control en la arquitectura web.

Cabe agregar, que según el sitio web que poseas, cambiará la distribución de las breadcrumbs. Por lo general, los rastros de las migas de pan comienzan en la ruta de navegación, donde le indicará al usuario en qué sección se encuentra.

De ese modo, se mostrará con una estructura de niveles en el contenido web, de forma que el usuario inicie con la página principal, después con las categorías, continua con las subcategorías hasta llegar al artículo en sí. Básicamente, esto es denominado como paradas entre enlaces, lo cual genera una organización adecuada en el sitio web.

Ejemplos de cómo se estructura la secuencia de las breadcrumbs

Sencillamente, la representación de las migas de pan de forma gráfica se diseña a partir de un lenguaje de programación (CMS), a través de ello se generan unas estructuras correctas para ordenar todo el contenido de tu web.

Por ende, puedes generar la secuencia de las breadcrumbs con un símbolo de “mayor que”, de modo que actúe con una separación, al igual que indica una dirección. También, se emplea las flechas o triángulos, para funcionar con la estructura de la ruta de navegación.  

Se vería las migas de pan de esta manera: Página de inicio > Categoría > Subcategoría > Artículo. Y con concepto específico, sería así: MarcaGo > Marketing Digital > Posicionamiento web > Consejos para tu posicionamiento web en Google AdSense.

¿Cuáles son los tipos de breadcrumbs?

Una vez comprendido cómo funciona y se visualiza las breadcrumbs, es relevante argumentar sobre las clasificaciones generales de las mismas. Debido a que, cada una de estos rastros ofrecen una construcción específica, las cuales te explicamos a continuación.

Basados en Localizador

Se expone que las migas de pan localizador se establecen para informar sobre el lugar que esté dentro de la página web. No importará sobre la navegación que efectúe el usuario, ya que el mismo visitante reconocerá en donde está ubicado.

De esa forma, se aportará la información sobre los niveles superiores donde se encuentra alojado todo el contenido de tu web. Con esta relación se permitirá que el usuario vuelva a regresar al menú de inicio o a la categoría superior.

Un ejemplo de una miga de pan localizador en medio de una web de maquillaje, se conforma por Menú central > Maquillaje de ojos > Sombras > Movimientos en sombras oscuras. De este modo, el usuario podrá volver a la subcategoría de Sombras para continuar buscando las técnicas con otros colores y estilos, específicamente en artículos. 

Basado en el Historial

Este tipo de migas de pan está aplicada para la navegación, de tal manera, que su estructura de información se comprende con distintas ubicaciones en diferentes categorías. De esa manera, los rastros de breadcrumbs se establecen en variadas rutas de navegación.

Por esa razón, las migas de pan de historial están diseñadas para mostrarle al usuario continuamente el acceso a los contenidos, según sea la navegación que aplique el visitante. Es así como, no importará la ubicación de la página en la que esté alojado el contenido, ya que de igual manera te mostrará la secuencia sin relación entre ellas.

La distribución de este tipo de miga de pan se observa de la siguiente manera: Menú de inicio > Educación > Formaciones gratuitas > Cursos en línea de manicura > Cursos en línea de maquillaje. Con esta descripción se distribuye una sección de estética, la cual llevará al usuario a la ubicación de temas en maquillaje.

Basados en Descripción

Las instrucciones para las breadcrumbs descriptivas, consta de guiar al usuario a través de los datos, y a su vez informa sobre la ubicación del contenido y la navegación que aplique el usuario. Asimismo, se genera exponiendo elementos particulares de la página, enfocados a características determinadas.

De esa manera, su ejecución es distinta a sus anteriores tipos de migas de pan, que sólo agrupan secciones con relación entre ellas o no. Por lo mismo, la descriptiva integra metainformaciones que identifican inmediatamente la categoría del contenido, es decir, que su funcionalidad es breve y sin muchas secuencias.

Generalmente, el ejemplo de esta miga de pan, se estructura así: Menú principal > Plataformas sobre marketing digital > Guía completa sobre Google Ads. Si te quedo claro, comienza a elegir cuál de ellas te parece adecuada para tu construcción web.

¿Qué condiciones debo seguir para implementar breadcrumbs en la web?

Debes de tener en cuenta que el rastro de breadcrumbs estará añadido en todas las páginas del sitio web, las cuales manifestaron una prioridad en sus productos o servicios en cada categoría. Por lo mismo, se destacarán en este apartado ciertas condiciones que serán obligatorias, antes de implementar esta herramienta de construcción web:

  • Necesariamente, el rastro de las migas de pan se desarrollará con todas las categorías, pero iniciando con la página principal.
  • Entre estas secuencias de las breadcrumbs, se deben de anclar con enlaces que correspondan con la semántica de la página, según cada paso. Por lo mismo, resaltaras la palabra clave que se posicione.
  • Ten en cuenta que, durante el camino de secuencias en las breadcrumbs, la sección de la página actual no puede ser clickeable para los usuarios.
  • Mantener una optimización en las posiciones de las migas de pan, al colocarlas en la esquina superior izquierda del encabezado de la página web.
  • Comprobar y navegar las direcciones entre las secuencias, de modo que no se encuentren inconsistencias.
  • En caso de que tu web se presente una o dos categorías, no establecerán el rastro de migas, ya que el camino de secuencias es corto. Por ende, el orden de la web ya está previamente ejecutada.

¿Cómo manejar las Migas de Pan en la plataforma de WordPress?

Es momento para que comprendas cómo implementar las breadcrumbs en la plataforma popular, llamada, WordPress, donde su procedimiento es sencillo y básico. En primer lugar, deberás de haber instalado a tu página web unas de las plantillas que cuenta esta plataforma, de tal manera, que puedas añadir un soporte para las migas de pan o breadcrumbs.

Aun así, si creaste tu página web en otra herramienta, y tu planilla es personalizada, es probable que no cuentes con la función de soporte. Por lo mismo, te tocará agregar un código de programación (PHP).

No obstante, si no eres una persona con experiencia en códigos ni tienes dinero para contratar a un especialista. No te abstengas en continuar con la idea de aplicar las breadcrumbs, ya que puedes hacerlo al instalar un plugin, como Yoast SEO.

Fácilmente, entrarás en la plataforma de WordPress en su Administración, continuará en la sección de “Plugins”, donde presionaras en “Plugins Instalados” para añadir uno nuevo. En ese momento, escribirás en la barra de búsqueda Yoast SEO para activar e instalar esta herramienta.

Seguidamente, al tener el plugin instalado, te irás a la administración de WordPress en el apartado SEO. A partir de allí, apretaras en “Apariencia en el Buscador”, donde presionaras la pestaña de Breadcrumbs y continuaras con la opción de Activar las migas de pan. De ese modo, culminaras definiendo cual símbolo o separador escogerás, el prefijo para la ruta de navegación y el enlace de cada página.

¿Se puede crear breadcrumbs en webs con HTML?

Claramente tendrás la oportunidad de instalar breadcrumbs en tu sitio web sin la necesidad de una plataforma como WordPress. Sencillamente, si conoces un poco sobre programación lograrás poner estas herramientas de arquitectura web, gracias al uso de microdatos.

A través de estos microdatos, te permitirán escribir el código HTML específico para adaptar las breadcrumbs en tu sitio web. Con esta ejecución lograrás modificar e implementar la posición de la URL en la ruta de navegación, el título y las secuencias de estos elementos constructivos para los usuarios.

No obstante, la explicación detallada del procedimiento de programación para codificar el HTML en tu página web para las migas de pan, la dejaremos para otro post de interés.

¿Cuáles son los beneficios de aplicar las breadcrumbs?

Evidentemente, las breadcrumbs te solucionarán la apariencia y reputación en pasos agrandados, ya que la clave de este implemento es mejorar tu posicionamiento web y la receptividad con tus seguidores.

Por lo tanto, si no te ha quedado claro la importancia de las breadcrumbs para tu sitio web, debemos de presentarte las ventajas que ejercen la funcionalidad de las mismas como herramienta.

Aumentará tu estrategia SEO

El motor de búsqueda, Google, aprecia cuando analiza un sitio web que contenga migas de pan. La principal razón del porque le encanta esta ejecución en los dominios web, es por el procesamiento efectivo y rápido para comprobar la navegabilidad y así asegurarse de obtener una página de calidad para los usuarios.

Por ello, cuando aplicamos las migas de pan con el plugin de Yoast SEO, se optimizará cada categoría, subcategoría y el menú principal en general de tu web. De esa manera, para los motores de Google será adecuado, para proceder a evaluar tu posicionamiento web.

Visibilidad y navegabilidad óptima en tu sitio web

Generalmente, cuando desarrollas un sitio web que aporta pocos niveles de jerarquía, es sencillo ubicar en donde te encuentres en los contenidos. Aunque, cuando se procesa una página con variados niveles de jerarquía, se procede a utilizar las migas de pan.

Por ello, al tener un sitio web con breadcrumbs asegura la facilidad de los usuarios en la navegación del mismo portal. De esa manera, el acceso a las categorías relacionadas con tus contenidos es más visible para tus seguidores y a la vez para los motores de búsqueda.

No son invasivos y no consumen espacios

Es importante estructurar que las migas de pan al ejecutarlas no usan recursos interactivos y ni mucho menos otros elementos que perjudican la vista de los contenidos. Por ello, su tamaño es pequeño como un texto, lo cual es cómodo para el usuario.

¿Qué no debes de hacer al utilizar las breadcrumbs?

Como se comunicó anteriormente sobre los beneficios que implican las breadcrumbs, es relevante describirte qué aspectos nunca debes de efectuar en esta herramienta de navegación. Por lo tanto, analiza cada error común que te explicaremos:

  • Nunca realices una miga de pan con oraciones largas, se objetivo para que se vean legibles y así el clic sea inmediato para cualquier dispositivo.
  • No sitúes las migas de pan en la parte inferior de tu página web, siempre resaltará encima de tu título H1 o después de tu imagen principal.
  • No permitas que tu contenido se repita en la barra de navegación.
  • En las barras de navegación deben de aparecer las breadcrumbs, no al contrario.
  • Usa solo un tipo de breadcrumbs que se adapte a tus contenidos en la web.

¿Qué opinas sobre Breadcrumbs?

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

Este sitio está protegido por reCAPTCHA y se aplican la política de privacidad y los términos de servicio de Google.