Les éléments à faire glisser doivent offrir une alternative à pointeur unique
Glisser signifie maintenir un pointeur enfoncé tout en le déplaçant avec précision, ce qui est difficile, voire impossible, pour les personnes qui ont des tremblements ou un contrôle limité de la main, et pour toute personne qui utilise un pointeur commandé par la tête ou la commande vocale. Quand le filtre de prix ne fonctionne que par glissement, elles ne peuvent pas du tout resserrer la fourchette.
- Identifiant de la règle
- vs-dragging
- Source
- Contrôle Validiscan
- Impact
- Grave
- Niveau de correction
- MANUAL
- sur Shopify, Shopware, WooCommerce et Magento
- Statut
- exécutée
Ce que fait le contrôle
Détecte les éléments interactifs qui ne peuvent être utilisés que par glissement, comme les curseurs de fourchette de prix, le zoom d’image et les listes triables, sans alternative par simple appui ou clic (2.5.7).
Le contrôle recherche les poignées de curseur personnalisées : [role="slider"], les classes de poignée de noUiSlider, de jQuery UI et d’Ion.RangeSlider, ainsi que des noms de classe comme price-handle. Il ignore input[type="range"], les poignées masquées, de moins de 4 px ou marquées aria-disabled="true", et les éléments repérés par leur classe qui dépassent 80 px ou qui contiennent une image. Six poignées au plus par page sont contrôlées.
Une poignée hors de l’ordre de tabulation est un constat. Une poignée focalisable reçoit une touche fléchée dans le sens de son axe puis, si rien n’a changé, une touche fléchée perpendiculaire à cet axe. Si aucune des deux ne modifie aria-valuenow, aria-valuetext, le texte de la poignée ou sa position sur la piste, c’est un constat. Si un appui sur une touche fait quitter la page, un rechargement l’annule ; ce curseur et les poignées focalisables suivantes vont dans « à examiner ».
Les widgets de zoom d’au moins 80 × 80 px dotés de draggable="true" ou de touch-action: none, sans commande de zoom à proximité, vont eux aussi dans « à examiner ». Le scanner ne transforme pas aujourd’hui les résultats « à examiner » en constats. Seules des touches sont pressées ; le contrôle ne vérifie donc pas si un simple appui tactile ou un clic suffit à régler une valeur.
Comment corriger
Proposez une alternative à pointeur unique à côté de chaque interaction par glissement : des champs numériques pour les prix minimum et maximum, des boutons plus et moins pour le zoom, et des boutons monter et descendre pour les listes triables.
Critères de succès WCAG
- 2.5.7 Dragging Movements, niveau AA
Clauses de la norme EN 301 549
| Critère WCAG | Version 3.2.1 | Version 4.1.1 |
|---|---|---|
| 2.5.7 | aucune clause dans cette version | 9.2.5.7 |
Commencez par une vérification gratuite de votre boutique.
Envoyez l’adresse de votre boutique. Validiscan la scanne et vous envoie chaque échec que le scan peut prouver, avec sa page et son code.
Demander une vérification gratuiteOu écrivez à info@validiscan.com.
Ce que couvre la vérification gratuite, et ce qu’elle laisse de côté- Vous envoyez
- l’adresse de votre boutique
- Pages scannées
- jusqu’à 15
- Vous recevez
- chaque échec que le scan peut prouver, avec la page et le code
- Sur votre boutique
- pages publiques uniquement ; aucune connexion, aucun achat, aucun formulaire envoyé
- Ce qu’elle n’est pas
- un audit complet