SEMÁNTICA HTML

¿Cómo se construye la semántica HTML para que una página web sea accesible?

/en /por

Semántica HTML

Construir la semántica HTML de una página web de manera que sea accesible implica utilizar etiquetas HTML de manera significativa y estructurada para describir correctamente el contenido y la relación entre los diferentes elementos.

Mejores prácticas: 

  1. Uso apropiado de encabezados (<h1>, <h2>, etc.): Utiliza encabezados para organizar el contenido de manera jerárquica y significativa. Los encabezados ayudan a los usuarios a entender la estructura de la página y a navegar por ella fácilmente.
  2. Etiquetas de lista (<ul>, <ol>, <li>): Utiliza etiquetas de lista para agrupar elementos relacionados, como elementos de navegación o ítems de una lista de opciones. Esto ayuda a los usuarios a entender la relación entre los elementos y a navegar por el contenido de manera más eficiente.
  3. Uso adecuado de etiquetas semánticas (<header>, <nav>, <main>, <section>, <article>, <footer>): Utiliza las etiquetas semánticas HTML5 para identificar claramente las diferentes secciones de la página. Por ejemplo, <header> para el encabezado de la página, <nav> para la navegación principal, <main> para el contenido principal, etc. Esto proporciona una estructura clara y significativa que es importante para la accesibilidad y la comprensión del contenido.
  4. Uso de atributos alt en imágenes (<img>): Proporciona descripciones alternativas utilizando el atributo alt en las etiquetas de imágenes. Estas descripciones son relevantes para las personas ciegas o con discapacidades visuales que utilizan lectores de pantalla, ya que les permiten entender el contenido visual de la página.
  5. Atributos aria-*: Utiliza atributos ARIA (Accessible Rich Internet Applications) para mejorar la accesibilidad de elementos interactivos y dinámicos, como menús desplegables, diálogos modales y barras de progreso. Los atributos ARIA proporcionan información adicional sobre la función y el estado de estos elementos para usuarios que utilizan tecnologías de asistencia.