¿Tu sitio web está listo para las reglas de accesibilidad?
Escribe la dirección de tu sitio y recibe un reporte claro de las barreras más comunes que impiden que las personas con discapacidad usen tu sitio, las mismas barreras que provocan quejas por la ADA. Qué está bien, qué necesita atención y por qué importa cada cosa, todo en español sencillo. Sin cuenta y sin trucos: la revisión no guarda nada, y el detalle completo se manda a tu correo.
Esta calificación mide la preparación en accesibilidad: cómo maneja tu página de inicio las barreras que puede ver una revisión automática. No es una certificación de cumplimiento legal, y ninguna calificación garantiza protección contra quejas o demandas. Cumplir por completo con WCAG también requiere pruebas hechas por personas.
Estructura y navegación
32 de 50 puntos
La página declara su idioma.
- La etiqueta <html> tiene lang="en".
Los lectores de pantalla leen tu página en voz alta, y necesitan saber en qué idioma pronunciarla. Si la página no lo declara, el programa adivina, y un texto leído con las reglas de pronunciación equivocadas puede ser difícil de seguir. Corresponde a la regla 3.1.1 de WCAG 2.1 (Idioma de la página).
La página tiene un título descriptivo.
- Título de la página: "Example Bakery | Fresh bread in Sacramento"
El título de la página es lo primero que anuncia un lector de pantalla cuando carga la página, y es el nombre de la pestaña del navegador. Un título claro les dice a tus visitantes dónde están antes de que se lea cualquier otra cosa. Corresponde a la regla 2.4.2 de WCAG 2.1 (Titulado de páginas).
Hay títulos, pero el esquema tiene detalles por corregir.
- Títulos encontrados: 2 h1, 3 h2, 1 h4.
- Título principal: "Fresh bread, baked every morning"
- 1 lugar donde los niveles de título se saltan (por ejemplo, un h2 seguido directamente de un h4).
- Se encontraron 2 títulos h1; quienes usan lector de pantalla esperan un solo título principal.
Quienes usan lectores de pantalla muchas veces saltan de título en título para recorrer una página, igual que las personas que ven la recorren con la vista. Eso solo funciona cuando hay un título principal y los niveles bajan en orden, como un esquema. Los niveles que se saltan o la falta de un título principal hacen que la página se sienta como un libro con los capítulos revueltos. Corresponde a las reglas 1.3.1 y 2.4.6 de WCAG 2.1.
La página marca sus zonas para los lectores de pantalla.
- Encontradas: zona de contenido principal (<main>), zona de navegación (<nav>), zona de encabezado (<header>), zona de pie de página (<footer>).
Los landmarks son señales invisibles que dividen la página en zonas: el contenido principal, el menú de navegación, el encabezado y el pie de página. Quienes usan lector de pantalla brincan directo entre ellas en lugar de escuchar toda la página desde arriba. Sin ellas, cada visita empieza desde el mero principio de la página. Corresponde a las reglas 1.3.1 y 2.4.1 de WCAG 2.1.
No hay enlace para saltar ni una zona de contenido principal marcada.
- Entre los primeros enlaces internos de la página no hay ninguno que parezca un enlace para saltar.
- Tampoco existe una zona <main> como otra forma de brincarse el menú.
Quien navega con el teclado presiona Tab para pasar por cada enlace en orden. Sin un enlace para saltar, tiene que recorrer todo tu menú en cada página antes de llegar al contenido, y eso cansa tanto que la gente se da por vencida. Corresponde a la regla 2.4.1 de WCAG 2.1 (Evitar bloques).
El zoom con los dedos está desactivado.
- Ajuste de viewport: content="width=device-width, initial-scale=1, user-scalable=no"
- user-scalable está en no, lo que bloquea el zoom con los dedos en muchos celulares.
Muchas personas con baja visión pellizcan la pantalla del celular para agrandar el texto y poder leerlo. El código de la página puede desactivar eso, y el zoom bloqueado es una de las quejas de accesibilidad más comunes porque los visitantes lo notan de inmediato. El estándar pide que el texto se pueda agrandar por lo menos al doble. Corresponde a la regla 1.4.4 de WCAG 2.1 (Cambio de tamaño del texto).
Nada altera el orden natural del teclado.
- No se encontraron elementos con un valor de tabindex positivo.
Las personas que no pueden usar un mouse presionan Tab para moverse por la página, y esperan que el orden siga el diseño. Un valor de tabindex positivo obliga a un elemento a meterse en la fila antes que los demás, lo que revuelve ese orden de formas muy difíciles de predecir. Corresponde a la regla 2.4.3 de WCAG 2.1 (Orden del foco).
Tu sitio es seguro, y la dirección no segura manda a los visitantes hacia él.
- La solicitud por HTTPS funcionó (HTTP 200).
- http:// redirigió a https:// con el código 301.
Es el candadito que tus visitantes ven en el navegador. Una conexión segura protege a todos, y a quienes usan tecnología de asistencia les pegan más fuerte las advertencias de seguridad del navegador, que con un lector de pantalla pueden ser confusas o imposibles de pasar. Tu sitio también debe mandar a quien escriba la dirección vieja con http:// a la versión segura. Un certificado vencido, autofirmado o emitido para otro dominio no pasa esta revisión aunque la página cargue bien, porque a cada visitante lo detiene primero una pantalla de advertencia.
Contenido y formularios
30 de 50 puntos
La mayoría de las imágenes tiene descripción, pero algunas necesitan atención.
- 14 imágenes: 10 con texto alt descriptivo, 1 marcada como decorativa (alt=""), 1 con un texto alt de relleno, 2 sin ningún atributo alt.
- Entre las imágenes sin texto alt están: hero-banner.jpg, IMG_2041.jpg.
- Se encontró texto alt de relleno: "image".
El texto alt es una descripción corta escrita que acompaña a cada imagen. Así es como el lector de pantalla de una persona ciega sabe qué muestra una foto; sin él, puede escuchar el nombre del archivo o nada. La falta de texto alt es el hallazgo más común en las quejas y las cartas de reclamación por accesibilidad. Corresponde a la regla 1.1.1 de WCAG 2.1 (Contenido no textual).
Algunos enlaces o botones no tienen un nombre que un lector de pantalla pueda anunciar.
- Se revisaron 42 enlaces y botones: 3 sin ningún nombre, 2 con texto genérico.
- Sin nombre: <a href="https://facebook.com/examplebakery"> sin texto y sin etiqueta; <a href="https://instagram.com/examplebakery"> sin texto y sin etiqueta; <button> sin texto y sin etiqueta.
- Texto de enlace genérico: "read more", "click here".
Un lector de pantalla puede hacer una lista de todos los enlaces de una página para que la persona escoja uno. Esa lista no sirve de nada si los enlaces son íconos sin nombre o todos dicen "haz clic aquí": la persona escucha una serie de espacios en blanco y no tiene idea a dónde lleva cada uno. Corresponde a las reglas 2.4.4 (Propósito de los enlaces) y 4.1.2 (Nombre, función, valor) de WCAG 2.1.
Algunos campos usan texto de ejemplo en lugar de una etiqueta de verdad.
- 3 campos de formulario: 1 con etiqueta correcta, 2 solo con texto de ejemplo (placeholder), 0 sin ninguna etiqueta.
- Entre los campos que solo tienen placeholder están: placeholder "Your email", placeholder "Your message".
Cuando un lector de pantalla llega a un campo de un formulario, anuncia su etiqueta para que la persona sepa qué escribir. Un campo sin etiqueta se anuncia solo como "editar texto", y ahí se acaba el camino. El texto de ejemplo dentro del campo (placeholder) no la sustituye: desaparece en cuanto alguien empieza a escribir. Corresponde a las reglas 1.3.1, 3.3.2 (Etiquetas o instrucciones) y 4.1.2 de WCAG 2.1.
No se encontraron problemas de ARIA.
- 18 elementos usan atributos ARIA y ninguno mostró los problemas que busca esta revisión.
Los atributos ARIA son pistas extra en el código de la página, escritas especialmente para los lectores de pantalla. Bien usados, hacen que los menús y los componentes personalizados se entiendan. Mal usados, confunden: un rol mal escrito se ignora, una etiqueta que apunta a un elemento que no existe no anuncia nada, y esconder de los lectores de pantalla un botón que recibe el foco deja a quien usa teclado parado en algo que para su lector no existe. Corresponde a las reglas 4.1.2 y 1.3.1 de WCAG 2.1.
Algunos marcos incrustados no tienen nombre.
- 2 marcos incrustados: 1 con título, 1 sin título.
- Los marcos sin título cargan desde: https://www.google.com/maps/embed?pb=...
Los mapas, videos, sistemas de reservación y formularios de pago muchas veces vienen de otros servicios dentro de un marco (iframe). Un lector de pantalla anuncia cada marco por su título. Sin título, la persona solo escucha "marco" y tiene que adivinar si vale la pena entrar, lo que importa más cuando ese marco es donde tus clientes reservan o pagan. Corresponde a la regla 4.1.2 de WCAG 2.1.
No se encontraron tablas de datos en la página.
- Se encontraron 0 tablas de datos. No hay nada que revisar.
Cuando una tabla tiene celdas de encabezado bien hechas, un lector de pantalla puede anunciar a qué columna y fila pertenece cada dato mientras la persona se mueve por ella, como en una hoja de cálculo. Sin encabezados, la persona escucha números sueltos sin contexto, y los precios, horarios y comparaciones pierden sentido. Corresponde a la regla 1.3.1 de WCAG 2.1.
Nada se reproduce ni se mueve sin que la persona lo pida.
- Se encontró 1 elemento de audio o video, ninguno configurado para reproducirse solo.
Un sonido que empieza solo habla encima del lector de pantalla y hace imposible escuchar la página. El movimiento que no se puede pausar es una barrera para las personas con problemas de atención o del equilibrio, y a algunas les causa malestar físico ver la página. Corresponde a las reglas 1.4.2 (Control del audio) y 2.2.2 (Poner en pausa, detener, ocultar) de WCAG 2.1.
Extras opcionales
no suman puntos
Son extras opcionales y notas honestas sobre lo que una revisión automática no puede ver. Nunca cambian tu calificación. Tómalos como pistas para una revisión más completa, no como tarea.
No se encontró ningún enlace a una declaración de accesibilidad.
- Ningún enlace de la página de inicio menciona la accesibilidad. Es opcional y no afecta la calificación.
Una declaración de accesibilidad es una página donde cuentas lo que has hecho para que tu sitio lo puedan usar personas con discapacidad, y cómo contactarte si algo no funciona. La mayoría de los negocios no está obligada por ley a tenerla, pero demuestra buena fe, les da a tus visitantes una forma de reportarte problemas a ti en lugar de a un abogado, y muchas veces es lo primero que se revisa cuando se presenta una queja.
No se encontró ninguna regla de reducir movimiento en el HTML de la página.
- No aparece ninguna regla prefers-reduced-motion en los estilos dentro de la página. Puede estar en un archivo de estilos que esta revisión no descarga, así que esto es una observación, no un veredicto.
Los celulares y las computadoras tienen un ajuste del sistema con el que las personas a quienes las animaciones marean o distraen pueden pedirles a los sitios que se calmen. Algunos sitios lo respetan y la mayoría ni sabe que existe. Respetarlo es una cortesía, no un requisito que se califique aquí, porque esta revisión no puede ver todos los lugares donde viven tus estilos.
El contraste no se califica aquí porque se necesita un navegador para medirlo bien.
- Esta revisión solo lee el HTML de la página, así que no puede calcular los colores finales que ven tus visitantes.
- Esta fila es un recordatorio, no un hallazgo. Aparece en todos los reportes.
El texto necesita resaltar claramente sobre su fondo, o las personas con baja visión simplemente no lo pueden leer. La regla 1.4.3 de WCAG 2.1 (Contraste mínimo) fija proporciones de contraste exactas, y el bajo contraste es uno de los hallazgos más comunes en las demandas por accesibilidad. Medirlo bien requiere mostrar la página en un navegador real con todos sus estilos, y esta revisión a propósito no lo hace. Una revisión de accesibilidad lo puede medir como se debe.
Cada revisión termina de una de tres formas: bien gana todos los puntos, necesita atención gana la mitad, y hay que arreglarlo no gana ninguno. Las revisiones suman 100 puntos, y tu porcentaje es simplemente ese total. Las letras siguen el modelo escolar de Estados Unidos: A es 90 o más, B es de 80 a 89, C es de 70 a 79, D es de 60 a 69, y F es cualquier cosa por debajo.
Cada revisión corresponde a una regla de WCAG 2.1 nivel AA, el estándar de accesibilidad al que se refieren el Departamento de Justicia y la mayoría de los tribunales. La regla exacta aparece en la explicación de cada revisión.
Las revisiones y lo que vale cada una
| Revisión | Puntos |
|---|---|
| Estructura y navegación (50) | |
| El idioma de la página está declarado (atributo lang) | 6 |
| La página tiene un título descriptivo | 6 |
| Los títulos están organizados en orden | 8 |
| Las zonas de la página están marcadas para lectores de pantalla (landmarks) | 7 |
| Existe un enlace para "saltar al contenido" | 6 |
| Tus visitantes pueden hacer zoom en el celular | 8 |
| El orden del teclado no está alterado (tabindex positivo) | 4 |
| Conexión segura (HTTPS) | 5 |
| Contenido y formularios (50) | |
| Descripciones de texto para las imágenes (texto alt) | 10 |
| Los enlaces y botones dicen a dónde llevan | 9 |
| Los campos de los formularios tienen etiquetas | 9 |
| Las pistas para lectores de pantalla se usan bien (ARIA) | 7 |
| El contenido incrustado tiene nombre (títulos de iframe) | 5 |
| Las tablas de datos tienen encabezados | 4 |
| El audio y el video no se reproducen solos | 6 |
Los extras opcionales nunca te bajan puntos
La declaración de accesibilidad, el soporte para reducir movimiento y la nota sobre el contraste de color valen cero puntos a propósito. Son contexto para una revisión más completa, y no tenerlos no puede bajar tu calificación.
Lo que esta herramienta revisa en tu sitio
- Tu página de inicio, por la conexión segura
- Una solicitud a la dirección no segura, para ver si manda a los visitantes a la segura
Esa es toda la lista: dos solicitudes. Las solicitudes se identifican honestamente como AccessLensBot/1.0 (+site-review; contact hello@brenro.com), se rinden después de unos segundos y dejan de leer después de 2.5 MB. No se guarda nada: tu reporte existe solo en tu navegador.
Límites que conviene conocer
La herramienta lee el código de la página que manda tu servidor. No puede medir el contraste de color, ver cómo se mueve el foco del teclado ni escuchar un lector de pantalla, y revisa tu página de inicio, no todas tus páginas. Las revisiones automáticas como estas solo detectan una parte de los problemas de WCAG. Una buena calificación aquí es un buen comienzo, no la meta, y no es una certificación de cumplimiento legal.
Para leer más
ADA.gov: la regla de accesibilidad web explicada es la guía del gobierno en lenguaje sencillo (en inglés), y la referencia rápida de WCAG 2.1 (también en inglés) incluye todas las reglas a las que corresponden las revisiones de esta herramienta.
Por qué importa ahora
La accesibilidad de los sitios web pasó de ser una buena idea a ser una expectativa legal. Algunos datos, dichos sin rodeos:
- El Departamento de Justicia de Estados Unidos aprobó una regla que obliga a los sitios web de los gobiernos estatales y locales a cumplir el estándar de accesibilidad WCAG 2.1 AA, con fechas límite en abril de 2027 y abril de 2028 según el tamaño del gobierno.
- En el caso de los negocios privados, los tribunales han tratado una y otra vez a los sitios web como lugares abiertos al público bajo el Título III de la ADA, y cada año se presentan miles de demandas por accesibilidad de sitios web.
- En California, la Ley de Derechos Civiles Unruh fija un mínimo legal de $4,000 por infracción, más los honorarios de abogados, y por eso California tiene más de estas demandas que cualquier otro estado.
- Un proyecto de ley pendiente en California, el AB 1757, haría del cumplimiento con WCAG el estándar explícito para los sitios web que atienden a consumidores de California.
Nada de esto exige perfección hoy. Exige demostrar que ya empezaste. Las barreras que más se mencionan, como imágenes sin descripción y botones sin etiqueta, son justo lo que busca esta revisión.
Arréglalo una vez y mantente cubierto
La revisión de arriba es gratis y siempre lo será. Cuando estés listo para actuar, hay exactamente dos ofertas: una auditoría con arreglos de un solo pago, y un monitoreo continuo para mantenerte cubierto después. Las dos son para sitios web con hasta 30,000 visitas al mes.
- el más popular
Auditoría ADA + Arreglos
$750 un solo pago
Para sitios web con hasta 30,000 visitas al mes
Encontramos cada barrera, arreglamos las que importan y lo comprobamos.
- Auditoría completa de accesibilidad WCAG 2.1 AA, manual y automática
- Reporte de problemas por prioridad (críticos, moderados, recomendaciones)
- Corrección a mano de los problemas críticos: arreglos reales en el código, no un widget superpuesto
- Revisión de verificación después de los arreglos
- Declaración de accesibilidad para tu sitio web
Monitoreo de Cumplimiento
$150/mes
Para sitios web con hasta 30,000 visitas al mes
Sigue cumpliendo después de tus arreglos.
- Revisiones automáticas continuas de cumplimiento
- Reporte mensual de cumplimiento
- Arreglos de los problemas nuevos conforme cambia el contenido
- Avisos cuando aparecen problemas nuevos de WCAG
- Te mantiene cubierto conforme cambian los estándares (actualizaciones de WCAG, reglas del DOJ)
Aplicaciones web, sitios grandes y documentos que hay que arreglar
Hay trabajos que no caben en las dos ofertas de arriba. Si tienes una aplicación web o un sistema de reservaciones en lugar de un sitio de promoción, tienes más plantillas de página de las que la mayoría de los sitios tiene páginas, necesitas arreglar también PDFs y documentos, o recibes más de 30,000 visitas al mes, lo definimos en una llamada y te damos una cotización. Este tipo de trabajo empieza alrededor de $2,000 para arreglarlo y $400 al mes para monitorearlo. Si ya recibiste una carta de reclamación, dínoslo cuando te comuniques y lo trataremos como urgente.
Arreglos reales en el código hechos por personas, no un widget de accesibilidad superpuesto. Esos widgets no arreglan tu código y cada vez más aparecen en las demandas.