Definición
La accesibilidad web es la propiedad de que una web pueda usarla cualquier persona, incluidas las que tienen alguna discapacidad visual, auditiva, motriz o cognitiva.
No afecta a una minoría pequeña, y conviene decirlo con datos aproximados pero honestos: hablamos de un porcentaje de dos cifras de la población, y creciendo con el envejecimiento. Además, la misma persona puede necesitarla temporalmente —un brazo escayolado, una pantalla al sol, un entorno ruidoso—.
La referencia técnica son las WCAG, organizadas en tres niveles: A (mínimo), AA (el objetivo habitual y el que exige la normativa) y AAA (muy exigente, rara vez alcanzable en su totalidad).
Los cuatro principios
Las WCAG se estructuran en cuatro ideas que sirven de guía mental:
Perceptible. El contenido debe poder percibirse por más de un sentido: texto alternativo en imágenes, subtítulos en vídeo, contraste suficiente.
Operable. Todo debe poder hacerse sin ratón, solo con teclado. Y el foco debe verse.
Comprensible. Lenguaje claro, comportamiento predecible, errores que expliquen qué corregir.
Robusto. HTML correcto, que las tecnologías de apoyo puedan interpretar.
Lo que exige la ley en España
Aquí hay que ser preciso, y esto es orientativo: la normativa de accesibilidad es obligatoria para el sector público y se ha ido extendiendo a empresas privadas de cierto tamaño y a sectores concretos —comercio electrónico, banca, transporte, servicios digitales—, con el nivel AA como referencia.
Para un caso concreto conviene confirmar con un especialista si aplica y desde cuándo. Lo que sí es seguro: la tendencia normativa va hacia más exigencia, no menos.
Ejemplo práctico
Lo interesante de la accesibilidad es que el 80 % del resultado sale de un puñado de medidas baratas, y casi todas son cosas que ya deberías hacer.
Lo que aprendí llevándola a la práctica: estas seis dan el mayor salto con el menor esfuerzo.
HTML semántico. Usar <button> para los botones, <nav> para la navegación y encabezados en orden. Un <div> con un clic encima no es un botón: no recibe foco, no responde al teclado y no se anuncia como tal.
Contraste suficiente entre texto y fondo. Un gris claro sobre blanco es elegante y muchas veces ilegible.
Texto alternativo en las imágenes que aportan información — y vacío en las decorativas, para que el lector no las lea.
Navegación completa con teclado, con el foco visible. La prueba es inmediata: recorre tu web solo con el tabulador y comprueba si puedes hacerlo todo y si ves dónde estás.
Etiquetas en los formularios, asociadas al campo. Un campo con solo un texto de ejemplo dentro deja de tener etiqueta en cuanto escribes.
Textos de enlace con significado. «Ver el catálogo de casquillos» funciona; «pincha aquí» repetido doce veces no dice nada.
El segundo aprendizaje, que sorprende a mucha gente: la accesibilidad mejora el SEO. Encabezados jerárquicos, texto alternativo, HTML semántico y enlaces descriptivos son exactamente lo que ayuda a un buscador a entender la página. No son dos trabajos: es el mismo trabajo con dos beneficios.
Y una advertencia sobre los remedios automáticos: los complementos que prometen «hacer tu web accesible» con una línea de código no funcionan. Las herramientas automáticas detectan una parte de los problemas —contraste, atributos que faltan— y no pueden juzgar si un texto alternativo describe bien la imagen ni si el orden de lectura tiene sentido. Sirven para empezar, no para acabar.
Errores comunes
<div>con clic en lugar de<button>.- Contraste insuficiente.
- Quitar el contorno del foco porque «queda feo».
- Texto de ejemplo como única etiqueta en un formulario.
- Imágenes informativas sin texto alternativo, y decorativas con descripción inútil.
- Enlaces «pincha aquí».
- Contenido que solo se activa al pasar el ratón.
- Fiarse de un complemento automático.
Cuándo aplicarlo
Desde el diseño, no al final. Corregir contraste, estructura y semántica sobre una web terminada cuesta mucho más que decidirlo bien de entrada.
La prueba de un minuto que revela casi todo: desenchufa el ratón y usa tu propia web solo con el teclado. Lo que no puedas hacer, tampoco lo puede hacer una parte de tus visitantes.
