SkillCodexOuvrir les favoris et l’historique
Comparaison comportementale
La Liste d’options est un widget composite que tu composes et stylises, à sélection simple ou multiple ; la Liste de sélection est le contrôle de formulaire natif que le navigateur affiche et gère.
Décision
La personne choisit-elle une valeur native, filtre-t-elle en saisissant ou navigue-t-elle dans une liste ?
| Dimension | Liste d'optionsListbox | Liste de sélectionSelect |
|---|---|---|
| Déclenchement | Le focus ou le pointeur atteint une liste d’options déjà visible. | L’appui sur le contrôle natif libellé ouvre le sélecteur de la plateforme. |
| Modalité | Widget de sélection non modal intégré au formulaire ou à la tâche en cours. | Un choix de formulaire non modal dont la surface est gérée par le navigateur ou le système. |
| Positionnement | Une liste visible dans le flux, pas un sélecteur fermé avec surface surgissante. | Un contrôle dans le formulaire ; la surface d’options ouverte est placée par la plateforme. |
| Interactivité | Permet une sélection simple ou multiple avec déplacement clavier géré ; les options ne sont pas des actions. | Sélectionne une valeur parmi des options ; ne contient ni actions arbitraires ni contenu filtrable. |
| Focus | Le select natif affichant plusieurs lignes forme un seul arrêt de tabulation. Dans cet exemple à sélection simple, la sélection suit le focus clavier : états actif et sélectionné évoluent ensemble ; une listbox personnalisée doit déclarer son propre modèle. | Le contrôle natif délègue le focus et le parcours des options à la plateforme selon sa présentation simple ou multiple déclarée. |
| Fermeture | Dans cet exemple autonome, quitter avec Tab conserve la valeur sélectionnée ; lorsqu'une listbox est contextuelle, sa fermeture est coordonnée par le contrôle propriétaire. | Pour une sélection simple repliée, le sélecteur de la plateforme se ferme selon son comportement standard de validation ou d'annulation ; une présentation en liste n'implique pas de surface contextuelle à fermer. |
| Rôle accessible | listbox > option | select |
| Cas d’usage | Une ou plusieurs valeurs sont choisies dans un ensemble composite d'options nommé | Choisir une ou plusieurs valeurs connues dans une liste prédéfinie |
| Comportement mobile | Utiliser de grandes lignes et un défilement maîtrisé ; préférer un select natif pour une courte liste simple. | Préférer le sélecteur mobile natif sauf si le produit exige réellement un filtrage plus riche. |
Mesure d'audience
Avec ton accord, Google Analytics et des compteurs first-party agrégés mesurent l’usage du site pour nous aider à l’améliorer. Ces compteurs ne contiennent ni texte de recherche, ni candidat, ni identifiant de session ou d’événement. Ton choix reste modifiable via « Cookies » en pied de page.
