Fonction hide() de Jquery et accessibilité

Bonjour,

En ce moment j'apprends à utiliser la bibliothèque jquery {En}.

En étudiant le code source, je remarque que la fonction hide() {En} donne la propriété "display: none" aux éléments cibles.

Or, du point vue de l'accessibilité, il vaut mieux éviter le "display: none" notamment car Jaws ignore les éléments cachés de cette façon.

Mais est-ce le cas également lorsque la valeur "none" est appliquée via Javascript plutôt que via une feuille de style ?

J'aurais tendance à dire que oui car il me semble que l'utilisation de Jaws n'est pas forcément synonyme de désactivation du javascript.

Merci de me donner votre avis.
Modifié par Mathieu_vd (06 Feb 2008 - 13:35)

j'ai justement remarqué récemment un comportement étrange de jaws en la matière.

Lorsque l'on utilise hide(), le display none est ajouté en dur dans le code via style="display:none". Jaws ne lit plus l'élément ayant ce style appliqué. Par contre, si tu utilises l'ajout d'une class css externe (qui elle meme contient display: none) sur l'élément avec addClass jaws continuera de lire l'élément.

Dans certains, il peut être utile que le lecteurs d'écrans ne lisent pas un élément. Exemple : dans le cas d'onglets affichant/masquant les parties d'un contenu, si le lecteur d'écran lit toutes les parties, l'utilisateur se retrouve avec des onglets qui ne servent strictement à rien pour lui ce qui peut être perturbant.

Bonjour,

Je m'occupe d'un site de vente en ligne. Et aujourd'hui j'ai reçu un mail d'une cliente aveugle, qui m'annonce qu'elle ne peut plus "lire" la description de nos produits alors qu'elle le pouvait avant.

Je suis ravi d'avoir ce genre de mail, ce qui montre l'importance d'un site accessible à tous quelque soit son contenu. J'essaie de faire aux mieux même si cela n'est pas simple pour un site marchand.

Pour en revenir aux problèmes, j'utilise aussi la librairie jquery, la description est cachée/affichée via jquery.

Ma description est cachée comme suit :

$("#description").css("display", "none");

Puis, j'utilise la fonction slideToggle() pour la faire apparaitre.

Que faut-il faire pour pour permettre à cette cliente de lire nos descriptions des produits sans pour autant modifier le fonctionnement du site.

Merci de donner vos réponses.

suffit de lire mon précédent message ajout une class sur l'élément au chargement puis supprimer/ajout la class pour afficher/masquer

Ok, mais c'est quand même un comportement étrange, que l'on applique un "display: none" ou une classe css avec un "display: none", devrait avoir le même effet, .

oui c'est sans doute dût au moment ou le lecteur d'écran met en cache la page (avant/après le chargement des css). Sinon si tu veux être sûr que ce soit toujours lu, utilise une class css qui positionne en absolue en dehors de l'écran. L'inconvéniant c'est que ton bloc restera navigable au clavier si tu as des liens dedans alors qu'il n'est pas forcément visible