No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Sistemas de navegación

8/26
Recursos

¿Cómo navegamos el contenido? En esta etapa definimos las conexiones entre contenidos y cómo el usuario puede encontrarlo. Hay diferentes sistemas de navegación:

  • Navegación global: Se refiere el menú de navegación global que siempre estará presente en todas las secciones de nuestro sitio.
  • Navegación local: El menú local le permitirá al usuario navegar en una sección específica del sitio.
  • Navegación contextual: La navegación contextual ofrece contenido relacionado con el contenido que está consumiendo el usuario y le permite seguir navegando dentro del sitio.

Nuestro objetivo es brindarle al usuario una navegación flexible que facilite su navegación, con diferentes maneras de llegar al contenido.

Aportes 51

Preguntas 20

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Este curso, realmente está muy bueno. Revisaba con atención los consejos de María Isabel, y me llamó mucho la atención cuando dice que la navegación global debe ser consistente en todos los casos y, en ese contexto, señaló como referencia de malas prácticas los sitios web de algunas universidades. No obstante, aquí hay un punto de debate interesante y es cuando en una organización de esta naturaleza, o de otras, en las que llevan a cabo proyectos puntuales y perentorios, no resulta muy útil mantener la navegación global porque me desvía la atención sobre lo que puntualmente deseo que realice el usuario. Un ejemplo puntual es cuando diseño una “landing page” para un seminario, evento, conferencia internacional o simposio: en esa situación específica, pienso, podría crearse una plantilla -respetando el branding, por supuesto- pero sin necesidad de enmarcarla en la misma estructura que se establece para el contenido más corporativo o permanente. No sé qué piensen de esto ¿Mi posición es errada o admite considerarse?

Sistemas de navegación:
Define conexiones entre contenidos y diseña como el usuario puede encontrarlos…
Navegación global:
Es el navegador principal, el menú o barra conde se encuentran todas las opciones: (donde quiera que este siempre me va a aparecer).
Navegación Local:
Es la que me permite navegar por todas las sub categorías…
++Navegación contextual: ++
Es la información relacionada a lo que el usuario esta viendo y que el navegador intuye que le puede gustar al usuario.
++Navegación flexible: ++
Brinda conexiones entre las diferentes secciones y paginas del sistema.

*Importante incorporar las miga de pan, ya que señala en el navegador global donde se encuentra el usuario, y ayuda a que este no se pierda. *

Soy muy visual y hacer esta clase de apuntes me ayuda a entender y aprender mejor.

Este es un ejemplo de un error en la organización de contenidos. Un menú principal con más de 10 subcategorías.

Sistemas de navegación

Definición

💡Conocido como el conjunto definido de acciones y técnicas de flujo en que los usuarios logran sus metas o interacciones exitosas esperadas por el producto.

.
Hay diferentes sistemas de navegación:

  • Navegación global. Se refiere a la navegación global que siempre estará presente en todas las secciones de nuestro sitio, es decir, es aquella navegación principal que le indica al usuario cuáles son las secciones principales.
  • Navegación local. El menú local le permitirá al usuario navegar en una sección específica del sitio.
  • Navegación contextual. La navegación contextual ofrece contenido relacionado con el contenido que está consumiendo el usuario y le permite seguir navegando dentro del sitio.

.
Nuestro objetivo es brindarle al usuario una navegación flexible que facilite su navegación, con diferentes maneras de llegar al contenido.

La navegación facetada puede hacer las veces de navegación local en un sitio.

Miga de pan: Cuál fue el camino que recorrí hasta llegar aquí.

Ejemplo: Ropa y calzados > Faldas

*Navegación global: Se refiere el menú de navegación global que siempre estará presente en todas las secciones de nuestro sitio.

*Navegación local: El menú local le permitirá al usuario navegar en una sección específica del sitio.

*Navegación contextual: La navegación contextual ofrece contenido relacionado con el contenido que está consumiendo el usuario y le permite seguir navegando dentro del sitio.

SISTEMA DE NAVEGACION

Como el usuario puede encontrar el contenido organizado

Menu de navegación global: donde estoy y hacia donde voy
menú de navegación local: Esta relacionado con la navegación global
menú de navegación conceptual: Esta relacionado con lo que el usuario esta viendo.

