Libellés de liens identiques et title différents?

[phdm]

Bonjour,

A priori, les bonnes pratiques en matière d'accessibilité conseillent que, dans une même page, chaque lien ait un libellé différent.

Ma question est la suivante: est-il possible, sans inconvénient pour l'accessibilité de la page, de répéter un même libellé sur plusieurs liens d'une même page si les "title" associés sont différents?

Par exemple:

<a href="page1.html" title="En savoir plus sur les raisons de voter oui">En savoir plus</a>

et plus loin dans la même page:

<a href="page2.html" title="En savoir plus sur les raisons de voter non">En savoir plus</a>

et encore après :

<a href="page3.html" title="En savoir plus sur les raisons de s'abstenir">En savoir plus</a>

Il est des cas où cela serait satisfaisant. Ainsi par exemple, dans le "WikiBBlues", Laurent Denis indique que lorsque Jaws est configuré pour lire les title des liens, ce lecteur d'écran ignore alors l'intitulé du lien, sauf si le title est absent (Scénarios d'utilisation de l'attribut title des liens a). Dans ce cas, ma suggestion marcherait: les utilisateurs d'agents visuels verraient une série de "En savoir plus", ce qui ne leur poserait pas de problème, les utilisateurs de Jaws entendraient les "title", différents à chaque fois.

Mais il est probablement des configurations et des cas moins favorables. Pourriez-vous m'en indiquer et m'indiquer des cas où cette approche ne fonctionnerait pas du tout.

Merci beaucoup pour votre critique

Philippe [ phdm ]

PS : J'ai lancé cette question hier soir sur la liste "pompeurs", mais il est peut-être plus opportun de la poser ici.

[fre]

La réponse que j'ai toujours entendu est "oui tu peux le faire".

Si l'on prend le referentiel accessibilité AccessiWeb, cela semble en tout cas permit.

Fred

[Steph. K.]

Il est des cas où cela serait satisfaisant. Ainsi par exemple, dans le "WikiBBlues", Laurent Denis indique que lorsque Jaws est configuré pour lire les title des liens, ce lecteur d'écran ignore alors l'intitulé du lien

C'est ça le problème, pour que cela soit pleinement accessible il faut que l'utilisateur ait modifié les réglages par défaut de son logiciel, ce qui n'est pas toujours le cas... loin de là.

Tu peux facilement modifier ton exemple :

En savoir plus sur <a href="page1.html">les raisons de voter oui</a>

et plus loin dans la même page:

En savoir plus sur <a href="page2.html">les raisons de voter non</a>

[adatim]

Je pencherais aussi pour la dernière réponse de Steph qui a le mérite d'être plus claire dans tous les cas de figures et même hors contexte sans avoir à se demander si un title va être pris en compte ou pas et comment.

Lionel

Modifié 19 Mai 2005 par adatim

[Denis]

Je me range du côté de Steph également, que je salur au passage.

Puisque par défaut, les configurations de Jaws ne prennent pas en compte le title pour aucun élément HTML sauf les frames, il vaut mieux conserver des libellés significatifs, quitte à changer l'organisation des hyperliens comme il l'a proposé.

Par contre, il existe une manière facile de contourner positivement ce "problème". Plutôt que d'utiliser un lien texte, tu pourrais créer une image (ex. : pour lire la suite) et mettre l'équivalent textuel de ton title dans un alt... à ce moment, Jaws et les autres synthétiseurs vocaux le liraient parfaitement.

Le mauvais côté de cette technique par contre, c'est évidemment qu'en mode de grossissement du texte, les images elles, demeurent petites et peuvent occasionner des difficultés de lecture pour certains utilisateurs...

Comme quoi qU'il n'y a pas de solutions miracles...

[phdm]

Par contre, il existe une manière facile de contourner positivement ce "problème". Plutôt que d'utiliser un lien texte, tu pourrais créer une image (ex. : pour lire la suite) et mettre l'équivalent textuel de ton title dans un alt... à ce moment, Jaws et les autres synthétiseurs vocaux le liraient parfaitement.

