[Résolu]Séparateur de liens

Salut à tous,

j'ai une liste de liens les uns à côté des autres, en display: inline;.
Dois-je utiliser un séparateur, comme ceci:

<div id="bandeau">
<ul>
<li><a href="index.html">Accueil</a> |</li>
<li><a href="collection.html">Ma collection</a> |</li>
<li><a href="origines.html">Les origines de Jaz</a> |</li>
<li><a href="galerie.html">Galerie de photos</a> |</li>
<li><a href="technique.html">Le côté technique</a> |</li>
<li><a href="publicite.html">La publicité</a> |</li>
<li><a href="tirages.html">Les tirages limités</a> |</li>
<li><a href="recherche.html">Mes recherches</a> |</li>
<li><a href="contact.html">Contact</a> |</li>
<li><a href="liens.html">Liens</a> |</li>
</ul>
</div>

ou bien puis-je me "contenter" de celà?

<div id="bandeau">
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="collection.html">Ma collection</a></li>
<li><a href="origines.html">Les origines de Jaz</a></li>
<li><a href="galerie.html">Galerie de photos</a></li>
<li><a href="technique.html">Le côté technique</a></li>
<li><a href="publicite.html">La publicité</a></li>
<li><a href="tirages.html">Les tirages limités</a></li>
<li><a href="recherche.html">Mes recherches</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="liens.html">Liens</a></li>
</ul>
</div>

Quelle est l'incidence sur l'accessibilité?

Merci d'avance, et désolé si je ne suis pas dans la bonne catégorie!

La 2ème solution est très bien puisqu'il me semble qu'une liste remplace parfaitement un caractère inter-liens.

Le simple fait d'utiliser des "li" distingue chacun de tes liens, puisque chaque"li" représente un élément différent.

Merci à vous deux,

j'hésitais quant au problème spécifique des aveugles; il me semble que le séparateur est un plus...si je me trompe, tant mieux: j'ai un wagon de pages sans séparateur; si je peux économiser le temps à insérer des séparateurs sur chaque page, cela m'arrangera!

Moi par contre j'ai un problème un peu similaire.

Je crée des listes, je les mets en ligne, mais j'ai besoin de les séparer visuellement.

L'idéal aurait été d'utiliser la pseudo-classe CSS :after mais ça ne fonctionne pas avec IE. J'ai donc utilisé la première technique citée dans le premier post... bien qu'elle ne me convienne pas tellement.

a écrit :
Ding ! Item de liste ! Barre verticale !
blablabla...
Ding ! Item de liste ! Barre verticale !
blablabla...
Ding ! Item de liste ! Barre verticale !
blablabla...

Vous tiendriez longtemps à écouter ça, vous ?

Moi, ça m'agace immédiatement.

Bien-sûr, le Ding ! Item de liste !, comme c'est le rendu de l'élément <li> dans mon lecteur d'écran, je peux le paramétrer et le faire disparaître (en vrai, il ne fait pas Ding ! Item de liste !, il n'est pas si mauvais).

Mais le Barre verticale ! , lui, il est dans le contenu, et je ne peux en aucun cas me l'épargner.

Please.... évitez les séparateurs qui ne servent plus à rien, surtout là où il n'a jamais fallu en mettre !
Modifié par Laurent Denis (28 Jun 2005 - 17:17)

Le fait que ce soit en liste, même enligne, préserve l'accessibilité par éléments séparés. Visuellement, tu n'as que l'embarras du choix avec des padding entre chaque lien, couleurs en background etc...

Merci Macpom pour tes explications! En fait, j'avais déja souligné la sélection par un changement de couleur.

dominique a écrit :
De plus, si je n'ai pas rêvé, Laurent Denis, en réponse sur ce forum, il y a quelques jours à annoncé l'abandon de la technique du séparateur de liens........ Mais je n'arrive pas à retrouver cet échange

Moi non plus. En fait, c'est un simple constat : cette recommandation était temporaire dans WCAG1.0, et disparaît de WCAG2.0

En tous cas, la bonne pratique Opquast correspondante est sur la selette
Modifié par Laurent Denis (28 Jun 2005 - 17:26)

http://forum.alsacreations.com/topic.php?fid=6&tid=4652#p41277

