Le Journal d'UX
L'actualité UX,
au-dessus de la ligne de flottaison.
Wiki UX Toggle (Interrupteur)

Toggle (Interrupteur)

Composant
Définition

Contrôle d'interface qui alterne entre deux états mutuellement exclusifs, généralement activé/désactivé. Le toggle reprend la métaphore de l'interrupteur physique : la position du curseur indique l'état actuel. Le changement prend effet immédiatement, sans validation supplémentaire. Il se distingue de la case à cocher qui ne s'applique qu'après soumission du formulaire. Le toggle est destiné aux paramètres dont l'effet est instantané.

En pratique

Le label du toggle décrit l'état activé, pas l'action. "Mode sombre" est correct, "Activer le mode sombre" crée une ambiguïté. Les couleurs doivent indiquer clairement l'état : vert ou accent pour actif, gris pour inactif. Un retour haptique ou visuel confirme le changement d'état sur mobile. L'attribut ARIA `role="switch"` différencie le toggle d'une simple checkbox pour les lecteurs d'écran. Quand le changement a des conséquences lourdes (suppression de données), ajouter une confirmation.

Exemple

iOS utilise des toggles dans tous ses menus Réglages. Le toggle Wi-Fi modifie instantanément la connexion sans étape de validation, avec un changement de couleur et un déplacement du curseur animé.

Voir aussi
Accessibilité
Affordance
Feedback
Mapping naturel
Signifiant
Sources
Toggle Switch Guidelines - Nielsen Norman Group
Switch Role - WAI-ARIA
Le Journal d'UX : veille UX et design au quotidien, wiki UX de référence en français. Ouvert aux contributions de la communauté.