Addaw, ir a inicio Donar

Lección 4 de 10 · 11 min de lectura · Revisado el 26/10/2026

axe DevTools, WAVE, Lighthouse, IBM Equal Access, validador HTML y analizadores de contraste

No existe «la mejor herramienta»: cada una tiene un motor, un modelo de resultados y una forma de presentar los problemas que la hace útil para una tarea distinta. Un auditor profesional usa al menos dos de distinto motor y sabe qué esperar de cada una. Esta lección recorre las más usadas en auditoría web, con sus puntos fuertes, sus límites y cómo citarlas en un informe.

axe DevTools y axe-core

axe-core (Deque) es la biblioteca de reglas de código abierto más extendida; está detrás de la extensión axe DevTools, de Lighthouse, de Accessibility Insights (Microsoft) y de muchos integradores de pruebas. Clasifica cada regla por impacto (critical, serious, moderate, minor) y la etiqueta con el criterio WCAG (wcag2a, wcag2aa, wcag21aa, wcag22aa) o como best-practice. Devuelve cuatro listas: violations (fallos seguros), passes, incomplete (necesita revisión manual) e inapplicable.

Puntos fuertes: pocos falsos positivos por diseño (prefiere no marcar a marcar mal), selectores CSS exactos del elemento, explicación de la regla con enlace a documentación, y la posibilidad de analizar solo una parte de la página o un estado concreto (menú abierto, modal). La versión gratuita de la extensión cubre la comprobación automática; las guiadas (Intelligent Guided Tests) son de pago.

Al informar, cita el identificador de la regla (por ejemplo color-contrast, label, button-name, aria-allowed-attr) y traduce siempre a criterio WCAG. Recuerda que las reglas best-practice (region, landmark-one-main, page-has-heading-one) no son fallos WCAG: puedes recomendarlas, pero no como incumplimiento.

WAVE

WAVE (WebAIM) superpone iconos sobre la página: errores (rojo), errores de contraste, alertas (amarillo), características (verde), elementos estructurales y ARIA. Es la herramienta más didáctica para enseñar a un cliente qué pasa en su página, porque muestra el problema en su sitio. Su panel «Order» muestra el orden de tabulación y «Structure» la jerarquía de encabezados y landmarks, muy útiles en la revisión manual.

Sus límites: las «alertas» son muy numerosas y mezclan problemas reales con avisos de posible problema (texto de enlace redundante, enlace que abre nueva ventana, texto pequeño); no hay que trasladarlas al informe sin revisarlas. WAVE no analiza contenido que exige interacción, y su motor es distinto del de axe, así que los resultados no coinciden. Tiene extensión de navegador (analiza páginas con sesión iniciada) y una versión en línea limitada a páginas públicas.

Lighthouse

Lighthouse viene integrado en Chrome DevTools y usa un subconjunto de reglas de axe-core para generar una puntuación de 0 a 100 ponderada por impacto. Es útil para dar una cifra rápida a un gestor y para medir regresiones entre versiones, y es muy cómodo en integración continua (Lighthouse CI).

Su mayor riesgo es precisamente la puntuación: un 100 significa que ninguna de las reglas automáticas de su subconjunto ha fallado, no que la página sea accesible. Lighthouse lo advierte en su propio informe, con una sección de «comprobaciones manuales adicionales», pero el número se difunde solo. Usa Lighthouse para tendencias, nunca como veredicto.

Punto clave

Un 100 en Lighthouse o «0 errores» en WAVE describen la ausencia de ciertos fallos detectables, no la presencia de accesibilidad. En el informe, presenta los resultados automáticos como «indicadores», y el veredicto por criterio como resultado de la evaluación manual.

IBM Equal Access Accessibility Checker

La extensión de IBM Equal Access usa un motor propio (accessibility-checker-engine, código abierto) con un conjunto de reglas distinto del de axe y con una implementación amplia de las reglas ACT. Clasifica los resultados en «violaciones», «necesita revisión» y «recomendaciones», y permite elegir el conjunto de reglas de referencia (por ejemplo, WCAG 2.1 o WCAG 2.2 AA; comprueba qué opciones ofrece tu versión). Su panel de árbol de accesibilidad y su comprobación de patrones ARIA son especialmente completos. Al tener un motor diferente, es un buen contraste frente a axe: si ambas marcan lo mismo, es casi seguro; si discrepan, hay algo que mirar a mano.

