Auditor de Accesibilidad HTML

La mayoría de las comprobaciones rápidas de accesibilidad son o un barrido superficial de palabras clave o una biblioteca pesada en la que tienes que confiar como una caja negra. Esta herramienta toma un tercer camino: analiza el HTML que pegues usando DOMParser, el analizador nativo del navegador —sin axe-core, sin bibliotecas externas de accesibilidad, sin nada que descargar— y luego recorre el árbol DOM resultante con un conjunto de comprobaciones escritas a mano que reflejan patrones de fallo comunes y reales de las WCAG 2.1. Esto significa que la lógica es completamente inspeccionable y la auditoría se ejecuta por completo dentro de tu navegador: el marcado que pegues y cualquier par de colores que pruebes nunca se suben ni se envían a ningún sitio.

Las comprobaciones cubren los fallos que aparecen con más frecuencia en páginas reales: elementos <img> sin atributo alt (un fallo WCAG real, distinto del alt="" intencionadamente vacío para imágenes decorativas, que correctamente no se señala), controles de formulario sin forma de que la tecnología de apoyo sepa para qué sirven (comprobados a través de cada ruta real hacia una etiqueta: un <label for> coincidente, estar envuelto dentro de un <label> o un atributo aria-label/aria-labelledby), niveles de encabezado que saltan sin aviso (un <h1> directo a un <h3>, o un documento sin <h1> en absoluto, o con más de uno), enlaces sin href o con texto impreciso y fuera de contexto como «haz clic aquí» o «leer más», y la ausencia del atributo lang cuando se pega un documento HTML completo (no solo un fragmento).

El elemento destacado es el cálculo de contraste genuino y no una heurística superficial de «parece legible». Para cualquier elemento que tenga un color y un background-color en línea, la herramienta lee ambos valores, los resuelve a números RGB reales mediante el motor CSS del navegador (de modo que hex, rgb(), hsl() y colores con nombre como «tomato» funcionan de manera idéntica) y calcula la luminancia relativa WCAG exacta de cada uno — L = 0.2126×R + 0.7152×G + 0.0722×B, con cada canal corregido previamente con gamma usando la curva de transferencia sRGB real — antes de combinarlos en la fórmula oficial del ratio de contraste, (L más claro + 0.05) / (L más oscuro + 0.05). El font-size y font-weight propios del elemento determinan si se aplican los umbrales más estrictos de «texto normal» o los más indulgentes de «texto grande» (18pt+ o 14pt+ en negrita), y el resultado se comprueba de una vez frente a los cuatro valores WCAG reales: 4.5:1 y 3:1 para AA, 7:1 y 4.5:1 para AAA, sin colapsarlo nunca en un único veredicto falso de bueno/malo.

Esto es un subconjunto deliberadamente honesto y pragmático de una auditoría de accesibilidad completa, no una herramienta de certificación: no evalúa la interactividad controlada por JavaScript, los patrones de widgets ARIA más allá del etiquetado básico, el orden de foco del teclado ni nada que requiera renderizar y ejecutar la página de verdad. Trátalo como un primer vistazo rápido que detecta algunos de los fallos WCAG más comunes y de mayor impacto —texto alternativo ausente, campos sin etiquetar, jerarquía de encabezados rota, texto de bajo contraste y enlaces imprecisos— antes de que una página se publique, como complemento (y no en lugar) de una revisión manual completa o una herramienta de auditoría dedicada para todo aquello que vaya a producción.