Passer au contenu
SilktideAide

Focus non masqué

Silktide vérifie que lorsqu’une commande est sélectionnée au clavier, elle n’est pas complètement cachée derrière d’autres contenus comme une bannière de témoins ou un en-tête collant. Un utilisateur au clavier qui ne peut pas voir la commande sélectionnée n’a aucun moyen de savoir où il se trouve sur la page.

Les causes les plus courantes sont des éléments qui restent fixes pendant le défilement de la page :

  • Bannières en haut ou en bas de la page, comme les avis relatifs aux témoins
  • Barres de navigation et pieds de page collants
  • Boîtes de dialogue ou fenêtres contextuelles qui laissent le focus passer derrière elles

Ce contrôle couvre le masquage total, tel qu’exigé par Niveau AA (critère 2.4.11). Le pendant plus strict de , Focus non partiellement masqué, signale aussi les commandes seulement partiellement couvertes.

Pourquoi c’est important

Les personnes qui naviguent au clavier suivent l’indicateur de pour savoir sur quelle commande elles se trouvent. Lorsque le focus se déplace vers une commande enfouie sous une bannière de témoins ou un pied de page collant, l’indicateur disparaît : l’utilisateur ne peut pas dire ce que fera la touche Entrée, ni même où il se trouve, et peut abandonner la page.

Comment corriger

  1. Privilégiez un contenu qui défile avec la page plutôt que des éléments fixés par‑dessus.
  2. Lorsque vous devez conserver une bannière ou un en‑tête fixe, utilisez les propriétés CSS scroll-padding ou scroll-margin pour que les éléments ciblés par le focus défilent à l’écart — voir la technique WCAG C43.
  3. Pour les boîtes de dialogue et fenêtres contextuelles, piégez le focus à l’intérieur tant qu’elles sont ouvertes, afin que rien derrière ne puisse recevoir le focus. La plupart des bibliothèques de boîtes de dialogue et l’élément natif <dialog> le font pour vous.

Comment Silktide effectue ce test

  1. Simuler un utilisateur au clavier qui appuie sur Tab pour parcourir chaque élément focalisable, dans les vues sur ordinateur et sur mobile de la page.
  2. Simuler que le navigateur fait défiler verticalement chaque élément ayant le focus jusqu’au centre de l’écran (voir la note sur le défilement ci‑dessous).
  3. Vérifier si un autre élément se superpose à l’élément ayant le focus. Les éléments qui se chevauchent avec des arrière‑plans transparents ou semi‑transparents sont ignorés, car l’indicateur de focus demeure visible à travers eux.
  4. Signaler la commande si elle est complètement recouverte par un élément opaque. Un chevauchement partiel n’est pas signalé par ce contrôle — c’est ce que Focus non partiellement masqué vérifie.

Pourquoi nous simulons le défilement

La quantité de défilement effectuée par un navigateur entre deux pressions sur Tab varie selon la taille de la fenêtre, ainsi le fait qu’un en‑tête collant recouvre un élément ayant le focus peut différer entre des écrans dont la hauteur ne varie que de quelques pixels. Tester à une taille de fenêtre exacte signalerait des problèmes que personne avec une fenêtre légèrement différente ne pourrait reproduire.

À la place, Silktide évalue chaque élément comme s’il était défilé jusqu’au centre de l’écran. Cette approche volontairement généreuse signale les problèmes qui touchent toutes les tailles d’écran de façon cohérente et évite ceux qui ne surviennent qu’à une hauteur de fenêtre précise. Le W3C ne précise pas comment ce critère doit être testé.

Boîtes de dialogue qui s’ouvrent après le chargement de la page

Si une page contient une boîte de dialogue fermée par défaut, Silktide suppose que, tant qu’elle est ouverte, le focus ne peut pas en sortir — ce qui est le comportement attendu d’une boîte de dialogue correctement conçue. Une boîte de dialogue défectueuse qui laisse le focus s’échapper derrière elle peut donc ne pas être signalée, à moins qu’elle ne soit ouverte au chargement de la page.

Dépannage

Je vois très bien l’élément ayant le focus

Vérifiez dans une fenêtre plus petite : les éléments masqués par des en‑têtes ou des pieds de page collants n’entrent souvent en conflit qu’à certaines hauteurs de fenêtre. Si vous concluez que l’élément n’est jamais masqué de manière significative, vous pouvez ignorer ce constat.

En savoir plus

Dernière mise à jour

Cette page vous a-t-elle été utile?