# Guide AccessiWeb

vous êtes ici : Accueil > Fiches AccessiWeb : Liens > Fiche 6.2

## Fiche 6.2 : Les liens sont-ils explicites ?

Sommaire de la fiche :

- Carte d'identité
- Comprendre

- Comment évaluer
- Comment mettre en oeuvre

- Illustrations
- Références

### Carte d'identité

- Critère AccessiWeb : 6.2
- Niveau AccessiWeb : bronze
- Point(s) de contrôle WCAG 1.0 correspondants (Priorité 2 de WAI) : 13.1

revenir en haut de la page

### Comprendre

#### Bénéfices pour les utilisateurs

- Bénéfice 1:
  Certaines aides techniques offrent la possibilité d'afficher la liste des liens présents sur une page web pour permettre aux utilisateurs une navigation rapide et aisée. Pour que de telles listes de liens soient exploitables, il est impératif que les intitulés des liens soient compréhensibles hors du contexte dans lequel ils sont utilisés, c'est-à-dire, sans le texte qui les entoure.

#### Valeur ajoutée pour le site

- Bénéfice 1:
  Les principaux moteurs de recherche prennent en compte l'intitulé des liens pointant vers une page pour la positionner dans leurs pages de résultats. L'utilisation d'intitulés explicites (reprenant des mots-clés par exemple) améliore le référencement des pages.

revenir en haut de la page

### Comment évaluer

#### Par le code source

1. Copier/coller l'intitulé du lien ou le contenu de l'attribut `alt` (pour les images cliquables) dans un éditeur de texte.
2. En lisant ces liens pris isolément, se demander s'ils sont suffisamment explicites.

#### Par l'utilisation d'outils

Pour une liste complète des outils utilisés pour évaluer l'accessibilité des pages web, et un résumé de leurs principales fonctionnalités, reportez-vous à la page Outils d'aide à l'évaluation.

##### Evaluer avec la barre AccessiWeb (version 1.0) :

1. Sous Internet Explorer, ouvrir la page à analyser.
2. Dans le menu "6. Liens" de la Barre AccessiWeb, activer le critère 6.2.
3. La liste des liens s'affiche dans une nouvelle fenêtre sous forme d'un tableau contenant le numéro du lien, son intitulé, son adresse Internet et le cas échéant, le contenu de l'attribut `title`.
   Note : Les images cliquables (images qui sont en même temps des liens) sont aussi affichées avec le contenu de leur alternative textuelle.
