Guide AccessiWeb

1. Accueil
2. Mode d'emploi
3. Structure d'une fiche
4. Fiches AccessiWeb
   • 1) Images
   • 2) Cadres
   • 3) Couleurs
   • 4) Multimédia
   • 5) Tableaux
   • 6) Liens
   • 7) Code exécutable
   • 8) Eléments obligatoires
   • 9) Structuration de l'information
   • 10) Présentation de l'information
   • 11) Formulaires
   • 12) Navigation
   • 13) Consultation
5. Glossaire
6. Aide à l'évaluation
   • Liste d'outils
   • Manuel Code Source
   • Manuel WAT [Internet Explorer]
   • Manuel Web Dev [Firefox]
7. Référentiel AccessiWeb
   • AccessiWeb v1.1 [Général]
   • AccessiWeb v1.1 [Déployé]
   • AccessiWeb v1.0
8. Tables de correspondance
   • AW v1 vers AW v1.1 [Général]
   • AW v1.1 [Général] vers AW v1.1 [Déployé]
   • AW v1.1 [Général] vers WCAG 1.0
   • AW v1.1 [Général] vers UWEM 1.0
   • AW v1.1 [Déployé] vers UWEM 1.0
   • AW v1.1 [Général] vers WCAG 2.0
   • AW v1.1 [Général] vers mobileOK Basic 1.0
   • AW v1.1 [Général] vers RGAA
9. Moteur de recherche
10. Références
11. Remerciements
12. Plan du guide

Critère 6.2 : Pour chaque lien ayant un titre de lien, ce titre est-il nécessaire ?

revenir en haut de la page

Carte d'identité du critère 6.2 [niveau AccessiWeb : Bronze]

revenir en haut de la page

Comprendre

Comprendre le critère

Tous les liens dont l'intitulé est insuffisant pour les rendre explicites hors contexte doivent posséder un titre de lien. Ce titre de lien doit reprendre l'intitulé du lien et y ajouter les informations nécessaires pour le rendre explicite hors contexte.

Bénéfices pour les utilisateurs

• Bénéfice 1:
  Si une contrainte particulière impose l'utilisation d'intitulés de liens identiques pointant cependant vers des pages différentes, il est indispensable de les distinguer. Ainsi, les utilisateurs qui naviguent de lien en lien, à l'aide de la touche TAB ou d'une fonction leur permettant de constituer la liste des liens, disposent d'informations supplémentaires pour différencier chaque lien lu hors de son contexte.
  L'attribut title doit être placé dans la balise a et être pertinent.
  
  
• Bénéfice 2 :
  De même, lorsqu'un lien propose le téléchargement d'un fichier, les informations relatives à ce fichier (format, poids, présentation) doivent également apparaître. L'utilisation de l'attribut title dans la balise a peut permettre d'apporter un complément d'information pour ce type de liens. Ce complément d'information sera utile aux internautes qui ne possèdent pas le logiciel permettant de lire ce fichier. Il sera également indispensable pour les personnes qui ont une connexion bas débit et pour qui le téléchargement d'un fichier volumineux prendrait un temps considérable.

Valeur ajoutée pour le site

• Lorsqu'une page contient de nombreux liens de type "en savoir plus" ou "cliquer ici", l'utilisation de la balise title pour les distinguer et apporter des informations supplémentaires, permet de mieux référencer ces pages auprès des moteurs de recherche.

revenir en haut de la page

Comment évaluer

Note : de manière générale, il est conseillé de faire l'évaluation d'un critère via l'analyse de son code source. Ce procédé d'évaluation par le code source est détaillé ci-après quand il est possible : procédé d'évaluation en 3 étapes via le ou les tests associés au critère. Les procédés d'évaluation par différents outils sont donnés en complément de l'évaluation par le code source.

Par le code source

1. Sélectionner le(s) élément(s) à tester : Ouvrir le code source de la page Web et sélectionner le code des liens. Il s'agit du code associé à tous les éléments suivants (exemple de code source : <a href="nomdefichier.html" title="titre de lien">intitulé de lien</a>) :
   • texte compris entre les balises a et /a
   • balise img comprise entre les balises a et /a
   • balises area contenues entre les balises <map name=[...]> et </map>
   • balise img et du texte compris entre les balises a et /a.
   
   
   
2. Appliquer le(s) test(s) suivant(s) :
   • Test 6.2.a [Bronze] : Pour chaque lien texte ayant un titre de lien (attribut title), ce titre est-il nécessaire ?
   • Test 6.2.b [Bronze] : Pour chaque lien image ayant un titre de lien (attribut title), ce titre est-il nécessaire ?
   • Test 6.2.c [Bronze] : Pour chaque image réactive (balise img ou balise object avec un attribut usemap), pour chaque zone cliquable (balise area) ayant un titre de lien (attribut title), ce titre est-il nécessaire ?
   • Test 6.2.d [Bronze] : Pour chaque lien composite ayant un titre de lien (attribut title), ce titre est-il nécessaire ?
   
   
3. Valider le critère : le critère est validé si vous répondez oui à tous les tests applicables précédents.

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 d'outils Accessibilité du Web pour Internet Explorer (version 2.0 beta en français) :

• Pour le test 6.2.a [Bronze] :
  1. Sous Internet Explorer, ouvrir la page à analyser.
  2. Dans le menu "Informations" de la Barre d'outils Accessibilité du Web (version 2.0 beta), activer l'option "Liste des liens [nouvelle fenêtre]"
  3. La liste des liens s'affiche dans une nouvelle fenêtre.
  4. Dans la colonne "Intitulé du lien", pour chaque lien texte ayant un titre de lien (texte présent dans la colonne Title), vérifier si ce titre est nécessaire.
  5. Si c'est le cas, le test est validé.
  
  
