Accesibilidad web: qué exige la ley y qué corregir primero
Por Toy Wen Da, Cofundador · · 14 min de lectura
Traducido del original en inglés. Léelo en inglés
La accesibilidad web consiste en construir tu sitio para que las personas con discapacidad puedan percibirlo, entenderlo, desplazarse por él y usarlo, ya dependan de un lector de pantalla, un teclado, subtítulos o el zoom del navegador. En la práctica, esto significa cumplir las Pautas de Accesibilidad para el Contenido Web (WCAG, por sus siglas en inglés), el estándar al que remiten la mayoría de las leyes de accesibilidad.
Esta guía es para dueños de negocios y profesionales de marketing que se encargan del sitio web de una empresa. Explica a quién afecta, qué exige la ley de EE. UU., qué barreras aparecen en la mayoría de los sitios, qué correcciones puedes hacer tú mismo y cuándo vale la pena pagar a un especialista.
Qué abarca la accesibilidad web
El W3C, el organismo que fija los estándares de la web, define la accesibilidad web como sitios, herramientas y tecnologías diseñados para que las personas con discapacidad puedan usarlos. Es decir, que puedan percibir, entender, navegar e interactuar con la web, y también contribuir a ella.
Tim Berners-Lee, el inventor de la web, expresó el objetivo con claridad: "The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect." La Introduction to Web Accessibility del W3C comienza con esa frase.
Quiénes dependen de un sitio accesible
WebAIM, que forma a desarrolladores en diseño accesible, señala que uno de cada cuatro adultos en Estados Unidos tiene una discapacidad. No toda discapacidad afecta a la manera de usar internet. Aun así, como dice WebAIM, pocas empresas rechazarían a sabiendas a una cuarta parte de sus clientes potenciales, ni siquiera al 5 por ciento.
Los grupos principales son estos:
- Visual: ceguera, baja visión y daltonismo. Pueden usar lectores de pantalla, que leen la página en voz alta, o magnificadores de pantalla.
- Auditiva: sordera y pérdida de audición. Dependen de subtítulos y transcripciones.
- Motora: control motor fino limitado o imposibilidad de usar el ratón. Pueden usar un teclado, un puntero bucal, software de seguimiento ocular o comandos de voz.
- Cognitiva: dificultades de aprendizaje, distracción y problemas para retener mucha información a la vez. Aquí importan sobre todo una redacción clara y una estructura lógica.
El W3C incluye también en su definición las discapacidades del habla y las neurológicas.
Los beneficios van mucho más allá de la discapacidad
El W3C enumera varios grupos que se benefician del diseño accesible sin tener una discapacidad:
- personas que usan móviles y televisores inteligentes, con pantallas pequeñas o distintas formas de entrada
- personas mayores cuya vista o audición cambia con la edad
- personas con una discapacidad temporal, como un brazo roto o haber perdido las gafas
- personas limitadas por su situación, como la luz solar intensa o un lugar donde no pueden reproducir sonido
- personas con una conexión a internet lenta o cara
Esa coincidencia es la razón por la que el trabajo de accesibilidad y el de usabilidad van en la misma dirección. Si ya estás aplicando un plan para mejorar la experiencia de usuario de tu sitio, muchos de los mismos cambios cuentan por partida doble.
El estándar WCAG en palabras sencillas
Las WCAG las redacta el World Wide Web Consortium (W3C) y, según el W3C, la versión 2.2 es además un estándar ISO, el ISO/IEC 40500. WebAIM las considera la base de la mayoría de las leyes de accesibilidad web del mundo.
Las pautas se apoyan en cuatro principios, cuyas iniciales forman la palabra POUR (en inglés):
- Perceptible. Los usuarios pueden captar el contenido con los sentidos de que disponen, o mediante tecnología de apoyo. Las imágenes tienen alternativas de texto y los vídeos tienen subtítulos.
- Operable. Todos los controles funcionan desde un teclado o un dispositivo de apoyo, además de con el ratón. Nada depende de movimientos precisos del ratón.
- Comprensible. El contenido es claro y el sitio se comporta de forma predecible.
- Robusto. El código es lo bastante limpio como para que muchos navegadores y herramientas de apoyo, antiguos y nuevos, puedan leerlo.
Para los widgets interactivos creados con JavaScript, los desarrolladores usan WAI-ARIA. Es una tecnología del W3C que añade significado que los navegadores y las herramientas de apoyo pueden transmitir a los usuarios. La documentación de accesibilidad de MDN de Mozilla la explica en profundidad. MDN también señala algo más sencillo: una gran cantidad de contenido se vuelve accesible con solo usar el elemento HTML correcto para cada función.
¿Es obligatoria por ley la accesibilidad web?
A menudo, sí. Los detalles dependen de quién seas y de dónde operes. Lee lo que sigue como un resumen de orientaciones públicas y consulta a un abogado sobre tu situación concreta.
La ADA y tu sitio web
La Ley de Estadounidenses con Discapacidades (ADA) cubre a los gobiernos estatales y locales en el Título II, y a los negocios abiertos al público en el Título III. En su guía sobre accesibilidad web y la ADA, fechada el 18 de marzo de 2022, el Departamento de Justicia afirma que ha sostenido de forma constante que la ADA se aplica a los servicios y bienes que se ofrecen en la web.
Entre los ejemplos del Título III del DOJ figuran tiendas minoristas, bancos, hoteles, hospitales y consultorios médicos, negocios de comida y bebida, y teatros y estadios deportivos. Si los clientes pueden entrar en tu negocio, la postura del DOJ es que lo que ofreces en tu sitio web también está cubierto.
La misma guía indica que los negocios pueden elegir cómo cumplir, porque el DOJ no había fijado estándares técnicos detallados para ellos. Aun así, deben hacer accesible lo que ofrecen en línea, y el DOJ señala las WCAG y los Estándares de la Sección 508 federal como orientación útil.
Gobiernos estatales y locales: la norma de 2024
La página de ADA.gov incluye su propia advertencia. La guía de 2022 no refleja los requisitos para los gobiernos estatales y locales publicados en el Federal Register el 24 de abril de 2024. Si gestionas o creas sitios web para un organismo público, lee esa norma directamente en lugar de un resumen anterior.
Sección 504, Sección 508 y otros países
La Ley de Rehabilitación de 1973 añade las Secciones 504 y 508. La Sección 508 fija los estándares que usa el gobierno federal para sus propios sitios web. Fuera de EE. UU., WebAIM señala que muchas leyes internacionales también abordan la accesibilidad. La Convención de las Naciones Unidas sobre los Derechos de las Personas con Discapacidad va más lejos y trata el acceso a la web como un derecho humano básico.
| Norma o estándar | A quién se aplica | Qué significa para un sitio web | Dónde consultarla |
|---|---|---|---|
| ADA Título II | Gobiernos estatales y locales | El DOJ considera cubiertos sus servicios y programas en línea | ADA.gov, más la norma publicada el 24 de abril de 2024 |
| ADA Título III | Negocios abiertos al público, como tiendas, bancos, hoteles y consultorios médicos | El DOJ considera cubiertos los bienes y servicios ofrecidos en línea, con flexibilidad en la forma de cumplir | Guía del DOJ fechada el 18 de marzo de 2022 |
| Sección 508 de la Ley de Rehabilitación de 1973 | Agencias federales | Fija los estándares de accesibilidad que siguen los sitios web federales | Los Estándares de la Sección 508 |
| WCAG del W3C | Cualquiera; la mayoría de las leyes de accesibilidad se basan en ellas | La lista técnica con la que prueban la mayoría de los equipos; WCAG 2.2 es además ISO/IEC 40500 | La Web Accessibility Initiative del W3C |
| Convención de la ONU sobre los Derechos de las Personas con Discapacidad | Países que la han ratificado | Trata el acceso a la web como un derecho humano básico | Las Naciones Unidas |
Las barreras de accesibilidad que aún tienen la mayoría de los sitios
UserWay, una empresa que vende software de accesibilidad, informa de que el 96 % de los sitios web principales contiene problemas de accesibilidad fáciles de detectar. Es una cifra del propio proveedor, pero coincide con la opinión de WebAIM de que el potencial de la web para las personas con discapacidad "remains largely unrealized".
Las mismas pocas barreras aparecen una y otra vez en la guía del DOJ, así que aquí las tienes con su corrección y una respuesta directa sobre si puedes hacerlo tú mismo.
| Barrera | A quién bloquea | La corrección | ¿Puedes corregirlo tú? |
|---|---|---|---|
| Imágenes sin texto alternativo | Usuarios ciegos con lectores de pantalla | Añade un texto alternativo breve que diga para qué sirve la imagen | Sí, en la mayoría de los sistemas de gestión de contenidos |
| Bajo contraste de color | Personas con baja visión o daltonismo | Oscurece el texto o aclara el fondo hasta que el texto destaque con claridad | Normalmente, aunque los cambios en los colores de marca pueden requerir un diseñador |
| El color como única señal | Usuarios daltónicos y usuarios de lectores de pantalla | Añade una señal de texto, como la palabra "obligatorio" junto a un campo de formulario en rojo | Sí |
| Vídeos sin subtítulos | Personas sordas o con dificultades auditivas | Añade subtítulos precisos y sincronizados que identifiquen a quien habla | Sí, o con un servicio de subtitulado |
| Audio sin transcripción | Personas sordas o con dificultades auditivas | Publica una transcripción en texto junto con el audio | Sí; el W3C dice que las transcripciones son fáciles y relativamente baratas |
| Campos de formulario sin etiquetas o con errores vagos | Usuarios de lectores de pantalla y personas con discapacidad cognitiva | Etiqueta cada campo, da instrucciones claras y explica cada error y cómo solucionarlo | En parte; a menudo hace falta un desarrollador |
| Menús y botones que requieren ratón | Personas que no pueden usar el ratón, incluidos los usuarios de control por voz | Haz que todas las funciones se puedan usar con el teclado | Normalmente hace falta un desarrollador |
| Encabezados elegidos por su tamaño de letra | Usuarios de lectores de pantalla que saltan de un encabezado a otro | Usa etiquetas de encabezado reales en un orden lógico | Sí |
| Enlaces que dicen "haz clic aquí" | Usuarios de lectores de pantalla que recorren una lista de enlaces | Escribe textos de enlace que se entiendan por sí solos | Sí |
Imágenes, vídeo y audio
El texto alternativo debe describir la finalidad de una imagen. El DOJ dice que, para ser útil, debe ser breve y descriptivo. Una foto de producto necesita el nombre del producto. Un gráfico necesita la idea que transmite.
En el caso del vídeo, el DOJ pide subtítulos sincronizados, precisos e que identifiquen quién habla. Para el audio archivado, como un episodio anterior de un pódcast, WebAIM dice que puede bastar una transcripción.
Formularios y uso del teclado
Los formularios son donde los problemas de accesibilidad te cuestan dinero de forma más directa. Un cliente que no puede enviar un formulario de reserva o de pago simplemente se va. Cada campo necesita una etiqueta que un lector de pantalla pueda anunciar, como "número de tarjeta de crédito" en el campo de la tarjeta. Cuando alguien se equivoca, la página debe avisarle de inmediato, decirle qué falló y explicarle cómo corregirlo. Una fecha escrita en el formato equivocado es el propio ejemplo del DOJ.
El acceso con teclado es la otra mitad. Algunas personas no pueden usar el ratón en absoluto, y muchos usuarios mayores con control motor fino limitado están en ese grupo. Cuando todos los menús y formularios funcionan con el teclado, también pueden usar tu sitio quienes emplean entrada por voz y otras herramientas que actúan como un teclado. El tamaño del texto también importa: las personas con baja visión necesitan acercar con el zoom del navegador sin que la página se desmorone.
Estructura: encabezados, enlaces, tablas y documentos
Los usuarios de lectores de pantalla suelen moverse por una página a través de sus encabezados, o escuchar solo sus enlaces. Por eso los encabezados deben ser elementos de encabezado reales en un orden coherente, y cada enlace debe entenderse fuera de contexto. Puedes ver el esquema de encabezados de una página, junto con su etiqueta de título, en un verificador gratuito de encabezados y metaetiquetas.
Las tablas de datos necesitan celdas de encabezado para que un lector de pantalla pueda asociar cada valor con su fila y su columna. Los PDF y los archivos de Word requieren el mismo cuidado. WebAIM recomienda los PDF etiquetados, o una versión HTML cuando un documento no se puede hacer accesible. Un enlace "Saltar al contenido principal" al principio de cada página permite a los usuarios de teclado saltarse el menú que se repite en todas las páginas.
Cómo se solapan la accesibilidad web y el SEO
Gran parte de lo que hace accesible una página también facilita que los buscadores la lean. El W3C señala que los buscadores tampoco pueden ver las imágenes. Leen el texto alternativo, igual que un lector de pantalla, y una transcripción convierte el audio en texto que pueden leer.
La coincidencia va más allá de los medios:
- Los encabezados dan a los usuarios de lectores de pantalla un mapa de la página. Dan a los rastreadores un esquema claro de de qué trata la página.
- El texto de enlace descriptivo le dice a un usuario de lector de pantalla y a un buscador de qué trata la página siguiente. "Precios de limpieza de oficinas" es mejor que "haz clic aquí" para ambos.
- El HTML limpio también compensa. WebAIM señala que el código accesible suele ser más ligero y eficiente, y que el HTML y el CSS válidos hacen el código más sólido.
- Muchas barreras que complican la vida a las personas con discapacidad también frustran a quienes usan el móvil en pantallas pequeñas.
Sé realista sobre lo que esto implica. El trabajo de accesibilidad no posicionará una página por sí solo, y el motivo para corregir una barrera es que, si no, hay personas que no pueden usar tu sitio. El beneficio en buscadores viene de una estructura más clara y un mejor contenido. Para saber más sobre cómo encajan la estructura, el contenido y las correcciones técnicas, consulta el blog de SearchBlueprint.
Cómo comprobar tú mismo la accesibilidad de tu sitio
Puedes encontrar mucho en una tarde, sin software especial. El W3C publica una guía llamada "Easy Checks", una primera revisión de la accesibilidad web, construida justo sobre esta idea: pasos sencillos, como cambiar ajustes del navegador, te muestran dónde están los problemas evidentes.
Comprobaciones rápidas que puedes hacer hoy
- Deja el ratón a un lado y recorre con la tecla Tab tu página de inicio y tu formulario más importante. ¿Puedes ver siempre dónde estás, y puedes llegar a todos los enlaces y enviar el formulario?
- Aumenta el zoom del navegador muy por encima del tamaño normal y comprueba si el texto sigue siendo legible o empieza a solaparse y a cortarse.
- Revisa tus imágenes. Mira el texto alternativo de tus páginas clave. ¿Falta, o está lleno de palabras clave en lugar de describir la imagen?
- Lee tus encabezados en orden. ¿Forman un esquema lógico, o saltan de H1 a H4 porque a alguien le gustaba el tamaño de la letra?
- Reproduce un vídeo sin sonido. ¿Hay subtítulos y son precisos?
- Rompe un formulario a propósito. Deja un campo obligatorio vacío y envíalo. ¿El error explica el problema con palabras, o solo pone una casilla en rojo?
- Ejecuta un verificador automático. Las herramientas gratuitas señalan en minutos el texto alternativo que falta y el contraste bajo.
Si quieres una lista más amplia para repasar al mismo tiempo, esta lista de verificación de auditoría web con 25 comprobaciones gratuitas cubre lo básico técnico y de la página.
Por qué las herramientas automáticas y los overlays tienen un límite
Los verificadores automáticos son útiles. Pero también pasan por alto mucho. El W3C es directo: ninguna herramienta por sí sola puede determinar si un sitio cumple las pautas de accesibilidad, y se requiere una evaluación humana experta. El DOJ compara los verificadores automáticos y los overlays con los correctores ortográficos y gramaticales, que solo ayudan si se usan con cuidado, y advierte de que un informe "limpio" no significa necesariamente que el sitio sea accesible.
Esa cautela se aplica a los overlays, los widgets que añaden una barra de herramientas de accesibilidad y prometen corregir problemas comunes a medida que carga cada página. Proveedores como UserWay los venden junto con auditorías manuales y monitorización. Un widget no puede saber si tu texto alternativo describe lo correcto, ni si los errores de tus formularios tienen sentido. Trátalo como una capa adicional sobre la corrección de tus páginas.
Cuándo recurrir a un profesional
Hacerlo tú mismo funciona bien para las correcciones de contenido: texto alternativo, subtítulos, encabezados, texto de enlaces y redacción clara. Busca ayuda experta cuando:
- uses componentes personalizados de JavaScript, como selectores de fecha o carruseles, que requieren ARIA y gestión del teclado
- tus formularios de pago, reserva o solicitud sean complejos
- estés planeando un rediseño, ya que el W3C dice que es más eficiente integrar la accesibilidad desde el principio que rehacer el trabajo después
- necesites una auditoría formal, por ejemplo porque el proceso de compras de un cliente o una carta legal la pidan
La curva de aprendizaje es más corta de lo que mucha gente espera. WebAIM dice que un desarrollador puede aprender lo básico de la accesibilidad web en unos días, aunque a menudo se tardan meses en que la mentalidad y las técnicas se vuelvan algo natural. Si quieres empezar a aprender por tu cuenta, el W3C ofrece un vídeo introductorio de 4 minutos y un curso gratuito en línea, Digital Accessibility Foundations.
Haz de la accesibilidad parte de tu forma de publicar
Las correcciones puntuales se deterioran. Se publica una nueva entrada de blog sin texto alternativo, sale un vídeo nuevo sin subtítulos y un rediseño elimina el enlace para saltar al contenido. El consejo de WebAIM para las organizaciones es generar conciencia, lograr que la dirección respalde el trabajo y apoyarlo con una política escrita, de modo que la accesibilidad pase a formar parte de la rutina diaria.
Para un equipo pequeño, eso pueden ser unas pocas líneas añadidas a cada brief de contenido:
- cada imagen lleva un texto alternativo que dice lo que muestra o hace
- cada vídeo lleva subtítulos antes de publicarse
- los encabezados siguen un orden lógico
- el texto de los enlaces dice adónde lleva el enlace
- los formularios se prueban con el teclado antes del lanzamiento
Después, repite tus comprobaciones tras cada versión, igual que volverías a auditar cualquier otra cosa que se desvía con el tiempo. Puedes ver ese hábito en la práctica en nuestro caso de estudio, donde auditamos nuestro propio sitio.
Preguntas frecuentes
¿Es la accesibilidad web un requisito legal para las pequeñas empresas?
En EE. UU., la postura del DOJ es que la ADA cubre a los negocios abiertos al público, y que los bienes y servicios que ofrecen en línea también están cubiertos. El DOJ da a los negocios flexibilidad en la forma de cumplir, pero espera que el resultado sea accesible. Otros países tienen sus propias leyes, así que revisa las normas del lugar donde operas.
¿Qué son las WCAG y qué versión debo seguir?
Las WCAG, las Pautas de Accesibilidad para el Contenido Web, son el estándar internacional del W3C para contenido web accesible. El W3C señala que WCAG 2.2 también se publica como el estándar ISO ISO/IEC 40500, lo que la convierte en la versión natural con la que hacer las pruebas.
¿Hará un overlay de accesibilidad que mi sitio cumpla la normativa?
No por sí solo. El DOJ dice que los verificadores automáticos y los overlays pueden ayudar, pero hay que usarlos con cuidado, y que un informe limpio no significa necesariamente que el sitio sea accesible. El W3C añade que se requiere una evaluación humana para confirmar que un sitio cumple las pautas.
¿Ayuda la accesibilidad web al SEO?
De forma indirecta. El texto alternativo, las transcripciones, los encabezados lógicos y los enlaces descriptivos ayudan a los buscadores a entender una página, además de a las personas que usan tecnología de apoyo. Considera el beneficio en buscadores como un extra.
¿Cuánto se tarda en hacer accesible un sitio web?
Depende. Las correcciones de contenido, como el texto alternativo y los subtítulos, pueden empezar esta semana, mientras que los problemas de código, como el acceso con teclado, requieren tiempo de un desarrollador y dependen de cómo se construyó el sitio. WebAIM dice que un desarrollador puede aprender lo básico en unos días. Integrar la accesibilidad desde el principio, señala el W3C, es más eficiente que volver atrás a rehacer el trabajo.
Recorre con Tab tu página más importante esta semana
Elige la página que trae más negocio y deja el ratón a un lado. Intenta completar su tarea principal solo con el teclado y anota cada lugar donde te atasques. Esa lista es el punto de partida de tu trabajo de accesibilidad web. Para ver cómo una revisión completa del sitio presenta los problemas y las correcciones, echa un vistazo a nuestro informe de auditoría SEO de muestra y luego habla con el equipo sobre qué cubriría una revisión de tu propio sitio.
Recursos / Referencias
- Introduction to Web Accessibility
- WebAIM
- Documentación de accesibilidad de MDN
- guía sobre accesibilidad web y la ADA
Lectura relacionada: Web Accessibility and SEO: Why Fixing One Boosts the Other.
Fuentes
Sobre el autor
SearchBlueprint investigó, escribió y puntuó este artículo con el mismo flujo de contenido que nuestros clientes usan en sus propios sitios. La puntuación que aparece junto al autor es la que nuestro motor de contenido dio a esta página antes de publicarla. Nada de esto se revisa a mano, y ese es el punto: es el resultado del producto, publicado donde cualquiera puede comprobarlo.