Salut Vincent,
Allez, c'est vendredi, on lâche les trolls!

Je suis à fond pour la sémantique, avec une limite: le bénéfice
utilisateurs. Si une structure est correcte sur le plan de la sémantique,
mais génère du bruit, je ne l'utilise pas.

Concernant les OL pour un fil d'Ariane: pour le coup, en plus je pense que
ce n'est pas adapté à la situation. Je vais tenter de le démontrer par
l'absurde.

Tentative 1:
Tu as un article long réparti sur 4 pages. Tu proposes une liste de liens
pour passer de l'une à l'autre. Naturellement tu vas utiliser une liste OL
de liens, car ces 4 pages font partie d'un ensemble, qu'il faut lire dans
l'ordre indiqué pour faire sens. Incontestable, non?
Mais la structure que tu proposes est strictement identique, pour quelque
chose qui conceptuellement est très différent. Comment l'utilisateur non
visuel peut faire la distinction entre 4 pages qu'il faut lire dans un
ordre donné, et 4 pages "en branche", si la structure et donc la
restitution est la même?
AMHA ça invalide l'option OL pour un fil d'Ariane, car crée une confusion
avec autre chose.

Tentative 2: admettons que tu codes l'arborescence complète du site, avec x
rubriques, y sous-rubriques, comportant chacune z pages. Naturellement, tu
vas faire une liste UL de x éléments (rubriques), ayant y enfants qui sont
des listes ayant z items (pages). Tu aurais donc 2 listes UL imbriquées, ce
qui donnerait:
<ul>
    <li>Rubrique 1
        <ul>
             <li>Sous-rubrique 1
                 <ul>
                      <li>page 1</li>
                      <li>...</li>
                      <li>page z</li>
                  </ul>
             </li>
             <li>Sous-rubrique 2
                 <ul>
                      <li>page 1</li>
                      <li>...</li>
                      <li>page z</li>
                  </ul>
             </li>
        </ul>
    </li>
    <li>Rubrique 2>[tout le bazar au-dessus]</li>
</ul>

Dans cette configuration il ne te viendrait jamais à l'idée de construire
chaque branche comme une liste OL à 1 niveau, ça n'aurait aucun sens. Les
pages d'une branche donnée ne sont pas de même niveau, donc l'utilisateur
ne devrait pas recevoir une info qui suggère cela (ce qui est le cas si on
met tout dans une même liste); d'autre part il n'y a pas d'ordre de lecture
particulier, on peut consulter dans l'ordre que l'on veut sans problème de
compréhension, donc pas d'ordre suggéré par la structure (donc pas OL).
Or le Fil d'Ariane n'est ni plus ni moins que la branche courante, détachée
de l'arbo. Donc pourquoi devrait-elle tout à coup changer radicalement de
nature?
Avec cet exemple on pourrait se dire: pour le fil d'Ariane faudrait donc
des UL imbriquées à 1 item? Sauf qu'on atteint la limite de la sémantique:
elle pénalise plus qu'elle n'aide. Donc, non.

Voilà pourquoi, perso, je me contente de liens successifs, n'ayant rien de
plus pertinent sous la main.


PS: après chacun fait comme il le sent, hein! ;) [clin d’œil]




[image: --]
Olivier Nourry
[image: http://]about.me/oliviernourry
<http://about.me/oliviernourry>


Le 21 avril 2016 à 16:58, <san...@free.fr> a écrit :

> Olivier,
> je veux pas troller mais j'ai des réserves :
> si ton fil d'ariane est collé (côte à côte niveau code) à un menu de nav,
> ou si ton site a peu de role=navigation (par exemple qu'un seul menu de
> navig principal), il me semble que l'on puisse mettre le fil d'ariane dans
> une grande div role=navigation.
> Second point, moi j'aime quand y'a de la sémantique et donc une liste de
> liens à plat, en plus sans role=navigation, ça me chagrine, c'est dommage
> de ne pas utiliser la liste ordonnée pour dire on a la rubrique X, en
> premier, en second (dedans), la sous rubrique XY... ett enfin qu'on est là !
> pourquoi s'en priver ?
>
> ----- Mail original -----
> De: "Olivier Nourry" <olv.nou...@gmail.com>
> À: "liste gta" <liste_gta@list.accessiweb.org>
> Envoyé: Jeudi 21 Avril 2016 16:35:22
> Objet: Re: [Liste GTA] Structure Fil d'Ariane
>
>
>
> 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.
>
>
>
>
>
>
>
>
>
>
> --
> Olivier Nourry
> http://about.me/oliviernourry
>
>
>
>
> Le 21 avril 2016 à 15:34, Steven Mouret < steven.mou...@gmail.com > 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 < anth...@ladeuil.com > 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, san...@free.fr 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" < clamo...@jouve.fr >
> À: "liste gta" < liste_gta@list.accessiweb.org >
> 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é
>
>
> clamo...@jouve.fr
>
>
> 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 < clamo...@jouve.fr > 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é
>
>
> clamo...@jouve.fr
>
>
> 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
> liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
>
>
>
> _______________________________________________
> liste_gta mailing list liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
>
> _______________________________________________
> liste_gta mailing list liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
> _______________________________________________
> liste_gta mailing list
> liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
> _______________________________________________
> liste_gta mailing list
> liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
> _______________________________________________
> liste_gta mailing list
> liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
>
>
> _______________________________________________
> liste_gta mailing list
> liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
>
>
> _______________________________________________
> liste_gta mailing list
> liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
> _______________________________________________
> liste_gta mailing list
> liste_gta@list.accessiweb.org
> http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org
>
_______________________________________________
liste_gta mailing list
liste_gta@list.accessiweb.org
http://list.accessiweb.org/mailman/listinfo/liste_gta_list.accessiweb.org

Répondre à