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, >> >> [image: --] >> Olivier Nourry >> [image: http://]about.me/oliviernourry >> <http://about.me/oliviernourry> >> >> >> >> 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, >>>> >>>> [image: --] >>>> Olivier Nourry >>>> [image: http://]about.me/oliviernourry >>>> <http://about.me/oliviernourry> >>>> >>>> >>>> _______________________________________________ >>>> 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
