WebAbility

Encuentra y corrige problemas de accesibilidad web (WCAG 2.2, ADA, Section 508, EAA, AODA) desde tu agente de codificación: escanea cualquier URL/HTML con 3 motores, correcciones conscientes del framework, verificación, auditoría visual e informes listos para auditores.

GitHubPrueba este MCPPatrocinado

Documentación

@webability/mcp

Servidor MCP de pruebas de accesibilidad para Cursor, VS Code Copilot, Claude Code y cualquier otro IDE compatible con MCP.

¿Qué es WebAbility?

WebAbility.io es una plataforma de accesibilidad web impulsada por IA: widget de accesibilidad, escáner automatizado y agentes de IA para el cumplimiento de WCAG 2.1 / 2.2 AA, ADA, Sección 508, EAA (Ley Europea de Accesibilidad) y AODA. Este MCP expone el mismo motor de pruebas de accesibilidad que impulsa el widget de WebAbility y el panel de control, para que puedas escanear, auditar y corregir problemas de accesibilidad web (contraste de color, ARIA, texto alternativo, navegación por teclado, visibilidad del foco, tamaño de los objetivos, y más) desde tu IDE mientras desarrollas.

¿Nuevo en el cumplimiento de accesibilidad? Comienza con el comprobador gratuito de accesibilidad WCAG y ADA, o lee la documentación del MCP de WebAbility y la guía de inicio.

El servidor registra un bloque instructions al inicializarse, de modo que cualquier cliente compatible con MCP recoge el contexto de negocio (qué herramienta llamar y cuándo, la convención de salida de tres niveles, etc.) automáticamente, sin configuración adicional más allá de la instalación que se indica abajo.

Por qué este y no otros MCP de accesibilidad

La mayoría de los servidores MCP de accesibilidad se limitan a detectar y sugerir. WebAbility cierra todo el ciclo en tu editor y empieza siendo gratuito:

  • Escaneo local gratuito: sin cuenta, sin Docker. scan_page se ejecuta completamente en tu máquina. (El MCP de axe de Deque requiere una suscripción de pago, una clave de API y una instalación de Docker solo para analizar una página).
  • Correcciones que se adaptan a tu stack. generate_ai_fix devuelve código listo para pegar en el framework que realmente usas (Tailwind, MUI, Bootstrap, WordPress, Next.js), no orientación genérica.
  • Una pasada visual que los escáneres de DOM no pueden hacer. visual_audit detecta visibilidad del foco, contraste de iconos y elementos que "parecen un botón pero no lo son": problemas que axe-core estructuralmente no puede ver.
  • Verificación, no solo detección. verify_fix vuelve a comprobar que tu corrección realmente se aplicó y devuelve verified: true/false. Toda comparación de MCP de accesibilidad de 2026 señala esta como la mayor carencia de la categoría: la mayoría de las herramientas nunca la cierran.
  • Evidencia para el cumplimiento. start_audit genera un informe persistente con marca de tiempo y un libro de Excel que puedes entregar a un auditor, no un resultado que desaparece con tu sesión.

El ciclo completo, sin salir del editor: scan_page → generate_ai_fix → verify_fix, y luego start_audit cuando necesitas el rastro documental.

Instalación

npm install -g @webability/mcp

Configuración

Añade a la configuración MCP de tu IDE:

{
  "mcpServers": {
    "webability": {
      "command": "webability-mcp"
    }
  }
}