4. Vérifier ensuite que l'intitulé de chacun des liens ainsi que le contenu de l'alternative textuelle de chacune des images cliquables (contenu de l'attribut `alt`) sont explicites hors du contexte de la page. L'intitulé du lien est le texte qui apparaît dans la colonne "Intitulé du lien".

##### Evaluer avec la barre d'accessibilité AIS pour Internet Explorer (version 1.2 en français) :

1. Cliquer sur l'option "Liste des liens [Nouvelle fenêtre]" du menu "Infos Doc".
2. Une nouvelle fenêtre apparaît et présente, sous forme de tableau, le numéro du lien, son intitulé, son adresse Internet et, le cas échéant, le contenu de l'attribut `title`.
   Note : Les images cliquables (images qui sont en même temps des liens) sont aussi affichées mais pas le contenu de leur alternative textuelle. Pour connaître le contenu des alternatives textuelles des images cliquables, cliquer ensuite (à partir de la fenêtre présentant le tableau des liens) dans le menu "Images" sur l'option "Liste des images [Nouvelle fenêtre]". Le code source des images cliquables sera alors affiché.
3. Vérifier ensuite que l'intitulé de chacun des liens ainsi que le contenu de l'alternative textuelle de chacune des images cliquables sont explicites hors du contexte de la page. L'intitulé du lien est le texte qui apparaît dans la colonne "Intitulé du lien".

##### Evaluer avec la Barre d'Outils Web Developper pour Firefox (version 1.0.2 en français) :

1. Activer l'option "Informations sur la page" du menu "Information" puis cliquer sur l'onglet "Liens".
2. Une nouvelle fenêtre apparaît et présente, sous forme de tableau, le nom du lien (intitulé), son adresse Internet et le type d'élément.
   Note : Le contenu de l'alternative textuelle des images cliquables (images qui sont en même temps des liens) est aussi affiché mais sous forme de texte, au même titre que les intitulés de liens eux-même : pas de distinction possible entre un lien textuel et le contenu de l'attribut `alt` d'une image.
3. Vérifier ensuite que l'intitulé de chacun des liens ainsi que le contenu de l'alternative textuelle de chacune des images cliquables sont explicites hors du contexte de la page. L'intitulé du lien est le texte qui apparaît dans la colonne "Nom".

##### Evaluer avec le lecteur d'écran Jaws (version 5 et 6.2 en français) :

1. Après le chargement de la page, appuyer simultanément sur les touches Insert+F7. Une fenêtre contenant la liste des liens s'affiche en superposition de la fenêtre de Internet Explorer.
2. Lire chaque intitulé de lien ainsi listé pour savoir s'il est explicite sans le texte qui l'entoure.

revenir en haut de la page

### Comment mettre en oeuvre

#### Qui est concerné ?

Les personnes responsables de la partie rédactionnelle ont la charge du respect de ce critère.

#### Implémentation

Utiliser exclusivement des intitulés de liens (portion de texte située entre les balises `A` et `/A`) explicites hors du contexte de la page.
Par exemple, préférer "En savoir plus sur l'association BrailleNet" plutôt que "En savoir plus".

#### Exemple de mauvaise pratique

Dans l'exemple de code qui suit, on peut relever les problèmes d'accessibilité suivants concernant l'intitulé des liens :

1. Le premier lien est un lien graphique représentant le logo AccessiWeb et permettant de se rendre sur ce site. Or cette image ne comporte pas d'alternative textuelle. Il en résulte que les lecteurs d'écran ou les navigateurs textuel ne donneront, comme intitulé pour ce lien, que le chemin du fichier, c'est-à-dire "images/logo". Ceci n'indique pas à l'utilisateur sur quelle page il va aboutir en cliquant sur ce lien.
2. Les deux liens suivants ont pour intitulé unique "En savoir plus". Pour un utilisateur qui passe de lien en lien avec la seule touche "tabulation", rien ne lui permet de les distinguer. D'autant qu'ils conduisent vers des pages différentes.
3. Enfin, le dernier lien graphique possède bien une alternative textuelle, mais elle est en anglais sur une page dont la langue principale est le français. Ceci n'est donc pas adapté au contexte.

<html lang="fr">
<head>
<title>Liens non expliciteS</title>
</head>
<body>
<a href="http://www.accessiweb.org"><img src="images/logo.gif" /></a>
<a href="http://www.accessiweb.org/fr/accessibilite_web/actualites/">En savoir plus</a><br />
<a href="http://www.accessiweb.org/fr/accessibilite_web/Liste_accessibilite/">En savoir plus</a><br />
<a href="guide-accessiweb-fiche-6-1.html"><img src="arrow_prev.gif" alt="previous page" /></a>
</body>
</html>

#### Exemple de bonne pratique

En reprenant l'extrait de code précédent, on peut sensiblement améliorer les intitulés de liens pour qu'ils deviennent explicites et indiquent bien à l'utilisateur vers quelle page il sera conduit :

1. Le premier lien graphique est doté d'une alternative textuelle appropriée
2. les deux liens dont l'intitulé était "En savoir plus" sont légèrement modifiés pour indiquer vers quelle rubrique ils mènent.
3. L'alternative textuelle du dernier lien graphique est francisé".

<html lang="fr">
<head>
<title>Liens explicites</title>
</head>
<body>
<a href="http://www.accessiweb.org"><img src="images/logo.gif" alt="accéder au site AccessiWeb" /></a>
<a href="http://www.accessiweb.org/fr/accessibilite_web/actualites/">En savoir plus sur les actualités</a><br />
<a href="http://www.accessiweb.org/fr/accessibilite_web/Liste_accessibilite/">En savoir plus sur la liste accessibilité</a><br />
<a href="guide-accessiweb-fiche-6-1.html"><img src="arrow_prev.gif" alt="page précédente" /></a>
</body>
</html>

revenir en haut de la page

### Illustrations

Note : pour lire les extraits sonores au format mp3 proposés sur ce guide, vous devez disposer d'un lecteur capable de lire ce type de fichier. Les enregistrements ont été réalisés à partir soit de la synthèse vocale utilisée par Jaws, soit celle utilisée par Home Page Reader. Pour plus d'informations sur le téléchargement de lecteurs de fichiers mp3, consulter le paragraphe Lecteurs multimédia de la page Outils d'aide à l'évaluation de ce guide.

Une série de liens peu explicites (format mp3, 123 ko)

Voici ce que lit Jaws :
"Liens non explicites. Tab, lien graphique image logo. Tab, lien en savoir plus. Tab, lien en savoir plus. Tab, lien graphique preuviou page."

Une série de liens explicites (format mp3, 157 ko)

Voici ce que dit Jaws :
"Liens explicites. Tab, lien graphique accéder au site AccessiWeb. Tab, lien en savoir plus sur les actualités. Tab, lien en savoir plus sur la liste accessibilité. Tab, lien graphique page précédente."

revenir en haut de la page

### Références

#### Autres fiches à consulter

- Fiche 1.4 : Pour chacune des images de la page, les textes dans l'attribut ALT font-ils moins de 60 caractères ?
- Fiche 1.12 : Pour chacune des images liens, le texte contenu dans l'attribut ALT donne-t-il la fonction du lien ?
- Fiche 6.1 : L'intitulé des liens fait-il moins de 80 caractères ?
- Fiche 6.3 : Si nécessaire, l'attribut TITLE est-il présent et fait-il moins de 80 caractères ?
- Fiche 6.4 : L'attribut TITLE donne-t-il plus d'informations concernant le lien que l'intitulé du lien lui-même ?
- Fiche 6.5 : Chaque intitulé de lien identique amène t-il vers la même destination ?

#### Autres ressources

- html Techniques (section 6) : Links
- int-evry : Ergonomie des Interfaces Web

revenir au sommaire de la fiche

revenir en haut de la page

Guide AccessiWeb (version 2.1, 30 août 2006) | Conditions d'utilisation | Contact