Recursos · 57
Diálogos y teclados: prueba el viaje de enfoque
Comprobar apertura, movimiento, cierre y restauración de contexto en interfaces que interrumpen una tarea.
Actualizado · 3 min
Lo que esta guía ayuda a lograr
- Elige el componente adecuado
- Colocar enfoque comprensible
- Permitir cierre
- Restaurar contexto
Comprobación rápida
- ¿Es necesario un modal?
- ¿Dónde aterriza el foco de apertura?
- ¿El fondo realmente es inerte?
- ¿Se puede cerrar el diálogo mediante el teclado?
- ¿Dónde vuelve el foco si el disparador desaparece?
Método paso a paso
- 1
Elige la interrupción
Decidir si la información necesita un modal o puede permanecer en la página. Diálogos, paneles y menús modales separados. Prefiera elementos nativos apropiados y verifique el comportamiento; un rol ARIA no crea interacciones automáticamente.
Entregable: elección y justificación del componente.
- 2
Nombre y apertura
Conectar un nombre accesible a un encabezado visible. Coloca el foco de forma adecuada: al inicio de un contenido estructurado, un campo útil o una acción segura según la tarea. La apertura no debe desplazar el principio fuera de la vista.
Entregable: apertura probada.
- 3
Navegar por teclado
Bajo el patrón de diálogo modal del W3C, Tab y Shift+Tab permanecen dentro y el contenido exterior es inerte. Verifique el enfoque visible, el orden lógico y que no haya trampas en los controles anidados.
Entregable: navegación hacia adelante y hacia atrás.
- 4
Cerrar y restaurar
Proporciona cierre visible y comportamiento de Escape esperado. Devuelva el foco al desencadenante o a un paso lógico si el desencadenante ya no existe. Después del envío, los usuarios deben encontrar qué cambió y qué puede suceder a continuación.
Entregable: restablecimiento del enfoque y contexto.
- 5
Errores de prueba y espacio
Incluye mensajes largos, campos no válidos, teclados de móviles y zoom. El desplazamiento no debe ocultar permanentemente acciones o títulos. Los errores deben ser comprensibles y accesibles sin perder los valores ingresados.
Entregable: casos extremos de pantalla estrecha.
- 6
Consultar en la página
Pruebe el componente integrado con teclado y tecnología de asistencia, no solo en una demostración aislada. Verifique la apertura duplicada y enfóquese después de un cierre repetido. La aceptación local por sí sola no establece la certificación WCAG.
Entregable: registro de aceptación y límites conocidos.
Hoja de cálculo reutilizable
Complete con sus observaciones autorizadas. Estos campos son una plantilla de trabajo, no resultados observados.
| Campo | Información a registrar |
|---|---|
| Apertura | Gatillo, rumbo y foco inicial |
| Viaje | Tab, Shift+Tab, fondo inerte y foco visible |
| Cierre | Escape, botón y retorno lógico |
| Límites | Zoom probado, contenido extenso, errores y asistencia |
Ejemplo trabajado ficticio
Situación ilustrativa
Ejemplo ficticio: un diálogo confirma la eliminación de una fila y su botón de apertura desaparece.
Decisión y pruebas esperadas
Después de la confirmación, el foco vuelve al siguiente elemento lógico o al encabezado de la lista, con un resultado anunciado y un siguiente paso visible.
Distinguir los mecanismos
| Mecanismo | Propósito | Verificación o limitación |
|---|---|---|
| Diálogo modal | Interrupción para una tarea acotada | Fondo inerte y enfoque contenido |
| Panel no modal | Mantener el contexto disponible | Movimiento de enfoque coherente |
| Sección de página | Presentar información continua | Muchas veces es más fácil de consultar |
Indicadores de gestión
| Indicador | Qué mide | Primera acción |
|---|---|---|
| Recorridos de teclado completados | Tareas realizadas sin puntero | Arreglar bloqueadores |
| Vuelve el enfoque correcto | Cierres restaurando contexto útil | Manejar disparadores faltantes |
| Estados de borde probados | Zoom, errores y contenidos largos | Omisiones de documentos |
Errores comunes
- Agregando aria-modal sin contenido inerte
- Perdiendo el foco tras el cierre
- Bloqueo de Escape sin salida clara
- Probando solo apertura del mouse
Preguntas frecuentes
¿Es suficiente un diálogo nativo?
Proporciona un comportamiento útil, pero aún es necesario probar la denominación, el enfoque inicial, el contenido, los errores y la integración.
¿Debería recibir foco el primer botón?
No siempre. El punto adecuado depende del contenido y de la tarea, especialmente en el caso de decisiones irreversibles.
¿La automatización puede validar el viaje?
Detecta algunos defectos, pero la comprensión, el orden útil y el contexto restaurado necesitan aceptación manual.
Referencias oficiales
Las referencias respaldan el método. Adapte los controles a su contexto; no constituyen certificación. Los títulos de referencia originales y los documentos fuente pueden estar en otro idioma.
Referencias consultadas el .