Là je suis un peu dubitatif, le référentiel ADAE - Accessiweb stipule (point 1.9) "qu'il convient de privilégier un texte mis en forme à un texte sous forme d'image"

Le mauvais côté de cette technique par contre, c'est évidemment qu'en mode de grossissement du texte, les images elles, demeurent petites et peuvent occasionner des difficultés de lecture pour certains utilisateurs...

Cela doit pouvoir se résoudre si tu donnes à ton image une hauteur en "em" (par exemple 1.2em) et pas de largeur, ton image s'adaptera à la taille des caractères, y compris si tu zoomes ou grossis les caractères (même sous IE !)

@+

Philippe

[Denis]

Là je suis un peu dubitatif, le référentiel ADAE - Accessiweb stipule (point 1.9) "qu'il convient de privilégier un texte mis en forme à un texte sous forme d'image"

Absolument, mais comme nous vivons dans un monde imparfait, il convient d'opter pour la solution la moins imparfaite du lot. Ceci dit, je pourrais me tromper, mais cette propositionest le fruit de mes réflexions sur le sujet.

Cela doit pouvoir se résoudre si tu donnes à ton image une hauteur en "em" (par exemple 1.2em) et pas de largeur, ton image s'adaptera à la taille des caractères, y compris si tu zoomes ou grossis les caractères (même sous IE !)

:yuk: Et comment déterminer la hauteur exacte d'une image en pixel en em ?

[phdm]

Et comment déterminer la hauteur exacte d'une image en pixel en em ?

Tu donnes une hauteur en ems. Tout simplement. Ou si tu donnes une hauteur et une largeur, il faut respecter les proportions de l'image. Cela marche même sous IE.

Cela marche quelle que soit la hauteur en pixels de ton image (mais la qualité n'est pas nécessairement au rendez-vous quelle que soit cette hauteur en pixels!)

Regarde cette page d'exemple:

Elastic Design Demonstration donnée en lien de l'article Elastic Design (ALA) (et traduit ici: Du stretching pour vos sites)

Fais varier la taille de tes caractères, la taille de ton image varie.

Le code est:

<img id="image1" class="image" src="icicles.jpg" alt="Elastic image" />

.image {
	width: 30em;
	height: 15em;
	margin: 0 2em 1em 2em;
	border: 1px solid #ccc; }

_AT_mitiés

Philippe [ phdm ]

[Monique]

Par contre, il existe une manière facile de contourner positivement ce "problème". Plutôt que d'utiliser un lien texte, tu pourrais créer une image (ex. : pour lire la suite) et mettre l'équivalent textuel de ton title dans un alt... à ce moment, Jaws et les autres synthétiseurs vocaux le liraient parfaitement.

Le mauvais côté de cette technique par contre, c'est évidemment qu'en mode de grossissement du texte, les images elles, demeurent petites et peuvent occasionner des difficultés de lecture pour certains utilisateurs...

Comme quoi qU'il n'y a pas de solutions miracles...

<{POST_SNAPBACK}>

Je n'ai pas le temps de rechercher qui était César pour lui rendre ce qu'il lui revient...

mais j'ai le souvenir d'une solution qui me semble intéressante :

<a href="page1.html" title="En savoir plus sur les raisons de voter oui">En savoir <img alt="plus sur les raisons de voter oui" src="image-signe-plus.gif" height="20" width="20" title="" /></a

l'attribut title vide, c'est pour ne pas imopser une info-bulle inutile aux utilisateurs de IE

[fre]

l'attribut title vide, c'est pour ne pas imopser une info-bulle inutile aux utilisateurs de IE 

Tiens tiens... une règle n'est elle pas qu'un attribut TITTLE doit apporter plus d'infos que le lien lui meme ??????

Pour ce qui est de JAWS et des TITLE, je suia ssez d'accord sur le fait qu'il faille tenir compte des aides techniques dans la réléxion, mais je me pose alors une question :

"Faut il prévoir des solutions pour les utilisateurs qui ne savent pas se servir de leur aide technique, ou privilégier une solution standard ?"

Je suis d'accord pour dire que l'accessibilité c'est un accès équitable à tous et c'est bien pour ca que les standards sont en place. Du coup, je pense que c'est aux utilisateurs de connaitre leur aide technique afin de pouvoir récuppérer les infos prévues par des attributs HTML valides

[phdm]

j'ai le souvenir d'une solution qui me semble intéressante :

<a href="page1.html" title="En savoir plus sur les raisons de voter oui">En savoir <img alt="plus sur les raisons de voter oui" src="image-signe-plus.gif" height="20" width="20" title="" /></a>

L'idée est vraiment très intéressante.

1) Mais l'utilisateur du lecteur d'écran paramétré comme je l'indiquais (pour lire les title) va entendre:

"En savoir plus sur les raisons de voter oui... plus sur les raisons de voter oui"

Ce qui n'est pas génial.

2) Un compromis pourrait être:

