Les pages Web utilisent des liens qui dirigent les visiteurs vers un nouveau contenu ou un contenu supplémentaire. Ces liens peuvent se présenter sous la forme de texte et d'images. Les liens sont de puissants outils de navigation. Pour une expérience optimale, ils doivent être correctement structurés.
Les directives pour l'accessibilité aux contenus Web (WCAG) sont des exigences spécifiques définies pour s'assurer que le contenu est accessible à tous. Selon les Directives WCAG 2.2 AA, les liens doivent préciser leur objectif afin que les visiteurs puissent décider s'ils veulent le suivre. Les liens doivent comporter du texte perceptible qui indique aux visiteurs où ils seront redirigés.
Qu'entend-on par « texte perceptible » ?
Les liens comportent généralement deux informations :
- Une URL : adresse Web vers laquelle le lien redirige les visiteurs qui le sélectionnent.
- Le texte affiché : texte visible qui indique aux visiteurs ce qu'ils vont trouver en accédant au lien.
Prenons le lien suivant en guide d'exemple de bonnes pratiques : Bonnes pratiques pour les liens. En code source HTML, le lien idéal ressemble à ceci :<a href="#best-practices">Best practices for links</a>
Lorsqu'aucun texte à afficher n'est spécifié (entre les balises <a>), le lien ne comporte pas de texte perceptible. Le texte perceptible est le texte qui indique à vos visiteurs l'objectif du lien.
L'absence de texte perceptible dans les liens est un problème mineur. Pour une expérience optimale, résolvez les problèmes mineurs. Les liens qui ne comportent pas de texte ou dont le texte est vague peuvent prêter à confusion et être source de frustration pour les personnes souffrant de handicap.
Ally vous aide à identifier les cas où les liens ne comportent pas de texte et vous explique comment résoudre ce problème. Ally effectue les vérifications suivantes :
- Les balises de lien hypertexte <a> renferment-elles du texte ?
- Le texte présent entre les balises <a> est-il masqué ?
- Les images utilisées en tant que liens proposent-elles des descriptions alternatives ?
Si Ally constate une erreur lors de l'une de ces vérifications, il indique que le lien pose problème.
Utiliser Ally pour trouver les liens ne comportant pas de texte
Utilisez le rapport d'accessibilité d'Ally pour identifier et résoudre les problèmes d'accessibilité de votre site. Utilisez le lien fourni pour le rapport et connectez-vous. Ouvrez le rapport et consultez la liste des problèmes dans le tableau Problèmes d'accessibilité.
Le tableau Problèmes d'accessibilité se trouve à la fois dans les onglets Présentation et Domaine. Ouvrez d'abord l'onglet Domaine pour consulter les problèmes spécifiques à un domaine.
Les liens qui ne comportent pas de texte perceptible sont signalés comme présentant un problème mineur. Consultez l'onglet Mineur du tableau Problèmes d'accessibilité pour afficher la liste des problèmes mineurs. Sélectionnez les problèmes concernant les liens sans texte perceptible.
Si vous démarrez dans l'onglet Présentation, sélectionnez le problème, puis le domaine concerné.
Depuis la liste des problèmes de titre du domaine en question, sélectionnez l'indicateur de résultat en regard d'un élément présentant le problème. Le volet de feed-back d'éditeur de contenu s'ouvre.
Afficher l'aperçu des liens ne comportant pas de texte
Le volet de feed-back Ally vous offre un aperçu du contenu, ainsi qu'un feed-back détaillé et une assistance pour vous aider à résoudre vos problèmes d'accessibilité. Utilisez l'aperçu pour afficher les liens sans texte.
L'aperçu indique où surviennent les problèmes d'accessibilité spécifiques rencontrés dans le document. Les surbrillances indiquent chaque occurrence d'un problème, un type de problème à la fois. Par exemple, pour le problème des liens qui ne comportent pas de texte, l'aperçu indique en surbrillance toutes les instances présentant ce problème spécifique.
Outils d'aperçu
Utilisez les outils de l'aperçu pour explorer les problèmes dans votre document.
- Permettent de parcourir l'aperçu du document page par page.
- Indiquent le nombre de fois où un problème spécifique apparaît dans le document.
- Permettent de passer d'un problème à l'autre.
- Permettent de masquer ou d'afficher les surbrillances.
- Permettent d'effectuer un zoom avant ou arrière sur le contenu d'aperçu.
- Si le problème se trouve dans un document joint, permettent de télécharger le fichier d'origine.
Suivre les étapes guidées d'Ally pour ajouter du texte de lien
Ally suppose que vous avez des connaissances de base en HTML et que vous savez utiliser votre système de gestion de contenu (CMS). Pour suivre les étapes guidées, vous devez savoir comment modifier une page Web dans le code HTML ou dans le code source de votre CMS.
En plus de l'aperçu, Ally vous donne des conseils pas-à-pas sur la résolution du problème. Ally organise ce feed-back sous forme d'arbre décisionnel : lisez les instructions et répondez aux invites du système. Prenez connaissance du problème, identifiez en quoi il est important et voyez comment le résoudre de façon appropriée.
Sélectionnez Comment corriger le problème de texte manquant dans les liens ? pour suivre les étapes guidées.
Méthodes d'ajout de texte à des liens
Il existe plusieurs façons de corriger le problème de texte manquant dans les liens de vos pages Web.
- HTML : Les instructions pas-à-pas d'Ally vous guident dans la procédure de recherche et de correction du texte manquant des liens dans le code HTML. En résumé : recherchez la page Web contenant le lien. Modifiez la page. Dans le code HTML, ajoutez du texte entre les balises <a>. Enregistrez la page.
- RTE : certains CMS disposent d'un éditeur de texte enrichi (RTE) qui peut vous fournir des méthodes conviviales de correction des liens. Recherchez le lien sur la page Web. Sélectionnez le lien et ajoutez du texte à l'aide des outils CMS. Enregistrez la page.
Consultez le site Web w3schools pour en savoir plus sur les langages HTML et CSS.
Bonnes pratiques pour les liens
- Le texte du lien doit avoir du sens. Indiquez à vos visiteurs la destination du lien. Décrivez ce à quoi l'utilisateur doit s'attendre à voir en cliquant sur le lien.
- Évitez un texte tel que « cliquez ici » ou « voir plus ». Ces phrases n'indiquent pas aux visiteurs ce qu'ils vont trouver en cliquant sur le lien. Certaines technologies d'assistance proposent un outil qui répertorie uniquement les liens de la page. Des phrases telles que celles-ci n'ont aucun sens une fois sorties du contexte de la page et répertoriées dans une liste.
- Évitez d'utiliser des URL comme texte visible d'un lien. Une URL peut ne pas être descriptive. Par ailleurs, les lecteurs d'écran lisent individuellement chaque lettre d'une URL, ce qui peut être frustrant pour les visiteurs qui les utilisent.
- Le texte du lien doit être unique. Chaque lien doit être unique pour se distinguer des autres liens de la page. La répétition du texte de liens peut prêter à confusion une fois les liens sortis du contexte de la page et affichés dans l'outil qui répertorie les liens.
- Les liens doivent être clairement visibles. Le lien doit s'afficher clairement comme tel. Si vous n'aimez pas le style du lien, il vous faudra peut-être mettre à jour le modèle.
Différenciez les liens du texte environnant par un moyen autre que la couleur uniquement. WCAG 2.1 - 1.4.1
L'apparence des liens est souvent définie dans le Guide de style d'un site et peut refléter une image de marque. Avant d'apporter des modifications, consultez le Guide de style et l'administrateur de votre site.
- Indiquez aux utilisateurs si le lien s'ouvre dans une nouvelle fenêtre. L'ouverture de liens dans une nouvelle fenêtre peut désorienter l'utilisateur. Faites savoir à vos utilisateurs si vous les envoyez vers une nouvelle fenêtre ou un nouvel onglet.
- N'utilisez pas une image pour représenter quelque chose que vous pouvez créer dans le code HTML. Par exemple, n'utilisez pas l'image d'un bouton au lieu d'un bouton réel. N'utilisez pas une image de tableau au lieu d'un tableau créé dans le code source HTML.
Utilisation des liens par les personnes handicapées
Des liens bien construits, qui contiennent un lien et un texte de lien pertinent, offrent une bien meilleure expérience à chacun. Des liens bien formés sont de puissants outils de navigation qui permettent de savoir clairement à quoi s'attendre. Plus encore, des liens adéquats sont essentiels pour les visiteurs qui ont une déficience visuelle.
Les liens qui ont un texte unique et dont le sens est clair assurent une navigation rapide pour un grand nombre d'utilisateurs.
- Les utilisateurs de lecteurs d'écran n'ont pas besoin d'écouter la page entière, mais peuvent choisir d'écouter et d'interagir avec une liste de liens.
- Les personnes qui utilisent la reconnaissance vocale interagissent avec les liens en prononçant à voix haute le lien qu'ils souhaitent sélectionner.
Des liens bien construits sont plus faciles à identifier et à utiliser pour un grand nombre d'utilisateurs.
- Les utilisateurs qui naviguent uniquement à l'aide du clavier, et qui ne peuvent pas peut-être pas utiliser la souris, peuvent naviguer vers les différents éléments de la page, dont les liens, à l'aide du clavier.
- Les personnes daltoniennes peuvent ne pas distinguer les variations de couleur, mais voient un lien souligné.