Los elementos de referencia HTML5 se utilizan para mejorar la navegación

Los elementos HTML5, como main, nav y aside, actúan como puntos de referencia. o regiones especiales de la página a las que los lectores de pantalla y otras tecnologías de asistencia pueden saltar. Al usar elementos de puntos de referencia, puede mejorar notablemente la experiencia de navegación en su sitio para los usuarios de tecnología de asistencia. Más información en el Centro de ayuda HTML5 y Puntos de referencia de ARIA.

Cómo verificar los puntos de referencia de forma manual

Usa la lista de elementos de referencia de W3C. para verificar que cada sección importante de tu página esté contenida por un elemento de punto de referencia. Por ejemplo:

<header>
  <p>Put product name and logo here</p>
</header>
<nav>
  <ul>
    <li>Put navigation here</li>
  </ul>
</nav>
<main>
  <p>Put main content here</p>
</main>
<footer>
  <p>Put copyright info, supplemental links, etc. here</p>
</footer>

También puedes usar herramientas como las de Microsoft Extensión de las estadísticas de accesibilidad para visualizar la estructura de tu página y detectar secciones que no están contenidas en puntos de referencia:

Captura de pantalla de web.dev con puntos de referencia destacados con la extensión Estadísticas de accesibilidad

Cómo usar puntos de referencia eficazmente

  • Usa elementos de referencia para definir las secciones principales de tu página en lugar de depender de elementos genéricos como <div> o <span>.
  • Usa puntos de referencia para transmitir la estructura de la página. Por ejemplo, el elemento <main> debe incluir todo el contenido directamente relacionado. a la idea principal de la página, por lo que solo debe haber una por página. Consulta el resumen de MDN sobre los elementos de sección de contenido. para aprender a usar cada punto de referencia.
  • Usa los puntos de referencia con cuidado. Tener demasiados puntos de referencia hacer que la navegación sea más difícil para los usuarios de tecnología de accesibilidad porque ya que impide que pasen fácilmente a un contenido que les interese.

Consulta la publicación Encabezados y puntos de referencia. para obtener más información.

Recursos