Navegación lateral
Skip to main content

Navegación lateral

Cómo utilizar este componente

Seleccione el componente Navegación lateral para las páginas con un número significativo de páginas del mismo nivel. Este componente se coloca en el lado izquierdo de una página web y proporciona a los usuarios enlaces verticales a páginas relacionadas en la misma sección. 

Un componente de navegación lateral proporciona a los usuarios vínculos verticales en el lado izquierdo de una página, lo que les permite navegar a páginas del mismo nivel relacionadas.

Componente de navegación lateral

Ver la transcripción del vídeo del componente SideNav.

Estados de navegación lateral: predeterminado, hover, activo y foco

Prácticas recomendadas

  • Úselo en páginas con muchas páginas del mismo nivel relacionadas.
  • Utilice títulos de página descriptivos y concisos.
  • Organice los elementos de la navegación lateral de forma lógica y en función de la relevancia.
  • Evite el uso de enlaces externos; Solo se permiten TxDOT.gov enlaces.
  • No coloque el componente SideNav en ubicaciones que no sean la columna izquierda de un control de columna.

Colocación

  • El componente SideNav se basa dinámicamente en AEM. El contenido de la lista no se puede cambiar en la página, excepto en "Marcar para ocultar páginas del mismo nivel". 
  • Vuelva a comprobar el contenido para asegurarse de que todos los elementos son relevantes para la página en la que se utiliza el componente.
  • Habilite la opción "Marcar para ocultar páginas del mismo nivel" si no se deben mostrar las páginas secundarias.
  • Muestre siempre el componente SideNav en la columna izquierda de un control de columna para mantener la coherencia visual. Utilice diseños como 3-9 o 3-6-3 para obtener coherencia visual.

Pautas de accesibilidad

  • Asegúrese de que los enlaces de SideNav sean accesibles desde el teclado.
  • Proporcione texto de enlace claro y descriptivo para los lectores de pantalla.
  • Mantenga un orden lógico de tabulación en la navegación.

Lista de verificación del coordinador web

  • Seleccione el diseño de control de columna adecuado (3-9 o 3-6-3).
  • Coloque el componente SideNav en la columna izquierda de un control de columna.
  • Verifique que todos los enlaces incluidos sean vínculos internos TxDOT.gov.
  • Reordene las páginas en AEM si se necesita un orden de vínculo específico y vuelva a publicarlas.
  • Habilite "Marcar para ocultar páginas hermanas" si es necesario.
  • Pruebe la navegación para ver la accesibilidad del teclado y la compatibilidad del lector de pantalla.