**Un ejemplo típico de un sistema de navegación suplementario o complementario son los submenús**

Teniendo en cuenta la navegación flexible ¿Será una buena práctica crear el acceso a una misma sección desde varias partes del mismo home?

Viendo los ejemplos, ¿maximo cuantas secciones recomiendan tener en el menú global?

Hasta ahora he visto
Conocer el contexto en diferentes perspectiva tanto del usuario y como el negocio.
después Saber quien es tu audiencia y que necesidades tienen, después sigue el contenido.
una ves haber tenido la data, debemos aplicar la forma de de organizar, que puede ser por temas, por ubicación, alfabéticos y facetas.
y ahora nos toca aplicar la información aplicando en navegación global, que es el menú donde vas a tener acceso a todas las funciones de la app, después la navegación local que es una navegación de una funcionalidad, después sigue la navegación contextual: le permite navegar con diferente contenidos que este relacionado.

Los sistemas de navegación nos permite facilitar la búsqueda del usuario, como encontraría lo que está buscando y como encuentra más cosas similares a lo que está buscando:
Navegación global: Es la página principal de todo sitio web, las secciones presentes y a donde se puede mover el usuario.
Navegación local: Navegar en una sección específica del sitio web, aquí se aplica los subtemas.
Navegación contextual: Contenido relacionado a lo que el usuario ve o consume, si ve una película de terror o una noticia sobre economía, se le ofrece artículos relacionados a esa búsqueda.

1. **Navegación global:** barra de navegación siempre presente donde sea que te muevas. Indica cuáles son las secciones principales, a donde se puede mover, y que siempre estará disponible. 2. **Navegación local:** subcategorías dentro de esa sección (navegación global) 3. **Navegación contextual** Seleccionado el item de navegación local, información relacionada con ese item. Permite seguir navegando dentro del sistema, como una raíz conectada de elementos. Navegación flexible es muy importante, es decir, brindar conexiones entre las diferentes secciones del sistema. No tener Siempre permitir el cumplimiento de heurísticas, donde pueda retroceder en sus pasos, o recuperarse de un error, todo de un salto natural.

Sistemas de navegación: Define las conexiones que existen entre el contenido, como el usuario encontrará nuestro contenido.

  1. Navegación global: es la navegación principal, el menú principal del sistema y esta presente en toda la navegación del sistema.

  2. Navegación local: es la navegación que me ayuda a visualizar las subcategorias dentro de una sección especifica del contenido.

  3. Navegación contextual: permite seguir moviéndonos dentro del contenido con temas relacionados.

  4. Navegación flexible: Brindar al usuario diferentes conexiones entre las diferentes secciones de la página.

Gracias

La clave para que un usuario no se pierda mientras navega en un sitio son los “breadcrums” o “migas de pan” como llama María Isabel a partir del minuto 6.
En el ejemplo de etsy, hasta que llega al producto se puede visualizar pero no de una manera correcta, como si lo hace en el sitio de la cámara de comercio que en todo momento deja huellas de en que parte del sitio te encuentras y bien visible para el usuario

Navegación global = Menú del sitio web
Navegación local = Menú de cada página del sitio web
Navegación contextual = Depende de la información o sección en la que estés navegando

Qué falditas más feas. 😦 jajaj

Tambien es muy importante no encerrar al usuario, darle la opcion para que pueda regresar a la pagina anterior o al menu principal. Personalmente si en una pagina llego a un punto donde no hay salida, inmediatamente cierro la pagina y lo mas probable es que nunca la vuelva a visitar.

Particularmente, que la navegación en un sitio web me abra en diferentes pestañas hace que me pierda muy rápido, me confunda y termine cerrando todo 🤣. Me pasa con los sitios de gobierno que forzosamente debo revisar casi a diario. Son super complicados de encontrar la información 🥴

excelente clase

Me gustó mucho que se mencionara el uso de las migajas de pan, ya que pueden ser muy útiles. Son esos pequeños detalles que pueden hacer que un usuario se quede en nuestro sitio, y así aumentar las posibilidades de conseguir los objetivos planteados con la página web.

Y es donde mis ojos visualiza las cosas de otra perspectiva.

Buenísimo curso!!

habla muy lento, tuve que usar 1.5x

Ahora todo lo veo diferente 😃