Variable de entorno opcional: WEBABILITY_API_URL (por defecto https://api.webability.io) para backends autoalojados.

Motores de escaneo

scan_page ejecuta tres motores en paralelo y deduplica los resultados:

MotorReglasQué cubre
Detectores de WebAbility60+Contraste con degradados, nombres débiles, iconos decorativos, jerarquía de landmarks, corrección de ARIA, consistencia de enlaces, tamaño de objetivos, trampas de teclado
axe-core104Base estándar del sector WCAG 2.2
HTML_CodeSniffer200+Referencia cruzada de técnicas de la Sección 508 y WCAG

Salida de tres niveles (desde v1.2.1)

Cada escaneo devuelve:

  • issues — violaciones de alta confianza, seguras de reportar como errores
  • incomplete — hallazgos que requieren revisión humana (contraste sobre degradados, imágenes de marketing, estados previos a la animación de framer-motion, axe-incomplete). Nunca corregir estos automáticamente.
  • summary — recuentos por severidad + un recuento de incomplete

Esto refleja la división violations / incomplete / passes de axe-core y evita que los agentes "corrijan" falsos positivos de formas destructivas.

Herramientas

HerramientaQué hace
scan_pageEscanea una URL en busca de problemas de accesibilidad WCAG (3 motores)
flow_scanEscaneo de recorrido multipágina con problemas deduplicados entre páginas
scan_htmlEscanea un fragmento de HTML sin procesar (no se necesita URL)
detect_frameworkDetecta Tailwind / MUI / Bootstrap / Next.js / WP / CSS plano
generate_ai_fixAlternativas de corrección según el framework. Extrae automáticamente la paleta de marca de la URL en vivo en problemas de contraste.
verify_fixVuelve a escanear un elemento corregido y confirma que la violación ha desaparecido — verified: true/false. Cierra el ciclo detectar → corregir → verificar.
visual_auditAuditoría a nivel de píxel mediante visión (contraste de iconos, visibilidad del foco, parece-un-botón-pero-no-lo-es)
start_auditInicia el entregable completo de auditoría del lado del servidor (informe + libro de Excel). Devuelve un id para consultar. Requiere una cuenta.
get_auditComprueba el progreso de una auditoría y, cuando esté completa, obtiene el resumen de severidad y las URL de descarga del informe/libro.
check_color_contrastComprobación de contraste WCAG en un par de colores; pasa url para obtener sugerencias alineadas con la marca desde la página en vivo
check_ariaValida atributos ARIA en un fragmento de HTML
get_rulesLista las reglas de axe-core con filtro opcional por etiqueta WCAG
find_sourceMapea un selector CSS de vuelta a los archivos fuente locales

Cuándo usar este MCP

  • Cuando construyes un componente nuevo y quieres que sea accesible desde el primer día
  • Cuando auditas una compilación de localhost / staging antes de publicar
  • Cuando clasificas un informe de Lighthouse / axe — scan_page consolida los tres motores
  • Cuando generas sugerencias de corrección que coinciden con el framework que ya usas
  • Cuando compruebas el contraste de color contra la paleta de marca real del usuario (no sugerencias genéricas)

Ejemplos

En Cursor / Claude Code:

"Escanea localhost:3000 en busca de problemas de accesibilidad"

"Recorre login → dashboard → checkout e informa de los problemas únicos en todo el flujo"

"Sugiere una corrección para el problema de contraste en .btn-primary en https://example.com — que coincida con sus colores de marca"

"¿Qué comprueba WCAG 1.4.11?"

Privacidad, registros de escaneo y telemetría

Cada escaneo se registra localmente en ~/.webability/scans/ — un registro index.jsonl de una línea por escaneo más el resultado completo de tus últimos 500 escaneos. Explóralos con la herramienta scan_history ("¿qué escaneamos antes?") o con jq normal. Establece WEBABILITY_SCAN_LOG=off para desactivarlo, WEBABILITY_SCAN_LOG_DIR para reubicarlo.

El servidor también envía un pequeño evento de telemetría por cada llamada a herramienta (todas las herramientas, no solo los escaneos) a la API de WebAbility: nombre de la herramienta, una etiqueta corta del objetivo (URL, selector, tipo de problema — nunca el contenido de la página), aprobado/fallido, duración, recuentos de problemas y un ID de instalación anónimo persistente. Los resultados completos de los escaneos, el HTML y el código de corrección generado nunca salen de tu máquina mediante telemetría. Establece WEBABILITY_SCAN_TELEMETRY=off para excluirte.

Dos herramientas — generate_ai_fix y visual_audit — además envían contenido de página (un fragmento de HTML o una captura de pantalla) a la API de WebAbility para que esta pueda llamar a un LLM de terceros en tu nombre; WebAbility no almacena ese contenido, pero el proveedor del LLM lo ve en tránsito. Consulta PRIVACY.md para el desglose completo por herramienta y la política de privacidad de WebAbility.

Más información

Plataforma y documentación de WebAbility

Guías de cumplimiento de accesibilidad

Accesibilidad por sector

Instala el widget en tu stack

Paquete

Palabras clave: accesibilidad web, pruebas de accesibilidad, WCAG 2.2 AA, cumplimiento de ADA, Sección 508, EAA, AODA, a11y, escáner de accesibilidad, comprobador de contraste de color, validación de ARIA, texto alternativo, navegación por teclado, lector de pantalla, servidor MCP, accesibilidad para agentes de codificación con IA.

Licencia

MIT © WebAbility.io