Re tout le monde!

En fait, ce qui m'avait fait "tilt", c'est que sur le livre de Raphaël, page 168,
il est dit: "Prévoir un élément de séparation physique entre deux liens successifs". Alors, je me disais: bon, je vais refaire tous mes menus...c'est vrai qu'entre la rédaction du livre et sa sortie, cela peut vite changer!!!

Je suggère modestement un truc: pourrait-on créer un topic qui traiterait uniquement des pratiques "qui avaient cours à une certaine période, mais qui ne seraient plus d'actualité?" Si j'ai bien compris, cette question de séparateur a vu sa position changer tout récemment; ce pourrait être utile de regrouper les pratiques tendant à disparaître...

Merci à tous encore!
Modifié par bouquins (28 Jun 2005 - 17:30)

>Laurent et Stephan : merci pour les liens!

Si je suis bien, un simple espace suffirait à séparer les liens adjacents?

Oulah ! Deux liens successifs, c'est <a>lien</a><a>lien</a>... Pas comme dans une liste, où il y a deux éléments... (ici, une virgule serait / était (aura été ?) recommandée entre les deux "a").

bouquins a écrit :

Si je suis bien, un simple espace suffirait à séparer les liens adjacents?

Une espace , on dit une espace

bouquins a écrit :
Je suggère modestement un truc: pourrait-on créer un topic qui traiterait uniquement des pratiques "qui avaient cours à une certaine période, mais qui ne seraient plus d'actualité?"

Pour ce qui est de l'accessibilité, 3 recommandations sont sur la selette au moins dans WCAG2.0 :
- la séparation des liens adjacents par un caractère imprimable, ce qui n'autorise pas (encore ?) à faire des <a ...></a><a ...></a>, autrement-dit plus d'un lien sur le même mot. Simplement, <a...></a> <a...></a> n'est pas un problème (notez l'espace séparant les deux liens).
- le contenu par défaut des input text, textarea etc, exigé du temps où certains dispositifs de rendu ne savaient pas gérer les contrôles de formulaire vides. (Donc, inutile de faire un value="blablabla" pour faire plaisir à Bobby : c'est même nuisible à l'accessibilité, en fait)
- une obscure histoire de colonnage de tableau totalement oubliée depuis des lustres.

Ajoutons que :
- les label implicites sont proscrits,
- que les accesskeys voient leur intérêt sérieusement mis en cause,
- que l'attribut title est une alternative valable aux <label> dans les formulaires lorsque ce label ne doit pas apparaître dans le rendu graphique.
- que tabindex et liens d'évitement ne font pas toujours bon ménage
- qu'acronym et abbr n'ont aucun intérêt pratique pour les lecteurs d'écran (ce qui ne veut pas dire pas d'intérêt pour l'utilisabilité générale)
- que les titres <hn> sont un moyen de navigation précieux dans un document
- que les tableaux ne sont pas un crime, s'ils sont rendus correctement une fois linéarisés, et qu'ils peuvent même être une aide pour saisir la structure d'une page, à défaut de titres hiérarchisés.

TODO: effectivement, faire quelque-chose à ce propos. Qui s'y colle ? Aide garantie sur le sujet
Modifié par Laurent Denis (28 Jun 2005 - 21:17)

>Laurent: merci pour toutes ces précisions!

>Stephan: désolé, j'étais loin, je n'avais pas vu que c'était une fille!


Modifié par bouquins (29 Jun 2005 - 06:42)

Laurent > Merci, au moins, on ne sera pas trop en retard lors de la prochaîne sortie !!!

Merci Laurent pour ces infos nouvelles.

Le domaine de l'Accessibilité est assez destabilisant en ce moment : d'une version à l'autre, tout change et on doit faire l'inverse d'avant.
Il y'a peu de temps encore, il fallait afficher un séparateur structurel entre les liens parce sinon les lecteurs vocaux ne faisaient pas bien la diférence (nous avions une discussion là dessus)... aujourd'hui, il est déconseillé d'employer de tels séparateurs ... (il devient donc préférable de les générer automatiquement (before/after) par exemple).
Vivement ici aussi que les normes soient appliquées par les outils utilisateurs.
Modifié par Raphael (29 Jun 2005 - 10:02)