Lección 10El proceso de diseño: ¿cómo encajar la accesibilidad web?

Noción 71

Estructura el HTML correctamente

Competencias objetivo

Aprende a cumplir con los requisitos de HTML al integrar tu diseño

HTML5?

HTML es el lenguaje utilizado para estructurar y presentar el contenido de una página web. Este tiene algunas características propias para hacer que los sitios web sean más accesibles, al ser más semánticos. La mayoría de los navegadores soportan ahora el lenguaje HTML5, que es la versión más moderna de HTML, que se lanzó en 2008.

Si no estás familiarizado con el lenguaje HTML, puedes utilizar estas ilustraciones para ayudarte en la lectura:

Utiliza etiquetas que dan sentido a la estructura de la página, indicando qué tipo de elemento es un bloque. Utilizar el HTML semántico no significa que no tengamos que seguir las pautas de accesibilidad, como las etiquetas AREA, pero es otra herramienta para construir sitios web accesibles. Los puntos de referencia (landmarks) permiten a un lector de pantalla saltarse algunas secciones y acceder a una parte concreta de la página web.

¿Estructura? ¡Punto de referencia!

Existen varios tipos de elementos de bloque en HTML5. Esto ayuda a estructurar el diseño de la página. Por ejemplo, <header> es equivalente a un elemento <div>, pero con indicaciones específicas: generalmente es un “banner” y, a menudo, contiene otro punto de referencia, un <nav> para la navegación.
El punto de referencia <main> es único en una página y es donde se encuentra el contenido. Es conveniente encontrarlo cuando se usa un lector de pantalla.
También está el punto de referencia <footer>, en la parte inferior de la página.
Podemos indicar que un elemento es independiente de otros tipos del mismo elemento usando una etiqueta <article>, por lo que es más fácil detectar contenido en un punto de referencia <main>.