Desarrollo y automatización

Foco y diálogos: conserva el contexto al editar dentro de una aplicación

Define dónde entra y regresa el foco en diálogos de edición, maneja errores sin perder contexto y prueba qué ocurre cuando desaparece el control de origen.

OVAN Studio4 min de lectura

En una aplicación de pedidos, editar una dirección abre un cuadro sobre la tabla. La persona guarda el cambio y el cuadro desaparece, pero el teclado queda situado en un lugar desconocido. Ahora necesita recorrer de nuevo la pantalla para encontrar la orden. Este problema exige diseñar el ciclo del foco: entrada al diálogo, trabajo dentro de él y regreso a la tarea. La solución depende del contenido y del resultado de la operación. No basta con hacer visible una ventana ni con agregar una etiqueta técnica que la describa como modal.

Decide qué debe recibir atención al abrir

Antes de implementar el diálogo, identifica su propósito y la información que debe entenderse antes de actuar. Una edición breve puede comenzar en un campo; una explicación extensa puede necesitar atención inicial en su título o introducción. El patrón modal de W3C contempla que la ubicación inicial del foco depende del contenido. Evita una regla automática que seleccione siempre el primer botón, especialmente cuando ese botón confirma una acción difícil de revertir. Escribe el resultado esperado para cada tipo de diálogo del sistema. Esa especificación permite revisar decisiones de interacción sin depender de cómo quedó ordenado accidentalmente el código.

Mantén coherencia mientras la ventana está activa

Una ventana modal exige que la interacción permanezca dentro de su contexto hasta cerrarla. El fondo debe comportarse de manera consistente con esa decisión, tanto para teclado como para otros mecanismos de acceso. W3C describe el recorrido interno con Tab y una salida mediante Escape y un control visible. Comprueba también situaciones propias de la aplicación: un campo que aparece después de elegir una opción, una ayuda expandida o una validación que impide guardar. El foco no debería saltar sin explicación porque terminó una consulta en segundo plano. Mantén los errores vinculados a la tarea y conserva los valores que puedan reutilizarse.

Planifica el regreso cuando cambia la pantalla

Cerrar no siempre significa volver exactamente al mismo elemento. Si el control que abrió la ventana sigue existiendo, suele ofrecer una referencia clara para continuar. Si la acción elimina una fila, ese destino ya no existe y necesitas otro punto lógico. Define la alternativa antes de que aparezca el caso: una fila vecina, el encabezado del listado o un control para crear otro registro, según el trabajo. Evita devolver el foco al inicio general por comodidad técnica. El resultado debe comunicar dónde quedó la persona y qué puede hacer después sin reconstruir mentalmente toda la operación.

Ensaya transiciones y respuestas tardías

Prueba abrir, cancelar, guardar con error y guardar correctamente. Incluye un guardado lento y el cierre permitido antes de recibir su respuesta: una respuesta tardía no debería robar el foco de la tarea actual. Si existen ventanas encadenadas, define cuál queda activa y a dónde vuelve la atención al cerrar cada nivel. Considera simplificar el recorrido cuando la acumulación de cuadros resulte difícil de seguir. Realiza estas pruebas con teclado y tecnologías de asistencia pertinentes, usando datos ficticios. Registra origen, destino esperado y resultado para cada transición; así las futuras correcciones pueden comprobarse sin repetir una auditoría general del sitio.

DE LA LECTURA A LA ACCIÓN

Para aplicar hoy

  • Elige el foco inicial según la información necesaria para actuar.
  • Define un destino de regreso incluso cuando desaparezca el control original.
  • Prueba errores, cierres y respuestas tardías como transiciones del mismo recorrido.

Fuentes y referencias

Documentación para profundizar. Los ejemplos de esta guía son didácticos.

TU PRÓXIMA ETAPA EMPIEZA AQUÍ

Hagamos algo
que importe.

Hablemos de tu idea
info@crea-link.com+506 8675 5212Desde Costa Rica. Para el mundo.