Contrôles d’une taille suffisante
Silktide mesure les boutons, les liens et les contrôles de formulaire sur vos pages et signale tout élément plus petit que 44 × 44 pixels. Des contrôles plus grands sont plus faciles à actionner avec précision pour tout le monde, surtout sur les écrans tactiles.
Pourquoi c’est important
Les petites cibles exigent une précision que de nombreuses personnes n’ont pas. Les visiteurs qui ont des tremblements, une dextérité limitée ou des doigts plus larges sur des appareils tactiles manquent souvent de petites commandes, activent la mauvaise ou doivent s’y reprendre à plusieurs reprises. Des tailles de cibles généreuses rendent votre site plus rapide et moins frustrant pour tous les visiteurs, pas seulement pour ceux ayant des limitations motrices.
Il s’agit du critère de succès 2.5.5 des (Taille de la cible — améliorée), une exigence de . Le niveau AAA est une norme ambitieuse : la plupart des sites échouent à ce contrôle par défaut, car 44 × 44 pixels est plus grand que la taille typique des liens et des boutons. Si vous visez le niveau AA, concentrez-vous d’abord sur le contrôle connexe Distance entre composants interactifs, qui teste l’exigence AA de 24 × 24 pixels.
Comment corriger
- Agrandissez les contrôles clés à au moins 44 × 44 pixels , à l’aide de
min-width,min-heightou de marges internes (padding). Priorisez les actions principales comme la navigation, la recherche et les boutons de formulaire. - Lorsque l’agrandissement d’un contrôle est peu pratique, fournissez un lien ou un contrôle équivalent sur la même page qui respecte cette taille - Silktide ignore automatiquement les petits liens lorsqu’un lien suffisamment grand vers la même destination existe.
- Si vous avez décidé qu’un contrôle est acceptable tel quel - par exemple, s’il relève d’une exception WCAG que ce contrôle ne peut pas détecter - vous pouvez le signalement ou exclure l’élément de la vérification.
/* Problème : un bouton icône 30x30 */
.search-button {
width: 30px;
height: 30px;
}
/* Correctif : respecter la recommandation 44x44 */
.search-button {
min-width: 44px;
min-height: 44px;
}
Comment Silktide effectue ce test
- Teste les versions mobile et pour ordinateur de chaque page; les résultats peuvent différer entre les deux.
- Repère les éléments interactifs : liens, boutons, champs de formulaire et zones de carte d’image.
- Ignore les éléments normalement non visibles, comme le contenu placé hors écran pour les , ainsi que tout élément que vous avez exclu de la vérification.
- Ignore les contrôles situés directement à côté de texte, puisque les WCAG exemptent les cibles qui apparaissent dans une phrase ou un bloc de texte.
- Pour les liens, ignore ceux qui ont un équivalent : un autre lien visible sur la même page pointant vers la même destination et mesurant au moins 44 × 44 pixels.
- Signale tout élément restant dont la largeur est inférieure à 44 pixels ou la hauteur est inférieure à 44 pixels. Les tailles sont arrondies à un chiffre après la virgule avant comparaison, ce qui correspond à ce qui est indiqué dans le rapport.
Dépannage
Seuls certains échecs sont répertoriés
Silktide indique jusqu’à 100 exemples par page. Comme les échecs de ce contrôle sont fréquents, une page peut en avoir davantage; corriger des styles partagés permet de résoudre de nombreux signalements en une seule fois.
Les WCAG permettent des exceptions que ce contrôle ne peut pas voir
Les WCAG exemptent les cibles dont la taille est essentielle, définie par le navigateur plutôt que par vos styles, ou dupliquée par un contrôle équivalent ailleurs sur la page. Silktide détecte automatiquement les exceptions du texte en ligne et des liens équivalents; les autres nécessitent votre jugement. Approuvez les signalements qui s’y qualifient.