• Pour le test 6.2.b [Bronze] :
  1. Sous Internet Explorer, ouvrir la page à analyser.
  2. Dans le menu "IE" de la Barre d'outils Accessibilité du Web (version 2.0 beta), décocher l'option "Activer l'ActiveX"
  3. Dans le menu "Informations" de la Barre d'outils Accessibilité du Web (version 2.0 beta), activer l'option "Liste des liens [nouvelle fenêtre]".
  4. La liste des liens s'affiche dans une nouvelle fenêtre.
  5. Dans la colonne "Intitulé du lien", pour chaque lien image ayant un titre de lien (texte présent dans la colonne Title), vérifier si ce titre est nécessaire.
  6. Si c'est le cas, le test est validé.
  
  
• Pour le test 6.2.c [Bronze] :
  1. Sous Internet Explorer, ouvrir la page à analyser.
  2. Dans le menu "Images" de la Barre d'outils Accessibilité du Web (version 2.0 beta), activer l'option "Voir les images map [nouvelle fenêtre]".
  3. Chaque images réactive s'affiche avec la liste de ses balises area.
  4. Pour chaque image réactive, vérifier que pour chaque zone cliquable (balise area) ayant un titre de lien, ce titre est nécessaire.
  5. Si c'est le cas, le test est validé.
  
  
• Pour le test 6.2.d [Bronze] :
  1. Dans le menu "IE" de la Barre d'outils Accessibilité du Web (version 2.0 beta), décocher l'option "Activer l'ActiveX"
  2. Puis, dans le menu "Informations" de la Barre d'outils Accessibilité du Web (version 2.0 beta), activer l'option "Liste des liens [nouvelle fenêtre]".
  3. La liste des liens s'affiche dans une nouvelle fenêtre.
  4. Dans la colonne "Intitulé du lien", pour chaque lien composite ayant un titre de lien (texte présent dans la colonne Title), vérifier si ce titre est nécessaire.
  5. Si c'est le cas, le test est validé.

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

• Pour le test 6.2.a [Bronze], le test 6.2.b [Bronze] et le test 6.2.d [Bronze] :
  1. Sous Firefox, ouvrir la page à analyser.
  2. Dans le menu "Information" de la Barre d'Outils Web Developper (version 1.1.4), activer l'option "Afficher les attributs Title".
  3. Le contenu de l'attibut title s'affiche sur un fond jaune à côté du lien.
  4. Vérifier que pour chaque lien texte / lien image / lien composite ayant un titre de lien, ce titre est nécessaire.
  5. Si c'est le cas, le test est validé.
  
  
• Pour le test 6.2.c [Bronze] :
  1. Sous Firefox, ouvrir la page à analyser.
  2. Dans le menu "Voir Source" de la Barre d'Outils Web Developper (version 1.1.4), activer l'option "Voir Source".
  3. Une nouvelle fenêtre apparaît contenant le code source de la page.
  4. En faisant une recherche sur le mot area (ctrl + f), pour chaque image réactive, vérifier que pour chaque zone cliquable ayant un titre de lien, ce titre est nécessaire.
  5. Si c'est le cas, le test est validé.

revenir en haut de la page

Comment mettre en oeuvre

Avertissement : les informations du paragraphe "Comment mettre en oeuvre" sont données à titre indicatif. Les contenus des sous-paragraphes Implémentation et Exemple de bonne pratique ne présentent pas tous les codes d'implémentation.

Qui est concerné ?

L'aspect à la fois technique et rédactionnel de ce critère implique une concertation entre le développeur du site et les personnes en charge du contenu.

Implémentation

Syntaxe générale :

<a href="mapage.html" title="contenu de l'attribut title">mon lien</a>

Exemple de mauvaise pratique

Dans l'exemple ci-dessous, un attribut title est présent, mais pas nécessaire car son contenu est identique au contenu de l'intitulé du lien.

<p>BrailleNet organise des séminaires techniques pour l'année 2006.<br />
<a href="" title="Les prochaines dates de séminaires organisés par l'association BrailleNet">
Les prochaines dates de séminaires organisés par l'association BrailleNet</a>.</p>

Le lien ci-dessous déclenche l'ouverture d'une nouvelle fenêtre sans que l'utilisateur n'en soit averti par l'utilisation appropriée d'un titre de lien :

<a href="aide.asp" onclick="return OpenWindowByTarget(this.target,this.href,500,600,0,0)" target="_blank">
Aide
</a>

Exemple de bonne pratique

En reprenant le premier exemple précédent, le contenu de l'attribut title n'est pas nécessaire pour donner des informations supplémentaires : l'intitulé du lien est lui-même suffisamment explicite.

<p>BrailleNet organise des séminaires techniques pour l'année 2006.<br />
<a href="">Les prochaines dates de séminaires organisés par l'association BrailleNet</a>.</p>

Le lien suivant déclenche l'ouverture d'une nouvelle fenêtre, ce qui est signalé par le contenu de l'attribut title.

<a href="aide.asp" onclick="return OpenWindowByTarget(this.target,this.href,500,600,0,0)" target="_blank" title="Aide (nouvelle fenêtre)">
Aide</a>

revenir en haut de la page

Illustrations

Il n'y a pas d'illustration pour cette fiche.

revenir en haut de la page

Références

• html techniques for WCAG 1.0 (section 6) : Links
• Plongez dans l'accessibilité : Ajouter des titres à vos liens

revenir au sommaire de la fiche

revenir en haut de la page

---

Guide AccessiWeb (version 3.1, 2 mars 2009) | Conditions d'utilisation | Contact
Copyright © 2009 Association BrailleNet. Tous droits Réservés.