Dos controles pueden gestionar la misma preferencia, pero el cambio no ocurre en el mismo momento. «Recibir novedades» funciona como checkbox dentro de un alta: se marca y se confirma al terminar. En una pantalla de ajustes, un interruptor debería guardar esa preferencia en cuanto se pulsa. La forma del control ayuda; el flujo es lo que aclara cuándo se aplica.
Empieza por el momento del cambio
Haz una pregunta antes de abrir la biblioteca de componentes: ¿la pulsación aplica la preferencia o el formulario reúne varias decisiones para guardarlas después? Carbon distingue el interruptor inmediato del checkbox que forma parte de un flujo con confirmación final.
Hay una prueba casera que ahorra discusiones. Quita el botón «Guardar» del boceto. Si la acción todavía tiene sentido y puede deshacerse al momento, el interruptor es buen candidato. Si desaparece el paso que hace efectiva la elección, necesitas un checkbox. Sí, es una pregunta sencilla: separa la selección del efecto.
Usa un checkbox cuando falte un paso
El checkbox recoge una selección: elegir temas de interés, aceptar unas condiciones o marcar filas para una acción por lotes. La guía de Carbon cita esos usos y añade un estado intermedio para representar que sólo está elegida una parte de un grupo.
Describe en la etiqueta qué se selecciona. «Recibir un resumen semanal» funciona mejor que «Activar resumen». Mantén visible el botón que aplica el conjunto de decisiones. Si una opción no está disponible, explica el motivo cerca del control; un cuadrado gris sin contexto sólo obliga a adivinar.
Reserva el interruptor para cambios inmediatos
Usa el interruptor en ajustes binarios, reversibles y de efecto instantáneo: silenciar avisos, activar el modo oscuro o permitir notificaciones. Carbon desaconseja este control cuando el sistema no puede aplicar el cambio al momento. Añadir debajo un botón «Guardar» da a entender primero que el clic basta y después que todavía falta otro paso.
Muestra el resultado en el mismo sitio. Puede bastar con el nuevo estado, un mensaje breve o el contenido ya actualizado. Si la petición falla, devuelve el control a su posición anterior y explica qué ha ocurrido. Si sigue activo tras el rechazo del servidor, el usuario creerá que la preferencia quedó guardada.
Prueba cuatro estados antes de entregarlo
No revises sólo apagado y encendido. Prototipa también el foco de teclado, el guardado en curso y el fallo. El patrón de W3C indica que la barra espaciadora cambia el estado, exige una etiqueta accesible y pide que esa etiqueta no cambie al alternar; el estado se comunica mediante aria-checked.
Escucha además cómo queda al leerlo: «Notificaciones, interruptor, activado» describe una función encendida; «Recibir novedades, checkbox, marcado» describe una opción elegida. Yo usaría una última pregunta en la revisión del diseño: ¿esto ya ha ocurrido o todavía falta confirmar? Si el equipo aún no sabe responder, todavía no toca pulir el componente.
0 comentarios
Todavía no hay comentarios.
Deja un comentario