Accesibilidad web

Las pautas WCAG del W3C recogen cómo conseguirlo: imágenes con texto alternativo, contraste suficiente, que todo funcione con el teclado, formularios con etiquetas y vídeos con subtítulos.

Un HTML bien estructurado hace gran parte del trabajo, porque los lectores de pantalla y otras ayudas técnicas se apoyan en él. En la Unión Europea, además, muchas webs están obligadas a cumplir requisitos de accesibilidad.

Un ejemplo

Un <button> real se puede activar con la tecla Intro y el lector de pantalla lo anuncia como botón; un <div> con un clic programado, no.

Por qué importa

La accesibilidad web busca que cualquier persona pueda usar un sitio, con independencia de sus capacidades o de cómo acceda. Incluye a quien usa un lector de pantalla por tener baja visión o ceguera, a quien navega solo con teclado, a personas con daltonismo o con dificultades auditivas o motoras, y también situaciones pasajeras, como mirar el móvil bajo el sol o con una mano rota. Beneficia, en la práctica, a todos los usuarios.

Muchas mejoras son sencillas: usar HTML semántico, poner texto alternativo (alt) a las imágenes, asociar cada campo de formulario con su <label>, mantener un contraste suficiente entre texto y fondo, no depender solo del color para transmitir información y asegurar que todo funciona con el teclado y con un foco visible. Las pautas de referencia son las WCAG. En muchos casos hay además obligaciones legales, sobre todo para administraciones y servicios públicos.

Confusiones frecuentes

Se piensa que es algo opcional o para «un porcentaje pequeño» de usuarios, o que se arregla al final con un complemento. En realidad es más barato y eficaz incorporarla desde el diseño. Otra confusión es creer que ARIA lo soluciona todo: la primera regla es usar la etiqueta HTML adecuada (<button> en vez de un <div> con clic), y solo recurrir a ARIA cuando HTML no basta. Y un error típico de principiante es poner alt="imagen": el texto alternativo debe describir la función o el contenido; las imágenes puramente decorativas llevan alt="".

Preguntas frecuentes

¿Cómo compruebo si mi web es accesible?

Prueba a navegar solo con el teclado (Tab y Enter), usa herramientas como Lighthouse o axe, y revisa el contraste. Lo ideal es probarla además con un lector de pantalla.

¿Qué contraste mínimo se recomienda?

Las WCAG piden una relación de contraste de al menos 4,5 a 1 para texto normal y 3 a 1 para texto grande, en el nivel AA.