Comparaison comportementale
Case à cocher vs Groupe de boutons radio
Choisir Case à cocher pour : Sélectionner un nombre libre d'options indépendantes. Choisir Groupe de boutons radio pour : Choisir un mode de livraison parmi des alternatives visibles.
| Dimension | Case à cocherCheckbox | Groupe de boutons radioRadio group |
|---|---|---|
| Déclenchement | Clic, toucher ou Espace sur la case ou son libellé associé. | Clic ou toucher sur une option ; Tab entre dans le groupe et les flèches déplacent le choix. |
| Modalité | Valeur de formulaire booléenne ou mixte, indépendante et non modale. | Contrôle de formulaire non modal pour une seule valeur dans un groupe nommé. |
| Positionnement | Dans le flux avec son libellé persistant, souvent dans un groupe vertical. | Options groupées en ligne ou empilées sous une question commune. |
| Interactivité | Bascule son propre état coché ; plusieurs cases peuvent être sélectionnées indépendamment. | La sélection est exclusive ; les flèches gérées changent l’option active. |
| Focus | Chaque case native possède un focus visible et son libellé agrandit la cible au pointeur. | Le groupe natif se comporte comme un seul arrêt une fois une valeur choisie, avec un focus visible sur le bouton actif. |
| Fermeture | Sans objet : la case persiste jusqu'à ce que l'utilisateur la bascule ou réinitialise le formulaire. | Sans objet : la sélection reste jusqu'au choix d'un autre bouton ou à la réinitialisation. |
| Rôle accessible | native checkbox | native fieldset and radio inputs |
| Cas d’usage | Sélectionner un nombre libre d'options indépendantes | Choisir un mode de livraison parmi des alternatives visibles |
| Comportement mobile | Transformer toute la ligne du libellé en grande cible tactile sans masquer l’état coché. | Préférer des options empilées avec de grands libellés tactiles lorsque les textes ne sont pas très courts. |