Página principal » UI / UX » Principales prácticas y ejemplos de navegación de ruta de navegación

    Principales prácticas y ejemplos de navegación de ruta de navegación

    La navegación de ruta de navegación a menudo se pasa por alto en el proceso de diseño y desarrollo.. Algunas personas pueden verlo como innecesario, mientras que otros pueden sentir que es una molestia demasiado grande para su valor. El hecho es que la navegación de navegación aumentará enormemente la facilidad de uso de un sitio web.

    Las migas de pan proporcionan a los usuarios un método alternativo de navegación, les permiten ver dónde se ubican en la jerarquía de un sitio web y reducirán la cantidad de pasos necesarios para navegar a un nivel superior dentro de un sitio web..

    A continuación se describen los diferentes tipos de navegación de migas de pan que se utilizan en la actualidad, por qué son importantes y cómo deben implementarse mejor en línea. También se incluyen aquí para su referencia son Más de 30 ejemplos de cómo se utilizan las migas de pan en línea hoy.

    Recuerde, aunque es probable que la navegación de navegación no genere o destruya un sitio web, proporcionará un beneficio adicional a sus usuarios al aumentar la capacidad de uso general y la funcionalidad de su sitio web..

    Tipos de migas de pan

    Camino

    Las rutas de navegación basadas en rutas indican los pasos o rutas que un usuario ha tomado para llegar a la página actual de un sitio web. Además, los usuarios verán enlaces a las páginas que han visitado anteriormente para llegar a la página actual. De los tres tipos de navegación de navegación, la navegación basada en ruta es menos popular en línea. La razón es que la navegación de ruta basada en ruta proporciona una funcionalidad similar a la “Adelante” y “Espalda” Botones en un navegador. Para la mayoría de los sitios web, la navegación basada en atributos y basada en la ubicación ofrece una mejor funcionalidad.

    Ubicación

    Las rutas de navegación basadas en la ubicación indican al usuario dónde se encuentra la página actual en la jerarquía del sitio web. Este tipo de navegación de navegación principal se ve más comúnmente en sitios web con más de dos niveles de profundidad o contenido. Al trasladarse a un sitio web, los usuarios reciben enlaces a páginas o categorías que actúan como un “padre” o un nivel superior a la página que están viendo actualmente. Por ejemplo, un usuario puede estar en el “Hablar” página, sin embargo, la “Que hacemos” La página es un padre de la “Hablar” página mientras “Casa” La página es un padre de la “Que hacemos” página.

    Clearleft Ltd

    Atributo

    Las migas de pan basadas en atributos indican al usuario los atributos o categorías asignados a la página actual dentro de un sitio web. A menudo vistos en sitios web de comercio electrónico, los productos pueden no solo caer en una categoría sino también bajo ciertos atributos. Por ejemplo, un vehículo puede ser clasificado como un SUV y luego tener los atributos de ser de color negro y lanzarse en el año 2010..

    Cars.com

    ¿Por qué usar Breadcrumbs??

    • Gran usabilidad

      Las migas de pan proporcionan un medio adicional por el cual los usuarios pueden navegar fácilmente por un sitio web. Si un usuario accede a una página interna de su sitio web desde otra fuente, el usuario podrá ver exactamente dónde se encuentra dentro de la jerarquía del sitio. El usuario también tiene la oportunidad de ascender a un nivel más alto del sitio web en cualquier momento sin ningún problema..

    • Fácil de Retroceder

      Las navegaciones primarias no están diseñadas para ser seguidas hacia atrás donde están las migajas de pan. Debido a que el retroceso es extremadamente popular en línea, un poco de ayuda adicional puede hacer mucho..

    • Eliminar clics adicionales

      Las migas de pan permiten a los usuarios saltar de un nivel de un sitio web a otro sin tener que usar el “adelante” o “hacia atrás” Botones en el navegador. Además, las rutas de navegación eliminan la necesidad de que los usuarios recurran continuamente a la navegación principal.

    • Muestra la jerarquía de usuarios

      La navegación principal de un sitio web no reflejará la jerarquía de cada página dentro del sitio. Dar a los usuarios migas de pan les permitirá ver la jerarquía de una página dentro de un sitio web.

    • Visualmente agradable

      No solo las migas de pan proporcionan a los usuarios una facilidad de uso adicional, sino que también lo hacen sin ocupar mucho espacio o espacio en la página. Las migas de pan son fáciles de implementar en el diseño visual de su sitio web y proporcionan un gran beneficio a los usuarios.

    • Proporciona ayuda adicional

      Es totalmente posible que algunos usuarios no entiendan cómo funciona la navegación principal de un sitio web y, en algunos casos, es posible que los usuarios ni siquiera sepan lo que están buscando. Darles a los usuarios migas de pan les permitirá ver el progreso general y la estructura de un sitio web, lo que les permitirá navegar mejor por el sitio web.

    • Tasas de rebote más bajas

      Normalmente, las rutas de navegación proporcionan una navegación más detallada que la navegación principal. Al hacerlo, los usuarios recibirán más opciones sobre cómo navegar por un sitio web. Dándoles la oportunidad de realizar un seguimiento sencillo de algunos niveles dentro del sitio web disminuirá su tasa de rebote.

    • Genera interes

      Cuando un usuario llega a una página interna de un sitio web es probable que ya esté en una página de interés. Breadcrumbs puede proporcionar enlaces a páginas adicionales e información que también le interesa al usuario sin hacer que empiece desde el principio..

    Mejores prácticas de migas de pan

    • Utilice Breadcrumbs en la parte superior de una página

      La colocación más común e instintiva para las migas de pan se encuentra en la parte superior de una página. Esto permite a los usuarios encontrar las migas de pan de una manera sencilla y utilizarlas en consecuencia..

    • Utilice Breadcrumbs consistentemente

      Si decide utilizar las migajas de pan, asegúrese de usarlas en todo su sitio web. Dar a los usuarios migas de pan en algunas páginas y no en otras solo los confundirá y frustrará. (Un buen ejemplo de esto es Amazon, ya que eliminan las rutas de navegación de las páginas de productos individuales).

    • Las migajas de pan deberían degradarse con gracia

      Breadcrumbs siempre debe comenzar con la página de inicio y degradarse a la página actual. Al hacerlo, sus migajas de pan deben pasar del nivel más alto al nivel más bajo paso a paso..

    • Estilizar apropiadamente las migas de pan

      Desea que se vean sus migas de pan, pero no quiere que sean el punto focal. También desea que quede claro que sus rutas de navegación no forman parte del contenido principal de una página, sino de un soporte adicional. Encuentre un medio feliz donde sus migas de pan sean perceptibles, sin embargo no son dominantes.

    • Categorizar páginas claramente

      Si tiene páginas que se dividen en dos o más categorías, es posible que no desee utilizar las rutas de navegación en su sitio web. Tratar de colocar una página en dos o más categorías probablemente solo generará migas de pan poco claras y confundirá al usuario. Asegúrese de que su sitio web tenga una jerarquía organizada y se muestre en consecuencia a través de su ruta de navegación..

    • Claramente separa cada nivel

      Asegúrese de que los usuarios puedan distinguir la diferencia entre cada nivel de ruta de navegación. El separador más común entre niveles es el carácter "mayor que" (>). Otros buenos separadores incluyen citas de doble ángulo (»), barras (/) y flechas (→). Si usa un carácter de texto plano, use solo uno. (»Es más atractivo y efectivo que >>)

    • Seleccione la página actual

      Use un estilo diferente en el último elemento de una lista de ruta de navegación para establecer que es la página que se está viendo actualmente. Puedes lograr esto haciendo el objeto negrita, cambiando su color, o enfatizando eso.

    • No convierta la página actual en un enlace

      No es necesario hacer que el último elemento de una lista de ruta de navegación sea un enlace porque es la página actual que se está viendo. Crear un enlace aquí solo confundirá a los usuarios, especialmente cuando hacen clic en él y no pasan a una nueva página.

    • No use Breadcrumbs como encabezado de página

      El uso del último elemento de una lista de ruta de navegación como encabezado de una página actual no es efectivo. Si decide utilizar las migajas de pan, hágalo con la adición de un encabezado de página..

    • Las migas de pan no reemplazan la navegación principal

      Las migas de pan solo se deben utilizar como soporte para la navegación principal, nunca para reemplazar la navegación principal por completo. Siempre debe proporcionar a los usuarios una navegación principal desde la que puedan navegar por un sitio web antes de utilizar la navegación de navegación..

    Grandes ejemplos de migas de pan

    Vitra Direct

    Bicicletas de trekking

    Illy

    SiteInspire

    Mia y maggie

    Intridea

    Diseño de humanos

    Roxy

    Blik

    SitePoint

    Objetivo

    Walmart

    1-800-Flowers

    La mejor compra

    Amazon.com

    Graneros y Nobles

    Fin de las tierras

    manzana

    Google

    Persecución

    AbsolutePunk.net

    Littman Bros. Lighting

    Guardian.co.uk

    AREA 17

    Wufoo

    Girl Scouts de Middle Tennessee

    El colectivo de Glasgow

    Primogénito

    Campana canada

    Grooveshark

    Devlounge

    sobre el autor - Shay howe es un diseñador web y de interfaz de usuario profesional que actualmente vive en Chicago, IL. Él escribe sobre diseño web en su propio blog en letcounthedays y le encantaría saber de usted en Twitter. Por favor siéntete libre dile hola!