Hola a todos, me podrían por favor explicar un ejemplo de un sistema de navegación complementario, de mis anotaciones sólo tengo que está el global, local y contextual. Gracias!

Navegación Global

Navegación Local

Navegación Contextual

Ejemplos con sitios reales

Las migas de pan son un elemento que facilita no solo la navegación del sitio, sino que le indican al usuario como llegó a ese contenido. Personalmente recomiendo mucho el uso de ese elemento en sitios muy grandes.
Me parece muy chevere que tambien se pueda usar el sistema de organización facetado a manera de navegación local

excelente el uso de crear caminos (migajas de pan), para no perderse dentro del sitio. Y así poder volver sin abrir tantas pestañas, buen tip :like:

¿**Los Submenús **serían un tipo de Navegación Complementaria?.. Suplementaria?.. o ambas?

Sistemas de navegación:
Definir conexiones entre contenidos y diseñar cómo el usuario puede encontrarlo, por ejemplo: menú principal, accesos ràpidos, etc.

¿Cómo navegamos el contenido? En esta etapa definimos las conexiones entre contenidos y cómo el usuario puede encontrarlo.

Navegación flexible como objetivo en nuestro producto digital:
Brindarle al usuario conexiones entre las diferentes secciones y páginas del sistema.

Navegación contextual
Nota: es cierto que un usuario no experto en navegación puede perderse facilmente si no se adecua la transición entre pestañas.

Focalizar diferencias entre contenido duplicado y tener diferentes rutas para llegar a una misma información o sección.

Generar una navegación flexible

Para conocer más sobre las las bases de la arquitectura y los sistemas les dejo esta web donde también hay fuentes de donde obtener mas info.

Excelente información sobre como llegar y conocer las diferentes formas de llegar a un mismo contenido tomando en cuenta los tipos de navegación ya sea: global, local,contextual.

Sistema de navegacion suplementario o complementario es el mapa del sitio. Que es el oranigrama del sitio web.

la navegación global también debería recordarnos en donde estamos, por lo general a través de un resaltado en su botón o enlace (por ejemplo cuando estamos en el home o la página de contacto)

Me parece muy importante las migas de pan en la navegación, ya que nos indica donde estamos ubicados.

El diseño de navegación es la estructura principal que guía a los usuarios a través del contenido. Para que un usuario se mueva dentro de un sitio, es necesario tener una guía que le entregue las pistas necesarias para que pueda identificar lo que está buscando con la menor fricción posible.

Sistemas de navegación

¿Cómo navegamos el contenido? Nosotros ya estructuramos nuestro sistema de organización por lo tanto ya tenemos nuestro contenido e información organizado. Ahora en esta etapa definimos las conexiones entre contenidos y cómo el usuario puede navegar en ella para encontrar lo que necesita.

Nuestro objetivo es brindarle al usuario una navegación flexible que facilite su navegación, con diferentes maneras de llegar al contenido.

La miga de pan es súper! un muy buen recurso.

Sistemas de navegación
Una vez definimos como voy a organizar el contenido de manera general, tengo que pasar a definir cuales son las conexiones que van a existir dentro de ese contenido (diseñaremos el como el usuario puede encontrar ese contenido), cuales son los caminos que le daré para que se mueva dentro de todo el sistema, aplicación, sitio web o lo que estemos diseñando (ejem: Menú de navegación principal, Accesos rápidos, links).

  • Navegación global: Hace referencia al menú de navegación principal de mi sistema, es decir, la barra de navegación que siempre va a estar presente a donde sea que me mueva dentro del sitio (siempre tiene que ir conmigo), este nos indicara cuales son las acciones principales a donde me puedo mover y que desde donde me encuentre siempre me pueda mover a las otras categorías.

  • Navegación local: Este nos permite navegar dentro de una sección especifica del contenido (subcategorías).

  • Navegación contextual: Esta nos permite seguirnos moviendo dentro del contenido (Noticias relacionadas en una sección)

Lo que tenemos que lograr en nuestro producto digital es generar una navegación flexible, es decir, brindarle al usuario diferentes conexiones entre las diferentes secciones de la pagina. Que hayan diferentes maneras de llegar al mismo contenido siempre y cuando estas diferentes maneras tengan sentido para el usuario.

Las breadcrumbs son muy útiles