<a href="page1.html">En savoir <img alt="plus sur les raisons de voter oui" src="image-signe-plus.gif" height="20" width="20" title="" /></a>

mais pas de title, ce n'est pas une option que je prendrai facilement.

3) Question @ fre, au point où on en est: penses-tu que le meilleur compromis resterait de distinguer le title, 1ère hypothèse que j'évoquais?

_AT_mitiés

Philippe [ phdm ]

[Monique]

Bonjour,

Tiens tiens... une règle n'est elle pas qu'un attribut TITTLE doit apporter plus d'infos que le lien lui meme ??????

<{POST_SNAPBACK}>

Dans mon exemple, il est question d'un attribut title vide pour l'image, pas pour le lien.

Je suis d'accord pour dire que l'accessibilité c'est un accès équitable à tous et c'est bien pour ca que les standards sont en place. Du coup, je pense que c'est aux utilisateurs de connaitre leur aide technique afin de pouvoir récuppérer les infos prévues par des attributs HTML valides

Le problème est double :

- Configurer un logiciel comme Jaws est très complexe. S'y retrouver dans l'aide d'un logiciel est déjà difficile pour un voyant peu familiarisé avec l'informatique, la tâche relève de l'exploit pour un non-voyant.

- La majorité des utilisateurs d'aide technique ne sont pas des webmasters, ils ne comprennent donc pas facilement la portée réelle de leurs choix de configuration.

Pour info, voilà l'aide proposée à propos des liens

Cette série de boutons radio vous permet de déterminer l'information donnée par JAWS lorsqu'il rencontre des liens texte sur des pages Web. Les options suivantes sont disponibles :

- Utiliser titre : lorsque cette option est sélectionnée, JAWS recherche l'information donnée par l'attribut HTML Titre en premier et vous la lit. Le texte du titre n'est pas affiché à l'écran. Si aucun attribut Titre n'est trouvé, alors JAWS lit le texte à l'écran.

- Utiliser le texte à l'écran : JAWS lit le texte à l'écran. Cette option est sélectionnée par défaut.

- Utiliser info-bulles : lorsque cette option est sélectionnée,  JAWS recherche l'information contenue dans le texte donné lorsqu'on y déplace la souris et la lit. Les attributs « Sous la souris » sont souvent utilisés pour afficher des info-bulles contenant de l'information utile. Si aucun texte « sous la souris » n'est trouvé, JAWS lit le texte à l'écran pour le lien.

- Utiliser le plus long : JAWS vous lit la plus longue chaîne d'information pour chacun des liens.

- Recherche personnalisée : cette option vous permet d'indiquer à JAWS l'ordre selon lequel il doit effectuer la recherche d'information. Une fois cette option sélectionnée, le champ d'édition Définir ordre de recherche Options liens texte est activé et est utilisé pour préciser l'ordre de la recherche personnalisée.

J'ai un jour demandé à un non-voyant, connaissant très bien son logiciel, pourquoi il n'utilisait pas l'option "Utiliser titre"... il m'a répondu avoir essayé mais au mieux ne pas avoir vu de différence, au pis ne rien comprendre au texte proposé.

Il est vrai que l'attribut title est utilisé de différentes manières selon le webmaster : la simple répétition du libellé du lien, un commentaire humoristique, une suite de mots clefs... et parfois une information complémentaire à propos du lien !