El validador HTML del W3C

El Nu HTML Checker comprueba la validez del marcado. En WCAG 2.2 el criterio 4.1.1 Procesamiento se ha eliminado (y en 2.0 y 2.1 una nota de 2023 lo da por satisfecho siempre en contenido HTML o XML), así que un error de validación ya no es, por sí mismo, un fallo WCAG. Sigue siendo una herramienta útil porque muchos errores de validación son síntomas de problemas reales en otros criterios: id duplicados que rompen la asociación de label (1.3.1, 4.1.2), atributos ARIA no permitidos en un elemento (4.1.2), tablas mal anidadas (1.3.1), elementos interactivos dentro de otros (<a> dentro de <button>). El validador debe usarse para encontrar esas pistas, y el informe debe citar el criterio afectado, no «HTML inválido».

Analizadores de contraste

Para 1.4.3, 1.4.6 y 1.4.11 hacen falta medidas precisas. Herramientas habituales:

  • Colour Contrast Analyser (CCA, TPGi): aplicación de escritorio con cuentagotas; mide cualquier píxel de la pantalla, incluidos degradados, imágenes y estados de foco que las extensiones no alcanzan.
  • WebAIM Contrast Checker: en línea, para calcular a partir de dos valores hexadecimales y documentar la ratio.
  • Inspector de Chrome y Firefox: el selector de color del panel de estilos muestra la ratio y las líneas de 4,5:1 y 3:1.

Las ratios se calculan con la fórmula de luminancia relativa de WCAG 2.x. Algunas herramientas ofrecen también el algoritmo APCA, propuesto en su momento para WCAG 3.0: es informativo, pero no sirve para declarar conformidad con WCAG 2.2. Para texto sobre imagen o degradado, mide en el punto de menor contraste y documenta los dos colores medidos.

Ejemplo

Hallazgo: texto del botón «Enviar» en #FFFFFF sobre fondo #4FA3F7, ratio 2,6:1 medida con CCA, tamaño 16 px regular; incumple 1.4.3 Contraste (mínimo), que exige 4,5:1. Además, el borde del campo de texto #DDDDDD sobre #FFFFFF da 1,4:1 y es la única indicación visual del campo; incumple 1.4.11 Contraste no textual (3:1). axe lo marca como color-contrast solo en el primer caso; el segundo salió de la revisión manual.

Error frecuente

Medir el contraste del texto en estado normal y olvidar los estados: enlace visitado, botón deshabilitado (exento), botón con foco, texto de placeholder (que no está exento), mensaje de error en rojo claro. Los estados forman parte de la página y se miden igual.

Cómo elegir y combinar

Una combinación eficaz para auditoría: axe DevTools como herramienta principal por su baja tasa de falsos positivos; IBM Equal Access como segunda opinión de motor distinto; WAVE para visualizar estructura, orden y para explicar al cliente; validador Nu para pistas de estructura; CCA para medir. Lighthouse queda para integración continua y tendencias. Anota en el informe las versiones exactas (la de axe-core cambia reglas entre versiones) y la fecha de ejecución. Las herramientas asistidas que completan este equipo se ven en la lección siguiente, y cómo elegir, configurar y documentar cada ejecución, en la última lección teórica del curso.

Resumen

  • axe DevTools: motor más extendido, pocos falsos positivos, cuatro estados de resultado; distingue reglas WCAG de buenas prácticas.
  • WAVE: visual y didáctica, con paneles de orden y estructura; sus alertas requieren revisión antes de informar.
  • Lighthouse: puntuación útil para tendencias e integración continua, nunca como veredicto de conformidad.
  • IBM Equal Access: motor distinto con buena implementación ACT, ideal como segunda opinión.
  • El validador HTML da pistas de 1.3.1 y 4.1.2 (4.1.1 ya no existe en 2.2); los analizadores de contraste miden con la fórmula WCAG 2.x, no con APCA.

Comprueba lo que has aprendido

Esta lección se puede leer libremente. Para hacer su test de 3 preguntas, los ejercicios prácticos con páginas reales, guardar tu avance y optar al examen y al certificado, matricúlate en el curso.

Matricularme · nivel 4 (49 €)