Hello Tanguy, Si je comprends bien l'explication donnée pour la technique H2 (exemple 4, échec car alt vide sur une image lien, malgré la présence du lien texte adjacent): il peut y avoir des situations où le lien sera quand même signalé à l'utilisateur, sans qu'il puisse déterminer sa destination. J'imagine que tous les lecteurs d'écran (ou autres technos d'assistance?) ne se comportent pas comme Jaws en ignorant totalement le lien image.
Cordialement, [image: --] Olivier Nourry [image: http://]about.me/oliviernourry <http://about.me/oliviernourry> Le 11 août 2014 12:55, <[email protected]> a écrit : > Bonjour, > > Selon moi, même si le référentiel AW oblige à avoir un alt non vide sur > toutes les images-liens, le cas que tu présentes ne le justifie pas. En > effet, si j’ai bien compris, tu as une image-lien, puis un lien séparé > (donc une deuxième balise a), et tous deux pointent vers la même ressource. > Si l’intitulé du lien texte est explicite, il n’y a donc pas de perte > d’information ni de fonctionnalité à mettre un alt vide sur l’image-lien. > Je ne vois donc pas quel utilisateur est pénalisé. > > Or c’est bien dans ce sens que je conçois l’accessibilité. > > En cherchant un peu, on peut dire que celui qui ne charge pas les images > et voit une croix rouge cliquable sans texte d’aide peut se trouver > désorienté. Mais il n’est pas lésé puisque le lien texte vient à son > secours. > > > > Cordialement / Best regards > > Tanguy Lohéac > > Expert for the Accessibility of Information > > Collaboration Services > > 1 rue Victor Basch > > 91349 Massy CEDEX > > Tél +33 1 41 24 56 73 / poste Line 2 56 73 > > Intranet accessibilité > <http://accessibilite.sanofi-aventis.com/Pages/01_Actualites/Accueil_fr_FR.aspx> > / Accessibility intranet > <http://accessibilite.sanofi-aventis.com/Pages/01_Actualites/Accueil_en_US.aspx> > > > > *De :* liste_gta [mailto:[email protected]] *De la > part de* Olivier Nourry > *Envoyé :* lundi 11 août 2014 12:42 > *À :* [email protected] > *Objet :* Re: [Liste GTA] liens images avec alt vide, redondants avec des > liens textes adjacents > > > > Hello, > le lien composite reste le must, clairement. Maintenant ce n'est pas > toujours possible. Si par exemple le lien est également un titre, la balise > <a> sera dans la balise <hn>, et on ne peut pas ou souhaite pas forcément > avoir l'image dans le titre également. > > Dans cet article http://john.foliot.ca/aria-hidden/ , un peu daté mais > bien documenté, John Foliot traite ce cas, le teste sur différentes config, > et propose le code suivant: > > > > > > <a href="tbl.html" aria-hidden="true" role="presentation" tabindex="-1"> > > <img src="tim_th.jpg" class="thumb" > > alt="Tim Berners-Lee Takes the Stand to Keep the Web Free" > > role="presentation"></a> > > <h3> > > <a href="tbl.html">Tim Berners-Lee Takes the Stand to Keep the Web Free</a> > > </h3> > > Donc par rapport à la technique décrite par Johan, on a en plus un > role="presentation" sur le <a> de l'image, et sur l'image. Cette > implémentation est celle qui se rapproche le plus du résultat voulu par > l'auteur, à savoir pas de lien en doublon en lecture d'écran, et pas de tab > sur l'image au clavier. > > Ceci étant dit, mon validateur (analyseur SGML W3C via l'extension HTML > Validator inclus à Firefox) tique sur le fait d'avoir role="presentation" > sur un élément A. Malheureusement je n'ai pas trouvé de ressource sur ce > point précis. Si vous avez... > > > Cordialement, > > > > *Erreur ! Nom du fichier non spécifié.* > > *Olivier Nourry* > > *Erreur ! Nom du fichier non spécifié.*about.me/oliviernourry > > [image: Image supprimée par l'expéditeur.] > > > > > > > > Le 10 août 2014 00:15, Romain Gervois <[email protected]> a écrit : > > Bonjour, > > Si on peut se permettre de mettre des tabindex -1 et du aria-hidden true, > on est déjà dans un contexte favorable et on peut alors faire bien mieux > (et viser des liens composites comme préconisé). Attention à l'usage de > aria-hidden pour masquer aux TAs des contenus visibles, Une note dans la > spéc. explique très bien comment cela peut poser d'autres problèmes > (contexte de pilotage à la voix, difficultés dans certaines procédures > d'assistance...). Bon, le problème est peut être réduit avec des liens du > type "Lire la suite" mais la diversité des cas fait qu'on ne peut > l'affirmer. > > Concernant la solution du onclick sur le conteneur, on ne parle plus de la > même implémentation (le cas d'Olivier se limitant à une image et un > intitulé) puisqu'il s'agit d'une implémentation type lien block. La > solution Javascript a quelque effet de bord pas top côté restitution ; > j'avais fait il y a quelques temps une page de tests au sujet de 3 > implémentations différentes de lien block : > http://www.romaingervois.fr/implementations/lien-block.html > > Bonne journée. > > Romain > > > > Le 9 août 2014 23:26, Goulven CHAMPENOIS <[email protected]> a écrit : > > > > Johan Ramon a présenté à Paris-Web 2013 > <http://www.paris-web.fr/2013/conferences/accessibiliser-avec-subtilite.php> > une technique intéressante pour ce type de problème justement : sur les > liens en doublon, on ajoute *tabindex="-1"* pour les empêcher de prendre > le focus, et *aria-hidden="true"* pour les cacher complètement aux > lecteurs d'écran. > > Comme Johan le dit lui-même, ça peut apporter des problèmes de > compatibilité et quand le code passe de mains en mains. > > > C'est à partir de la diapo 13 de son support : > http://www.johanramon.fr/accessibiliser-subtilite/ > > Ou de 11 minutes 30 à 15 minutes 45 dans la vidéo : > http://vimeo.com/83912475 > > Jacques Pyrat présente une autre solution (à 21 minutes dans la vidéo) : > mettre un *onclick* sur le conteneur, et pas de lien autour de l'image. > On évite ainsi de mettre des outils dangereux dans les mains d'utilisateurs > non formés. > > > > Bonne soirée, > > > -- > Goulven > > > > 2014-08-08 18:03 GMT+02:00 Olivier Nourry <[email protected]>: > > > > ...et donc l'exemple 4 explique pourquoi ce que j'ai sous les yeux pose > problème. > Merci Romain! > > > Cordialement, > > > > *Erreur ! Nom du fichier non spécifié.* > > *Olivier Nourry* > > *Erreur ! Nom du fichier non spécifié.*about.me/oliviernourry > > *Erreur ! Nom du fichier non spécifié.* > > > > > > > > Le 8 août 2014 17:53, Romain Gervois <[email protected]> a écrit : > > > > Bonjour Olivier, > > La technique WCAG H2 "Combining adjacent image and text links for the same > resource" (http://www.w3.org/TR/WCAG20-TECHS/H2.html) correspond à ce que > tu préconises. > > Elle n'est effectivement pas prévu dans le référentiel car "elle fait > partie de cette grande famille de technique WCAG qui adressent des Critère > de succès permettant de passer mais pas d'invalider ce même critère de > succès" dixit Jean-Pierre dans une discussion de février sur cette > technique. > > Concernant l'implémentation, ça peut être délicat mais tu as aussi la > solution du position de l'image via CSS et si il y a une bonne source HTML > ça doit pouvoir se faire sans trop de bobo. > > Romain > > > > Le 8 août 2014 17:25, Olivier Nourry <[email protected]> a écrit : > > Hello, > > Je tombe souvent sur des liens images avec alt vide, qui se trouvent être > en redondance avec des liens textes adjacents qui font strictement la même > chose. > > En appliquant le référentiel stricto sensu, je suis censé invalider ces > liens images avec le critère 6.6. > > En termes de préco, je recommande généralement d'inclure l'image au lien, > en gardant le alt vide, de manière à former un lien composite conforme et à > conserver une zone de clic large (image + texte). > > Seulement ce n'est pas toujours évident à implémenter. Auquel cas on a > deux choix pour rester conforme: > > 1. renseigner le alt avec le même texte que le lien > 2. ou supprimer le lien sur l'image > > (note: je ne traite pas l'option consistant à passer l'image en > background, et à agrandir le conteneur du lien, car dans mon cas, l'image > étant animée au survol, via CSS, ça risque d'être compliqué). > > Avec l'option 1, je pollue la liste de liens avec des doublons. Pas glop > pour la lecture non visuelle. > > Avec l'option 2, je réduis la zone de clic, ce qui peut être préjudiciable > aux utilisateur avec des difficultés de dextérité. > > Donc en devenant conforme je crée des problème d'utilisabilité pour > certains utilisateurs en situation de handicap. En ne faisant rien je n'ai > pas ces problèmes, mais je ne suis pas conforme. > > Comme le cas n'est pas prévu par le référentiel, je me dis que j'ai loupé > quelque chose. Pouvez-vous m'éclairer svp? > > Merci d'avance > > > Cordialement, > > > > *Erreur ! Nom du fichier non spécifié.* > > *Olivier Nourry* > > *Erreur ! Nom du fichier non spécifié.*about.me/oliviernourry > > *Erreur ! Nom du fichier non spécifié.* > > > > > > > > _______________________________________________ > liste_gta mailing list > [email protected] > http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org > > > > > _______________________________________________ > liste_gta mailing list > [email protected] > http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org > > > > > _______________________________________________ > liste_gta mailing list > [email protected] > http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org > > > > > _______________________________________________ > liste_gta mailing list > [email protected] > http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org > > > > > _______________________________________________ > liste_gta mailing list > [email protected] > http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org > > > > _______________________________________________ > liste_gta mailing list > [email protected] > http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org > >
_______________________________________________ liste_gta mailing list [email protected] http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
