Botón sin nombre accesible
El elemento interactivo existe en el DOM, pero un lector de pantalla no recibe un nombre de acción claro.
button.product-card__favoriteComprobación de accesibilidad web WCAG AA
Encuentre barreras como botones poco claros, campos sin etiqueta y texto ilegible. Obtenga una revisión automática de accesibilidad con explicaciones.
Resultado de la comprobación
Un informe que se convierte directamente en tareas para el equipo
El informe identifica el elemento afectado en el DOM, el árbol de elementos del navegador, con un selector y un fragmento HTML. Localiza el componente, corrige el problema y vuelve a probar su funcionamiento con teclado y lector de pantalla.
infraccionescorrectorequiere revisiónetiquetas WCAG
accessibility-report3 problemas · 42 reglas superadas
El campo del formulario no está conectado a su etiqueta
El usuario puede ver la etiqueta, pero falta la relación técnica entre la etiqueta y el campo.
#checkout-emailEl contraste del texto está por debajo de WCAG AA
El estado del botón es visualmente débil y puede desaparecer sobre el fondo oscuro de la interfaz.
.promo-banner .btn-secondaryRevisar el impacto
Empieza por los problemas críticos y graves para eliminar rápidamente las barreras de acceso más visibles.
Compartir el selector
Envía al desarrollador el objetivo exacto, el fragmento HTML y el motivo breve de la infracción.
Volver a comprobar en el lanzamiento
Ejecuta la comprobación de nuevo tras las correcciones y observa qué infracciones desaparecieron del informe.
Qué comprobamos
Semántica, ARIA, formularios y contraste en una sola comprobación de accesibilidad
La comprobación automática de accesibilidad examina la interfaz renderizada para encontrar problemas detectables. Los hallazgos se relacionan con las reglas WCAG. Un informe sin errores no certifica el cumplimiento completo de WCAG AA.
Estructura de la página
Comprobamos el título del documento, el idioma de la página, la jerarquía de encabezados, las regiones de referencia, las listas y el texto alternativo de las imágenes.
Detalles para desarrolladores
- h1-h6 y regiones
- texto alternativo y SVG ocultos
- lang, title y semántica básica
ARIA y nombres accesibles
Los atributos ARIA describen el rol, el estado y las relaciones de un control para las herramientas de asistencia. Comprobamos relaciones incorrectas y controles sin nombres claros. Añadir ARIA por sí solo no hace accesible una interacción.
Detalles para desarrolladores
- nombre de botón, enlace, campo
- problemas de rol/estado/propiedad
- patrones de combobox, diálogo y menú
Formularios, errores y contraste
Revisamos etiquetas, estados obligatorio y no válido, relaciones con el texto de ayuda, contraste de texto y legibilidad de elementos importantes.
Detalles para desarrolladores
- etiqueta y texto de ayuda
- relación de contraste WCAG AA
- errores y mensajes en vivo
Preguntas frecuentes
Preguntas frecuentes sobre las comprobaciones de accesibilidad
Respuestas breves sobre WCAG, reglas automatizadas, nodos del DOM, ARIA, formularios, contraste y orden de corrección.
¿Qué detecta la comprobación automatizada?
Encuentra problemas que pueden detectarse a partir del HTML renderizado y los estilos: etiquetas faltantes, errores de ARIA, roles no válidos, problemas de contraste, enlaces y botones vacíos, texto alternativo, estructura de landmarks y parte del conjunto de reglas WCAG.
¿Qué significa WCAG AA para un sitio web?
WCAG AA es un nivel objetivo práctico de accesibilidad para la mayoría de las interfaces comerciales y públicas. Las reglas del informe están marcadas con etiquetas WCAG, para que puedas ver a qué requisito se refiere cada infracción.
¿Esto sustituye a una auditoría manual?
No. La comprobación cubre bien las infracciones técnicas en el DOM y el CSS, pero los escenarios complejos, el orden real de recorrido con teclado y el comportamiento de los lectores de pantalla deben confirmarse en una etapa manual aparte.
¿Puedo empezar con una sola página?
Sí. La primera pasada suele comprobar la página de inicio, el formulario de contacto, la tarjeta de producto, el proceso de pago o el área de cuenta. En sitios con plantillas, es útil comprobar una página de cada tipo y comparar las infracciones repetidas.
¿Qué debería corregirse primero si hay muchos errores?
Empieza por los problemas críticos y graves: elementos sin nombres accesibles, campos sin etiquetas, errores de ARIA, contraste insuficiente y elementos interactivos representados incorrectamente en el DOM. Los problemas moderados y menores pueden agruparse con cambios cercanos de diseño o maquetación.
Servicios relacionados
Qué comprobar después de este servicio
Comprobación de HTML
Detecta errores de HTML y estructuras de página demasiado complejas. El informe identifica los elementos afectados.
AbrirAuditoría de CSS
Encuentra hojas de estilo grandes, duplicados y estilos sin usar durante la carga. Esos estilos pueden ser necesarios en otras páginas o tras acciones del usuario.
AbrirAuditoría SEO
Comprueba hasta 5 páginas: SEO, metadatos y contenido disponible antes y después de JavaScript.
AbrirVelocidad de carga
Comprueba la carga con la configuración de dispositivo y red elegida. Obtén mediciones de velocidad, resultados y recomendaciones.
Abrir