Hmm, je ne mettrais pas un <nav role="navigation"> personnellement. Le référentiel préconise de réserver ces balises et attributs aux menus principaux et secondaires. Or, à mon sens le fil d'Ariane n'entre pas dans cette définition (menus de navigation au sens RGAA: liens permettant de naviguer dans les rubriques d'un site). Le fil d'Ariane est cité explicitement dans le glossaire comme étant une *barre *de navigation (nuance!), mais AMHA ce n'est pas dans le scope de NAV et role=navigation. Le problème est qu'à ce compte-là, tout ensemble de liens devient une NAV, et l'utilisateur perd en lisibilité; ce qui va à l'encontre du bénéfice supposé des landmarks. C'est un peu comme les headings: trop de headings crée du bruit parasite. Idem pour les labels ARIA surabondants (un peu le cas ici, à mon avis).
En l'occurrence, le mieux est l'ennemi du bien! Pas convaincu non plus par les OL. OL caractérise une liste d'éléments à consulter dans l'ordre indiqué; ceci, pour moi, sous-entend que les éléments sont de "même niveau". Or dans un fil d'Ariane on a une notion de hiérarchie; que l'on ne retrouve pas en HTML, hormis via des listes imbriquées, mais pareil, c'est trop lourd pour être réellement utile. Je pense qu'il ne faut pas chercher midi à quatorze heures. Si une succession de liens fonctionne, et fournit tout ce dont l'utilisateur a besoin (en l'occurrence, rien), il faut s'en tenir à cela. Donc, des liens à plat, point. [image: --] Olivier Nourry [image: http://]about.me/oliviernourry <http://about.me/oliviernourry> Le 21 avril 2016 à 15:34, Steven Mouret <[email protected]> a écrit : > Pour ma part, j'utilise cette structure : > > <nav class="breadcrumb" role="navigation" aria-label="Position de la page > dans le site"> > <p id="breadcrumbLabel">Vous êtes ici : </p> > <ol aria-labelledby="breadcrumbLabel"> > <li><a href="/">Accueil</a></li> > <li><a href="#">lorem</a></li> > <li><a href="#">ipsum</a></li> > <li title="dolor (page en cours)" class="active">dolor</li> > </ol> > </nav> > > Un peu verbeux. > > > -- > Steven Mouret > > Le 21 avril 2016 à 15:25, Anthony Ladeuil <[email protected]> a écrit : > >> Hello tout le monde >> >> Pour ma part j'aime bien utiliser la structure suivante : >> >> <dl> >> <dt>Vous êtes ici : </dt> >> <dd> >> <a href="/home">accueil</a> >> </dd> >> <dd> >> <a href="/lorem">lorem</a> >> </dd> >> <dd> >> lorem ipsum >> </dd> >> </dl> >> >> Ca peut faire hurler (ou pas) mais j'y trouve mon compte pour la mise en >> forme... >> Du coup, je veux bien des avis :) >> >> Anthony >> >> >> Le 21 avr. 2016 à 12:58, [email protected] a écrit : >> >> hello, >> moi j'aime sémantiquement que mes liens soient en ol/li, une liste >> ordonnée, ça le fait , non ? >> Je veux bien des retours d'utilisateurs sur l'emploi d'une liste ordonnée >> ! >> avec le "vous êtes ici" devant sans titre, en effet. >> >> vincent qui arrive après le train ! >> >> ----- Mail original ----- >> De: "Cyril Lamotte" <[email protected]> >> À: "liste gta" <[email protected]> >> Envoyé: Jeudi 21 Avril 2016 11:51:39 >> Objet: Re: [Liste GTA] Structure Fil d'Ariane >> >> >> Ok je pars là-dessus alors ! >> >> Succession de liens avec "vous êtes ici" devant (pas dans un titre). >> >> Merci >> >> >> >> >> Cyril Lamotte >> Développeur Front-end / Référent accessibilité >> >> >> [email protected] >> >> >> 02 43 08 39 97 >> >> Jouve >> 1, rue du docteur Sauvé, 53101 Mayenne CEDEX >> www.jouve.com >> Twitter Google + LinkedIn ViadeoJouve >> >> >> >> >> Le 21/04/2016 11:38, Sylvie Duchateau a écrit : >> >> >> >> >> Bonjour Cyril, Olivier et tous, >> >> Je pense qu'un h2 « vous êtes ici » n'est pas nécessaire. >> >> >> Fil d'Ariane, non plus, ceux qui ne connaissent pas les recommandations >> se demanderont ce qu'Ariane vient faire là-dedans. >> >> Vous êtes ici me paraît parlant. >> >> >> Je suis d'accord avec Olivier sur la « bête succession de liens ». >> >> >> Bonne journée >> >> Sylvie >> >> >> Le 21/04/2016 à 11:17, Olivier Nourry a écrit : >> >> >> >> Bonjour Cyril, >> Il n'y a aucune structure HTML qui corresponde à un fil d'Ariane, et à >> vrai dire, je ne vois pas trop ce que l'on pourrait faire de mieux qu'une >> bête succession de liens comme l'exemple que tu donnes. D'ailleurs ni la >> spec HTML, ni les design patterns ARIA ne le prévoient, malgré le coté très >> répandu de la pratique. Sans doute un signe qu'il n'y a pas besoin de >> structure particulière. >> Je ne recommande en tout cas pas la liste non ordonnée, ça ne colle pas >> avec le fait que les éléments ne sont pas interchangeables, et ne sont pas >> du même "niveau". Du coup on pourrait penser à des UL ou OL imbriquées à 1 >> élément, mais en lecture vocale ça serait franchement lourdingue, et pas >> pratique du tout. >> Sinon peut-être optimiser la restitution en rendant les séparateurs non >> vocalisés (role=presentation par exemple). >> >> >> Le H2 me parait excessif pour la plupart des cas, ça fait un point >> d'arrêt dans l'arborescence en plus qui ne se justifie pas franchement. >> J'aurais juste mis le tout (incluant "vous êtes ici") dans un conteneur >> avec un id. Si le masquage est fait correctement (contenu hors viewport), >> il reste trouvable avec CTRL+F, ça permet de le retrouver facilement si on >> est déjà passé dessus. Tant qu'à le masquer, autant avoir un libellé plus >> spécifique: "localisation" ou "fil d'Ariane" (le second est un terme >> technique, mais au moins il ne peut pas être confondu avec autre chose. >> >> >> Juste mes deux centimes.... Sur tous ces points d'amélioration UX, je >> suis preneur de l'avis d'utilisateurs de lecteurs d'écran pour ce qui est >> le plus agréable ou pratique. >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> -- >> Olivier Nourry >> http://about.me/oliviernourry >> >> >> >> >> Le 21 avril 2016 à 10:45, Cyril Lamotte < [email protected] > a écrit : >> >> >> >> Bonjour la Liste, >> >> Comment structureriez-vous un fil d'Ariane et mettriez-vous un titre >> juste avant ? >> >> Dans Drupal, le code généré par défaut est celui-ci, le jugez-vous >> correct ? : >> >> >> >> <h2>Vous êtes ici</h2> (titre masqué) >> <div class="breadcrumb"> >> <a ...>Rubrique</a> >> >> >> <a..>Titre</a> >> </div> >> >> Ou feriez-vous une liste ul / li ? >> >> >> Ou autre.. ? >> >> >> >> Merci à vous ! >> >> >> >> >> -- >> >> >> Cyril Lamotte >> Développeur Front-end / Référent accessibilité >> >> >> [email protected] >> >> >> 02 43 08 39 97 >> >> Jouve >> 1, rue du docteur Sauvé, 53101 Mayenne CEDEX >> www.jouve.com >> Twitter Google + LinkedIn ViadeoJouve >> >> >> >> >> _______________________________________________ >> 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 > >
_______________________________________________ liste_gta mailing list [email protected] http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
