Elysia Tools
Navegación
Workflow Playbook
Revisa la estructura, el orden de lectura, el contraste de capturas y los riesgos de visión cromática de una página o componente, y convierte los hallazgos automáticos en un registro revisado por una persona.
Temas
Una auditoría antes de publicar empieza con un estado reproducible, no con una visita casual. Registra la URL o el fixture, el identificador del build, el viewport, la autenticación y estados como menús, diálogos, errores de validación y resultados vacíos. Las capturas permiten comparar hallazgos visuales, pero no sustituyen el HTML ni el comportamiento que las genera.
Ejecuta primero la comprobación estructural para reunir problemas de etiquetas, texto alternativo, títulos y regiones. Después revisa la secuencia simulada y compárala con la tarea que debe completar una persona. La herramienta puede señalar un orden sospechoso; la persona debe decidir si es comprensible y probar también teclado y la tecnología de apoyo adecuada.
Usa comprobaciones de pares para valores de primer plano y fondo conocidos, comprobaciones de paleta para tokens reutilizables y la heatmap para regiones que no se pueden enumerar fácilmente. Las simulaciones de visión cromática ayudan a descubrir estados comunicados solo por el tono. Conserva los valores y capturas reales y añade texto, iconos, patrones o etiquetas cuando hagan falta señales que no dependan del color.
El informe debe permitir rastrear cada observación automática hasta una ubicación y guardar la repetición. La revisión humana cubre además teclado, foco visible, zoom, reflujo, significado y excepciones. Cierra con corregir, repetir, aplazar o bloquear. Este flujo organiza evidencia; no certifica cumplimiento legal ni garantiza una experiencia sin problemas para todas las personas.
Guía de flujo de trabajo
Renderiza la página en los viewports y estados acordados y guarda las capturas con el identificador del build. Incluye menús, diálogos, errores y otros estados que puedan cambiar el foco, el texto o el contraste; no audites solo la vista inicial.
Entrega la URL, el HTML o la imagen de diseño representativa al comprobador de accesibilidad. Clasifica problemas de etiquetas, texto alternativo, títulos y regiones, y conserva la entrada y la ubicación exacta de cada hallazgo para comparar después.
Pasa la misma página o marcado por el simulador de lector de pantalla para revisar la secuencia de títulos, regiones, controles, etiquetas y mensajes de estado. Compárala con la tarea prevista y marca lo que requiere un lector real o una prueba de teclado.
Usa la heatmap de la captura para localizar regiones débiles, comprueba pares o tokens importantes con las herramientas de contraste y ejecuta simulaciones de visión cromática para detectar estados o controles que se vuelven indistinguibles. Las simulaciones son señales de riesgo, no un veredicto final.
Usa el comprobador de accesibilidad para hallazgos de URL o marcado, Website Screenshot cuando necesites comparar el diseño por viewport y conserva ambas evidencias si el renderizado del cliente cambia la interfaz entregada.
Trata el resultado del comprobador como una lista automática y usa la simulación de lector de pantalla para revisar títulos, regiones, nombres y mensajes de estado. Una persona debe confirmar si la secuencia sirve para la tarea real.
Elige un verificador de contraste para un par conocido, un verificador de paleta para tokens del sistema y la heatmap junto con las herramientas de visión cromática para regiones de una captura y riesgos de confusión. Ninguno demuestra por sí solo la conformidad de toda la interfaz.
Comprueba la paleta y los tokens cuando la página depende de un sistema de diseño, extrae colores de imágenes clave si hace falta y genera un informe agrupado por severidad. La persona revisora verifica teclado, foco visible, zoom y reflujo, significado del contenido y excepciones antes de decidir corregir, repetir, aplazar o bloquear.