Preparar el traspaso del diseño con estados y comportamiento
Entregue una especificación clara de la interfaz. Un ejemplo detallado de búsqueda de proyectos muestra textos, estados y comprobaciones.
El traspaso del diseño debe indicar al desarrollo qué interfaz construir y cómo se comporta en el flujo acordado. Elija una tarea concreta. La siguiente plantilla describe una búsqueda de proyectos en un portal de clientes ficticio; es un plan, no una interfaz ya implementada.
Registrar la tarea y la versión del diseño
En el ejemplo, la persona introduce «Portal» e inicia la búsqueda. El portal carga proyectos coincidentes cubiertos por sus permisos actuales. El diseño no modifica esos permisos. Registre qué archivo fuente y qué versión aprobada son válidos. Identifique los componentes por versión; una imagen exportada antigua no debe convertirse inadvertidamente en la plantilla de implementación.
Relacionar los estados con textos y uso
Estado en la especificación de ejemplo | Respuesta prevista | Comportamiento acordado |
|---|---|---|
Puede iniciarse la búsqueda | Campo «Buscar proyectos», acción «Buscar» | El término introducido sigue visible; la acción inicia la carga. |
Búsqueda en curso | «Cargando proyectos.» | Se reconoce la búsqueda en curso; los resultados anteriores no se presentan como coincidencias nuevas. |
Búsqueda terminada con coincidencias | «2 proyectos encontrados.» con enlaces «Renovación del portal» y «Ayuda del portal» | Se puede acceder a los proyectos coincidentes; se conserva el término. |
Búsqueda terminada sin coincidencias | «No se han encontrado proyectos para esta búsqueda.» | Se conserva el término y puede cambiarse. No es un error de conexión. |
Error al recuperar los datos | «No se ha podido cargar la lista de proyectos. Vuelva a intentarlo.» | Se conserva el término; es posible repetir la búsqueda. El error no se presenta como una lista vacía. |
Los dos nombres de proyectos son coincidencias supuestas para el ejemplo. Aclare también qué ocurre si empieza una búsqueda nueva mientras sigue pendiente una respuesta anterior. Solo los resultados del término actual deben aparecer como estado vigente.
Entregar la denominación técnica y las respuestas
El W3C recomienda etiquetas visibles adecuadas y nombres accesibles comprobados. Relacione claramente campo, acción y nombre previsto en el diseño. Los mensajes de estado pueden informar a las tecnologías de apoyo sin recibir el foco. La propia lista de resultados es distinta de su breve mensaje de estado.
Acuerde dónde queda el foco tras buscar y cómo llegar a los resultados con el teclado. Transmita como pendientes las preguntas abiertas; la falta de un diseño no autoriza cualquier comportamiento.
Validar con la misma tarea
En la versión implementada, compruebe búsqueda, resultado vacío y recuperación fallida con datos de prueba adecuados. Revise traducciones largas, recorrido con teclado y respuestas con la tecnología de apoyo prevista. Compare el resultado con la versión acordada. Incorpore las reglas corregidas a la documentación compartida para que los cambios posteriores partan de la misma base.
Fuentes
Seguir leyendo
Todos los artículos
Su proyecto con ASES
Descríbanos su proyecto. Le responderemos con una primera valoración.