Accesibilidad web: qué es, qué dicen las WCAG y cómo adaptar tu web paso a paso

Publicado el 29 octubre 2026 · Equipo mitza.es

Cuando se habla de accesibilidad web suele pensarse solo en la ley. Pero la accesibilidad es, ante todo, una cuestión práctica: que cualquier persona pueda leer, entender y usar tu web, aunque no vea bien, no pueda usar el ratón, tenga una discapacidad auditiva o motriz, o simplemente esté mirando el móvil al sol. Una web accesible además suele cargar mejor, entenderse mejor y posicionar mejor. Esta guía explica qué es, qué estándar se usa como referencia y cómo empezar a adaptar tu sitio sin rehacerlo desde cero.

Qué es la accesibilidad web

La accesibilidad web es el conjunto de prácticas de diseño y desarrollo que permiten que las personas con discapacidad, y también las que tienen limitaciones temporales o situacionales, puedan percibir, comprender, navegar e interactuar con una web. Afecta a quienes usan lectores de pantalla, a quienes navegan solo con el teclado, a quienes necesitan más contraste o texto ampliado y a quienes necesitan subtítulos en los vídeos.

No es un añadido «para unos pocos»: mejora la experiencia de todos. Los subtítulos ayudan en un tren sin auriculares, un buen contraste ayuda al sol y un formulario claro ayuda a cualquiera con prisa.

Qué son las WCAG y los cuatro principios

Las WCAG (Web Content Accessibility Guidelines, o pautas de accesibilidad para el contenido web) son el estándar internacional del W3C. Se organizan en cuatro principios que se resumen con las siglas POUR:

• Perceptible: la información se puede percibir (texto alternativo en imágenes, subtítulos, contraste suficiente).
• Operable: todo se puede manejar con teclado, sin límites de tiempo injustos ni trampas de foco.
• Comprensible: el texto es legible, la navegación es predecible y los errores de formulario se explican.
• Robusto: el código es válido y semántico, para que funcione con lectores de pantalla y otros productos de apoyo.

Niveles A, AA y AAA: cuál te interesa

Cada criterio de las WCAG tiene un nivel de conformidad: A (básico), AA (el nivel que suele exigirse como objetivo) y AAA (el más exigente, no siempre alcanzable para todo el contenido). Para una web de empresa, el objetivo razonable es el nivel AA. La versión de referencia más extendida en Europa es WCAG 2.1 AA, a través de la norma europea EN 301 549, y desde octubre de 2023 existe la versión 2.2, que añade nueve criterios nuevos (entre ellos un tamaño mínimo para los elementos táctiles de 24 por 24 píxeles CSS, con excepciones).

Qué dice la ley (y dónde ampliarlo)

En España, la Ley 11/2023 transpone la Directiva europea de accesibilidad y su Título I se aplica desde el 28 de junio de 2025. Alcanza, entre otros, al comercio electrónico: la obligación se refiere a la venta en línea de productos y servicios a consumidores. Existen excepciones y periodos transitorios (por ejemplo, para algunas microempresas que prestan servicios), así que conviene revisar tu caso concreto. Tienes el detalle del estado real del cumplimiento en nuestro artículo sobre la ley de accesibilidad web en España. Aquí nos centramos en lo práctico: qué cambiar en tu web.

Los errores de accesibilidad más habituales

• Imágenes sin texto alternativo (o con textos del tipo «imagen1.jpg»), o con alt en imágenes puramente decorativas que deberían ignorarse.
• Contraste insuficiente entre texto y fondo: las WCAG piden una relación de al menos 4,5:1 para texto normal y 3:1 para texto grande.
• Navegación imposible con teclado: menús que solo se abren con el ratón, ventanas modales que atrapan el foco o un foco invisible.
• Formularios mal etiquetados: campos sin label, errores que solo se indican con el color rojo o mensajes que no se anuncian.
• Estructura de encabezados caótica: saltos de H1 a H4, o encabezados usados solo para dar tamaño al texto.
• Enlaces ambiguos («pulsa aquí», «leer más») que no dicen a dónde llevan.
• Vídeos y audios sin subtítulos ni transcripción.
• Idioma de la página sin declarar, de modo que el lector de pantalla pronuncia mal el texto.

Checklist práctico para empezar

1. Navega por tu web solo con el teclado (Tab, Mayús+Tab, Intro, Esc): ¿llegas a todo y ves dónde estás?
2. Revisa que cada imagen informativa tenga un alt descriptivo y que las decorativas lo tengan vacío.
3. Comprueba el contraste de los textos con una herramienta de verificación.
4. Asegura una estructura de encabezados H1, H2, H3 lógica, con un único H1.
5. Etiqueta todos los campos de formulario y haz que los errores se expliquen con texto, no solo con color.
6. Haz que el texto de los enlaces tenga sentido fuera de contexto.
7. Añade subtítulos a los vídeos y evita que el contenido se reproduzca solo.
8. Declara el idioma de la página y no bloquees el zoom del móvil.
9. Comprueba que el diseño funciona al ampliar el texto al 200 % sin perder contenido.
10. Publica una declaración de accesibilidad con un contacto para avisar de problemas.

Herramientas para comprobar tu web

Las herramientas automáticas, como Lighthouse (integrado en Chrome), WAVE o axe DevTools, detectan una parte de los problemas: contrastes, imágenes sin alt, etiquetas ausentes. Son un buen primer filtro, pero no sustituyen una revisión manual: hay que probar el teclado, un lector de pantalla (NVDA en Windows, VoiceOver en Mac y iPhone) y la comprensión real del contenido. Tampoco son una solución los «widgets» o overlays de accesibilidad que se instalan con una línea de código: no corrigen el código de fondo y no se consideran cumplimiento.

Accesibilidad y SEO: qué tienen en común

Gran parte de lo que pide la accesibilidad es lo que Google premia: encabezados bien estructurados, textos alternativos, enlaces descriptivos, transcripciones y páginas rápidas. No es una promesa de posiciones, pero una web accesible suele ser una web más clara también para los buscadores. Si quieres trabajar las dos cosas a la vez, mira nuestro servicio de SEO.

Cuánto trabajo supone adaptar una web existente

Depende del punto de partida. En una web bien construida, muchas correcciones son pequeñas (alt, etiquetas, contraste). En webs con maquetación antigua, menús complejos o plugins que generan código poco semántico, puede hacer falta rehacer componentes concretos. Por eso lo eficaz es empezar con una auditoría que ordene los problemas por gravedad y por esfuerzo, y corregir primero lo que más impide el uso. Si tienes una tienda online, la accesibilidad del carrito y del pago es lo primero (te lo contamos también en nuestra guía de desarrollo de ecommerce).

Cómo te ayudamos en Mitza

Nuestra auditoría de accesibilidad web revisa contraste, navegación por teclado, compatibilidad con lectores de pantalla, formularios, estructura del HTML y texto alternativo, y te entrega un listado de qué falla y cómo corregirlo. Si prefieres empezar por una revisión general del sitio, tienes la auditoría, y para resolver dudas puedes escribirnos desde la página de contacto.