Lecteur d'écran caché de visibilité

1. Les lecteurs d'écran lisent-ils la visibilité cachée?
2. Comment masquer le contenu sur le lecteur d'écran?
3. La visibilité cachée affecte-t-elle l'accessibilité?
4. Comment rendre quelque chose de visible uniquement pour les lecteurs?

Les lecteurs d'écran lisent-ils la visibilité cachée?

Les lecteurs d'écran ignorent généralement tout ce qui est affiché: aucun, il n'est donc pas lu pour les lecteurs d'écran. Il existe différentes façons d'avoir des choses cachées visuellement ou non visuelles, nous allons donc parcourir les cas et les techniques pour chaque.

Comment masquer le contenu sur le lecteur d'écran?

Pour masquer le texte à un lecteur d'écran et l'afficher visuellement, utilisez l'attribut ARIA-HIDDEN et définissez-le sur true. Pour masquer le texte à un lecteur d'écran et le masquer visuellement, utilisez l'attribut caché. Vous pouvez également utiliser CSS pour définir l'affichage: Aucune ou visibilité: caché pour masquer un élément aux lecteurs d'écran et visuellement.

La visibilité cachée affecte-t-elle l'accessibilité?

La principale raison pour laquelle la visibilité: la règle cachée n'est pas seulement la visibilité visuelle est qu'elle affecte également la visibilité des éléments à la technologie d'assistance. Lorsque nous appliquons la visibilité: cachée à un élément, elle la supprime également de l'arbre d'accessibilité, ce qui le rend invisible à des technologies comme les lecteurs d'écran.

Comment rendre quelque chose de visible uniquement pour les lecteurs?

La manière conventionnelle est d'utiliser CSS (affichage: aucune; et visibilité: cachée;) ou l'attribut HTML 5 `Hidden`. Ces propriétés cachent des éléments non seulement à l'écran, mais aussi pour les utilisateurs du lecteur d'écran. Ainsi, ces éléments ne seront pas visibles ni vocalisés par des technologies d'assistance (AT).