Les quatre principes WCAG
Les WCAG (Web Content Accessibility Guidelines) reposent sur quatre principes : perceptible, utilisable, compréhensible et robuste. Ceux-ci s’appliquent indépendamment de la langue du contenu. Perceptible signifie que toutes les informations peuvent être perçues par les utilisateurs ayant des déficiences visuelles ou auditives. Utilisable garantit que toutes les fonctions sont accessibles au clavier et sans contrainte de temps. Compréhensible exige un langage clair et une navigation cohérente. Robuste assure la compatibilité avec les technologies d’assistance. Pour les sites web internationaux, ces principes doivent être mis en œuvre de manière identique dans chaque version linguistique.
Marquage de la langue avec l'attribut lang
L'attribut lang dans l'élément HTML indique la langue naturelle d'une page ou d'une section. Les lecteurs d'écran utilisent cet attribut pour choisir la prononciation et l'accentuation correctes. Pour les sites multilingues, l'attribut lang doit être défini correctement sur la page principale et lors des changements de langue dans le texte. Par exemple : <html lang="de"> pour l'allemand et <span lang="en"> pour les passages en anglais. Si cet attribut manque, l'utilisation du site peut être considérablement entravée pour les personnes malvoyantes. Vérifiez donc chaque variante linguistique pour une attribution complète et correcte.
Contrastes et couleurs
Des contrastes suffisants entre le texte et l'arrière-plan sont essentiels pour la lisibilité. Le niveau AA des WCAG exige un rapport de contraste d'au moins 4,5:1 pour le texte normal et de 3:1 pour le texte de grande taille. Cela s'applique à toutes les langues d'un site web. Évitez les distinctions basées uniquement sur la couleur pour transmettre une information, car les utilisateurs daltoniens ne peuvent pas les percevoir. Utilisez plutôt des symboles ou des marquages textuels. Les schémas de couleurs doivent également être vérifiés dans toutes les versions locales, car les associations culturelles peuvent varier. Testez vos pages avec des outils d'analyse de contraste pendant le développement.
Navigation au clavier
Tous les éléments interactifs doivent être accessibles et utilisables via le clavier. Cela concerne les liens, les boutons, les champs de formulaire et les menus. Le focus doit être visible, idéalement avec un cadre de focus bien marqué. Évitez les éléments qui ne fonctionnent qu'avec la souris ou le tactile. En particulier sur les sites internationaux avec des navigations complexes, la navigation au clavier doit être testée dans chaque version linguistique. Les contenus dynamiques comme les fenêtres modales doivent gérer correctement le focus. Assurez-vous que l'ordre des éléments dans le DOM correspond à l'ordre logique et n'est pas déterminé uniquement par le CSS.
Textes alternatifs dans des contextes multilingues
Les textes alternatifs décrivent les images pour les lecteurs d'écran et doivent être rédigés dans la langue de la page environnante. Pour les sites web multilingues, cela signifie que chaque image reçoit un texte alternatif dans la version linguistique correspondante. N'utilisez pas de traductions automatiques, mais créez des descriptions appropriées pour chaque groupe cible. Les graphiques contenant du texte doivent restituer ce texte comme texte alternatif. Les images décoratives reçoivent un texte alternatif vide (alt="") afin qu'elles soient ignorées par les technologies d'assistance. Cette approche garantit que le contenu reste accessible dans toutes les langues.
