Técnica Técnicas generales WCAG 2.2
G210Permitir cancelar o deshacer una acción de arrastrar y soltar
Nombre oficial en el W3C: Garantizar que las acciones de arrastrar y soltar puedan cancelarse
En pocas palabras
Cuando la web permite arrastrar un elemento y soltarlo en otro sitio, la persona debe poder echarse atrás. Puede soltarlo fuera de cualquier destino para que vuelva a su sitio, devolverlo arrastrándolo, o confirmar o deshacer la acción después de soltarlo. Basta con una de estas opciones.
Por qué es importante
Al arrastrar con el ratón o con el dedo es fácil equivocarse. Le pasa sobre todo a personas con temblores, poca movilidad en las manos o baja visión.
Si un error al soltar borra un archivo o cambia una tarea de estado sin vuelta atrás, el daño ya está hecho. Es una técnica para el criterio 2.5.2 (nivel A), sobre cancelar acciones del puntero.
Cómo se hace
- Si el elemento se suelta fuera de un destino válido, haga que vuelva a su posición original sin hacer nada.
- O bien permita devolverlo a su sitio arrastrándolo de nuevo. Por ejemplo, una tarjeta de un tablero de tareas que se puede llevar otra vez a su columna.
- O bien, después de soltar, pida confirmación («¿Eliminar este archivo?») o muestre un botón «Deshacer».
- Para acciones graves, como borrar, use la confirmación o el botón «Deshacer».
- Esto afecta a los arrastres que programa la web. Los gestos propios del navegador o del sistema, como deslizar para desplazarse, quedan fuera.
Cómo comprobarlo
- Localice en la página los elementos que se pueden arrastrar.
- Arrastre uno y suéltelo fuera de cualquier destino. Compruebe si vuelve a su sitio.
- Si no, suéltelo en un destino y compruebe si se puede devolver arrastrándolo, o si aparece una confirmación o un botón «Deshacer».
- Debe cumplirse al menos una de estas opciones.
Ver el texto completo del W3C (traducción al español)
Esta es una traducción no oficial al español de la técnica G210 de Techniques for WCAG 2.2, del W3C. Puede contener errores. El único documento oficial y normativo es la versión original en inglés, publicada en el sitio web del W3C.
Aplicabilidad
Aplicabilidad
La técnica se aplica a cualquier tecnología que admita la entrada mediante puntero (por ejemplo, que admita alguno o todos los siguientes: puntero del ratón, toque en pantalla táctil o panel táctil, entrada con lápiz o entrada con puntero láser).
Descripción
El objetivo de esta técnica es garantizar que los usuarios que utilizan una acción de arrastrar y soltar basada en trayectoria para mover un elemento desde su ubicación inicial hasta un destino puedan abortar la acción después de haber tomado el elemento. Esto puede lograrse soltando el elemento fuera de la zona de destino o devolviéndolo a su posición original mediante una acción independiente que deshaga la primera. Una tercera opción es añadir un paso posterior a soltar el elemento sobre el destino, bien con un cuadro de diálogo que pida confirmación de la acción al soltar el elemento, bien ofreciendo una orden de deshacer.
Esta técnica aborda las acciones con puntero cuya compatibilidad ha sido implementada por quien desarrolla el contenido, no los gestos que proporciona el agente de usuario (como el deslizamiento horizontal para moverse por el historial del navegador o el deslizamiento vertical para desplazarse por el contenido de la página) ni los del sistema operativo (por ejemplo, gestos para cambiar entre aplicaciones abiertas o para abrir menús contextuales de las tecnologías de asistencia cuando están activadas).
Notas sobre la compatibilidad con agentes de usuario y tecnologías de asistencia
En los dispositivos con pantalla táctil, los gestos basados en trayectoria y multipunto implementados por quien desarrolla no suelen funcionar cuando están activadas tecnologías de asistencia (TA) del sistema operativo, como el lector de pantalla integrado. La TA, por lo general, consume los gestos basados en trayectoria o multipunto, de modo que no llegan al contenido desarrollado. Por ejemplo, un gesto de arrastre horizontal puede no mover el control deslizante como pretendía quien lo desarrolló, sino mover el foco del lector de pantalla al elemento siguiente o anterior. Algunos gestos pueden funcionar si el usuario emplea «gestos de paso directo», que a menudo son poco fiables porque pueden depender de factores como el hardware, el sistema operativo, la «capa de personalización» del sistema operativo, la configuración del sistema operativo o el agente de usuario.
Ejemplos
- Un sitio muestra un directorio de archivos. Los archivos se pueden tomar y mover sobre el icono de una papelera. Cuando el archivo tomado se suelta fuera de ese destino, vuelve a su posición anterior.
- Un sitio muestra un directorio de archivos. Los archivos se pueden tomar y mover sobre el icono de una papelera para eliminarlos. Cuando el archivo tomado se suelta sobre la papelera, un cuadro de diálogo modal pide al usuario que confirme o cancele la acción de eliminación.
- Una implementación kanban de un sitio de planificación de proyectos muestra distintas columnas para las fases de una actividad. Los usuarios pueden tomar y mover a otra columna los iconos que representan los elementos de planificación. Cuando un elemento se ha tomado y sigue al puntero, se puede mover fuera de los destinos (las columnas) y soltarse allí para cancelar la acción. El elemento vuelve entonces a su posición anterior.
- Una implementación kanban de un sistema de seguimiento de incidencias muestra columnas que indican distintas fases en la gestión de las incidencias (como nueva / en proceso / terminada / cerrada). No hay espacio en pantalla fuera de las columnas del kanban. Los usuarios pueden tomar y mover entre columnas los iconos que representan las incidencias. Cuando un elemento se ha soltado en otra columna, la acción puede revertirse arrastrando el icono de vuelta a la columna original, donde recupera su posición inicial (definida por las preferencias de ordenación).
Recursos
Vídeo de una interacción de arrastrar y soltar cancelada (elemento soltado fuera del destino) (YouTube)Pruebas
Procedimiento
Para el contenido que se puede arrastrar, comprobar si la acción de arrastrar y soltar puede revertirse mediante:
- soltar el elemento tomado fuera de un destino
- arrastrar el elemento tomado de vuelta a su posición anterior
- un cuadro de diálogo de confirmación o un control de deshacer que aparece después de soltar el elemento
Resultados esperados
- Al menos una de las opciones n.º 1, n.º 2 o n.º 3 es verdadera.
Cómo lo comprobamos en ADDAW
En cada auditoría de ADDAW revisamos esta técnica página a página y le entregamos los errores con capturas y la forma de corregirlos.
Basado en la técnica G210 del W3C (WCAG 2.2). Explicación y ejemplos: ADDAW. Traducción no oficial del texto del W3C © W3C, licencia de documentos del W3C. ¿Ha visto un error? Escríbanos.