Una página web accesible es una que las personas con discapacidad pueden usar igual que cualquier otra persona: pueden escucharla con un lector de pantalla, recorrerla solo con el teclado, leer bien sus textos y llenar sus formularios sin ayuda. El estándar que se usa en casi todo el mundo para medir la accesibilidad web son las Pautas de Accesibilidad para el Contenido Web (WCAG), y el nivel que normalmente se busca es el AA. Si tu negocio atiende al público, y sobre todo si le vendes a clientes en Estados Unidos, vale la pena tratar la accesibilidad como un requisito y no como un extra.
Esto es información general, no asesoría legal. Las obligaciones cambian según el país, el tipo de negocio y cada caso. Si tienes dudas legales o recibiste un reclamo, consulta con un abogado.
¿Qué es la accesibilidad web?
La accesibilidad web consiste en quitar las barreras que impiden que alguien use un sitio. Piensa en personas ciegas o con baja visión, personas sordas o con pérdida auditiva, personas que no pueden usar un mouse y personas con discapacidades cognitivas. También piensa en adultos mayores cuya vista o motricidad ha cambiado, y en cualquiera que tenga una lesión temporal en la mano.
Un sitio con imágenes sin descripción, un formulario que no se puede enviar con el teclado o un video sin subtítulos deja fuera a parte de esos clientes. Muchas veces el dueño del negocio ni se entera, porque esas personas simplemente se van con la competencia.
No existe un "sello oficial" de página web accesible. Si una agencia o una herramienta te promete una certificación instantánea, ten cuidado. Lo que sí puedes hacer es diseñar y construir tu sitio con un estándar reconocido, probarlo, corregir lo que encuentres y mantenerlo accesible conforme cambia.
¿Qué son las WCAG y qué nivel necesita tu sitio?
Las WCAG (Web Content Accessibility Guidelines) las publica el World Wide Web Consortium (W3C), la organización que desarrolla los estándares de la web. Son la referencia de accesibilidad más usada en el mundo. La versión 2.1 salió en 2018 y la 2.2 se publicó en octubre de 2023. La 2.2 se basa en la 2.1 y agrega criterios nuevos, por ejemplo que el elemento enfocado no quede escondido detrás de un encabezado fijo, tamaños mínimos para los botones que se tocan en el celular y procesos de inicio de sesión más fáciles para personas con discapacidades cognitivas. Un sitio que cumple WCAG 2.2 nivel AA, en general, también cumple 2.1 nivel AA.
Las WCAG se organizan en cuatro principios:
- Perceptible: las personas pueden percibir el contenido con los sentidos que usan. Las imágenes tienen texto alternativo, los videos tienen subtítulos y los textos tienen suficiente contraste.
- Operable: todos los controles se pueden usar con mouse, teclado, dispositivos especiales o voz. Nada exige movimientos precisos ni pasa demasiado rápido.
- Comprensible: el contenido y la forma de interactuar son claros y predecibles. Los formularios explican qué necesitan y cómo corregir los errores.
- Robusto: el código es lo bastante limpio y estándar para que las tecnologías de apoyo, como los lectores de pantalla, lo interpreten bien.
Cada pauta tiene criterios en tres niveles:
- Nivel A: el mínimo. Sin él, algunas personas no pueden usar el sitio en absoluto.
- Nivel AA: el que buscan la mayoría de las organizaciones y el que suelen mencionar las regulaciones. Es la meta práctica para el sitio de un negocio.
- Nivel AAA: el más alto. No se espera para un sitio completo, porque algunos criterios no se pueden cumplir con todo tipo de contenido.
En inSpace diseñamos y construimos sitios con WCAG 2.2 nivel AA: navegación con teclado, foco visible, contraste de color y respeto a la preferencia de movimiento reducido.
¿Qué dice la ley en México sobre la accesibilidad web?
En México, la Ley General para la Inclusión de las Personas con Discapacidad reconoce el derecho a la accesibilidad, incluido el acceso a la información y a las tecnologías de la información y las comunicaciones. Además, los sitios del sector público han tenido lineamientos de accesibilidad web que toman como referencia estándares internacionales como las WCAG.
Para una empresa privada, el panorama es más general: no hay una regla técnica sencilla que diga "tu sitio debe cumplir este nivel exacto". Aun así, la dirección es clara, y diseñar con WCAG AA es la forma más sensata de prepararte. Si tienes dudas sobre las obligaciones de tu negocio en particular, un abogado puede orientarte.
¿Por qué importa la ADA si le vendes a clientes en Estados Unidos?
Si tu sitio vende o atiende a clientes en Estados Unidos, conviene conocer la ADA (Americans with Disabilities Act), una ley de 1990 que prohíbe discriminar a las personas con discapacidad. Su Título III cubre los "lugares de alojamiento público", como tiendas, restaurantes, hoteles, consultorios y oficinas que atienden al público. La ley se escribió antes de que existieran los sitios web como los conocemos, así que su aplicación a internet se ha definido en tribunales, y los tribunales no siempre han coincidido. Algunos han considerado que un sitio web puede estar cubierto por sí mismo; otros han pedido una conexión con un lugar físico.
Lo que sí es claro es que en Estados Unidos se han presentado muchas demandas y cartas de reclamo contra negocios por sitios web inaccesibles, y las empresas pequeñas y medianas no están exentas.
- Las reglas de la ADA para empresas privadas no fijan un estándar técnico web específico. En la práctica, la referencia son las WCAG.
- El Departamento de Justicia (DOJ) publicó una guía en 2022 que dice que los negocios abiertos al público deben hacer accesibles sus sitios, que tienen flexibilidad en cómo hacerlo, y que señala las WCAG como un estándar útil.
- En abril de 2024 el DOJ publicó una regla final bajo el Título II de la ADA, que aplica a gobiernos estatales y locales, y adoptó WCAG 2.1 nivel AA, con fechas de cumplimiento en 2026 y 2027 según el tamaño de la entidad. No aplica a empresas privadas, pero muestra qué estándar se considera la referencia.
Si tu empresa tiene operaciones, oficinas o clientes importantes en Estados Unidos, platícalo con un abogado que conozca ese tema.
Lista práctica para revisar si tu página web es accesible
No necesitas leer las WCAG completas para encontrar los problemas más comunes. Esta tabla reúne los que más vemos en sitios de negocios, una forma rápida de revisar cada uno y la solución habitual.
| Problema | Prueba rápida | Solución |
|---|---|---|
| Imágenes sin texto alternativo | Usa un verificador gratuito en el navegador o revisa si las imágenes clave tienen atributo alt | Escribe un texto alternativo breve que diga lo que comunica la imagen; marca como decorativas las que solo adornan |
| Poco contraste de color | Pasa los colores de texto y fondo por un verificador de contraste | Al menos 4.5:1 para texto normal y 3:1 para texto grande; revisa también botones y bordes de formularios |
| Navegación con teclado | Guarda el mouse y recorre la página con Tab, Shift+Tab, Enter y la barra espaciadora | Todos los enlaces, menús, botones y campos deben poder alcanzarse y usarse en un orden lógico, sin que el foco quede atrapado |
| Foco visible | Mientras usas Tab, ¿siempre ves en dónde estás? | No quites el contorno de foco sin poner uno claro en su lugar; evita que el elemento enfocado quede detrás de un encabezado fijo |
| Etiquetas y errores en formularios | Haz clic en cada etiqueta: ¿activa su campo? Envía el formulario vacío | Etiquetas visibles ligadas a cada campo, campos obligatorios señalados y mensajes de error en texto que expliquen cómo corregir |
| Estructura de encabezados | Usa una extensión que muestre el esquema de encabezados de la página | Un solo H1 y luego H2 y H3 en orden, usados para la estructura y no para dar estilo |
| Videos sin subtítulos | Reproduce cada video sin sonido | Subtítulos correctos (no solo los automáticos sin revisar) y transcripción para el contenido que solo es audio |
| Textos de enlace vagos | Lee solo los enlaces de la página: ¿se entienden fuera de contexto? | Cambia "clic aquí" y "leer más" por un texto que diga a dónde lleva el enlace |
| Zoom y reacomodo | Haz zoom al 200% y al 400% en el navegador | El texto crece sin romperse y el contenido se acomoda en una columna sin desplazamiento horizontal |
| Movimiento y animaciones | Activa "reducir movimiento" en la configuración de tu dispositivo y recarga | Respeta esa preferencia, evita contenido que parpadea y agrega botón de pausa a carruseles y contenido que se reproduce solo |
| PDF inaccesibles | Intenta seleccionar el texto de un PDF; ábrelo con un lector de pantalla | Usa PDF etiquetados con texto real, encabezados y orden de lectura, o publica ese contenido como página web |
Muchos de estos problemas nacen en el diseño, no en el código: un texto gris muy claro, un botón que solo indica su estado con color, un formulario con texto de ejemplo en lugar de etiquetas. Por eso la accesibilidad funciona mejor cuando es parte del diseño UI/UX desde el primer boceto. Para ver el panorama completo de lo que necesita un buen sitio, lee qué hace buena a una página web.
¿Cómo se prueba la accesibilidad de un sitio web?
Una buena revisión combina herramientas automáticas con una persona que realmente use el sitio.
Revisiones automáticas
Hay herramientas gratuitas, como extensiones del navegador o la auditoría de accesibilidad de las herramientas para desarrolladores, que revisan una página en segundos. Son muy buenas para detectar imágenes sin atributo alt, poco contraste, enlaces vacíos y campos sin etiqueta. Pero solo detectan una parte de los problemas. Una herramienta sabe si una imagen tiene texto alternativo; no sabe si ese texto tiene sentido. Tampoco puede juzgar si el orden del teclado es lógico o si un mensaje de error se entiende.
Revisiones manuales
- Prueba con teclado: completa tus tareas más importantes (formulario de contacto, agendar una cita, comprar) sin tocar el mouse.
- Prueba con lector de pantalla: haz lo mismo con un lector de pantalla. NVDA es gratuito en Windows, VoiceOver viene en Mac y iPhone, y TalkBack viene en Android.
- Prueba de zoom y celular: haz zoom al 200% en computadora y usa el sitio en un celular con el texto grande activado.
- Revisión de contenido: textos alternativos, textos de enlaces, encabezados, subtítulos y documentos.
Empieza por las páginas y los caminos que más le importan a tu negocio: la página de inicio, las páginas de servicios o productos, los formularios de contacto y de citas, y el proceso de compra. Vuelve a probar después de cada cambio importante, porque el contenido nuevo y los plugins pueden meter barreras nuevas.
¿Los widgets o "overlays" de accesibilidad hacen accesible tu sitio?
Los overlays son widgets, normalmente un ícono en una esquina de la pantalla, que prometen hacer accesible un sitio con solo agregar una línea de código. Pueden ofrecer opciones como agrandar el texto o activar un modo de alto contraste.
La opinión más extendida entre los especialistas en accesibilidad es que un overlay, por sí solo, no hace accesible ni conforme un sitio. No corrige el código de fondo, así que un formulario sin etiquetas o un menú que no se puede usar con teclado normalmente sigue igual. Muchas personas que usan lectores de pantalla ya tienen sus propias herramientas y configuraciones, y algunas reportan que los overlays interfieren con ellas. En Estados Unidos, negocios que confiaron en un overlay han recibido reclamos y demandas de todos modos.
Si ya tienes uno, no necesariamente hace daño dejarlo, pero no lo veas como la solución. La solución está en el diseño, el código y el contenido.
¿Qué es una declaración de accesibilidad?
Es una página de tu sitio que explica tu compromiso con la accesibilidad. Una buena declaración incluye:
- El estándar que buscas cumplir, por ejemplo WCAG 2.2 nivel AA.
- Las limitaciones conocidas en las que todavía estás trabajando, si las hay.
- Cómo pueden contactarte si encuentran una barrera: un correo y un teléfono.
- La fecha de la última revisión.
Una declaración no vuelve accesible un sitio, y nunca debe prometer más de lo que es cierto. Su verdadero valor es darle a tus clientes una forma de buscarte y darte a ti la oportunidad de ayudarles y corregir el problema rápido.
¿Cómo planear las correcciones de accesibilidad en tu negocio?
No tienes que corregir todo en una semana. Un plan práctico se ve así:
- Auditoría. Usa herramientas automáticas y haz pruebas manuales con teclado y lector de pantalla en tus páginas y procesos clave. Haz una lista de problemas con su página y su gravedad.
- Primero lo que bloquea. Todo lo que impide que alguien te contacte, agende o compre va antes que los detalles estéticos.
- Corrige las plantillas. La mayoría de los sitios reutilizan el mismo encabezado, pie de página y diseños de página. Si corriges una plantilla, corriges todas las páginas que la usan.
- Limpia el contenido. Textos alternativos, textos de enlaces, encabezados, subtítulos y PDF. Muchas veces tu propio equipo puede aprender a hacerlo.
- Publica una declaración de accesibilidad con un medio de contacto real.
- Mantenlo accesible. Agrega revisiones de accesibilidad a tu rutina de publicación y al mantenimiento. Nuestra guía sobre cuánto cuesta el mantenimiento de una página web explica qué suele incluir ese cuidado.
El costo depende del tamaño del sitio, de cómo se construyó y de cuántos problemas encuentre la auditoría. A veces unos días de correcciones enfocadas resuelven casi todo. En otros casos, sobre todo con plantillas viejas o constructores visuales que generan código desordenado, conviene más reconstruir el sitio de forma accesible desde el inicio. Si estás evaluando esa opción, lee cuánto cuesta rediseñar una página web, y cuando compares proveedores, pregúntales cómo manejan la accesibilidad. En nuestra guía sobre cómo elegir una agencia de diseño web encontrarás más preguntas útiles.
¿Qué gana tu negocio con una página web accesible?
Reducir riesgos legales es una buena razón para invertir en accesibilidad, pero no es la única.
- Más personas pueden comprarte. Las personas con discapacidad, los adultos mayores y cualquiera con una lesión temporal dependen de sitios accesibles. Si no pueden usar el tuyo, usarán el de la competencia.
- Se cruza con el SEO. Los textos alternativos descriptivos, los encabezados claros, los enlaces con texto útil, los subtítulos y el código limpio también ayudan a que Google y las herramientas de inteligencia artificial entiendan tus páginas. La accesibilidad no es un atajo para posicionar, pero comparte muchas buenas prácticas con el SEO.
- Todos tienen una mejor experiencia. El buen contraste ayuda a leer el celular bajo el sol. Los subtítulos ayudan en una sala de espera ruidosa. Los formularios claros ayudan a que todos terminen más rápido.
- Demuestra que te importa tu cliente. La gente nota cuando un negocio se esfuerza por incluirla.
Cómo construye inSpace páginas web accesibles
Cuando planeamos un proyecto de diseño web, la accesibilidad es parte del sistema de diseño desde el principio: el contraste se revisa en la paleta de colores, los estados de foco se diseñan en lugar de eliminarse, los formularios tienen etiquetas reales y errores claros, las animaciones respetan la preferencia de movimiento reducido y las plantillas se construyen para usarse con teclado y lector de pantalla. Diseñamos y construimos con WCAG 2.2 nivel AA y hacemos pruebas antes de lanzar. No vendemos certificaciones, y te vamos a decir con claridad lo que encuentre una revisión.
Trabajamos en español y en inglés, con negocios en México y en Texas, así que también podemos ayudarte si tu sitio atiende a clientes de los dos países. Si te preocupa tu sitio actual o estás planeando uno nuevo, agenda una llamada gratuita de 30 minutos. Revisamos tu sitio juntos, te señalamos las barreras más importantes y platicamos la forma más sensata de corregirlas. Para las dudas legales, incluye también a tu abogado.