Langue de la page absente : la correction en un attribut

Les lecteurs d'écran ne se contentent pas de lire du texte à voix haute : ils appliquent tout un moteur de prononciation réglé sur la phonétique d'une langue donnée. Faute de savoir dans quelle langue une page est rédigée, la plupart basculent sur une langue par défaut (souvent l'anglais américain), ce qui déforme la prononciation de toutes les autres : français, allemand, ukrainien, japonais - tous lus avec des règles phonétiques anglaises, pour un résultat allant du légèrement faux au parfaitement inintelligible.

Les données du secteur situent ce problème autour de 42 % des plaintes d'accessibilité web fondées sur l'ADA. C'est le critère de succès 3.1.1 des WCAG (Langue de la page), une exigence de niveau A, et c'est à peu près la correction la plus simple qui existe en accessibilité.

La correction

Ajoutez un attribut lang à l'élément <html>, avec un code de langue BCP 47 valide :

<!-- Avant -->
<html>

<!-- Après -->
<html lang="fr">

Codes courants : fr (français), en (anglais), de (allemand), es (espagnol), uk (ukrainien), ja (japonais). Les variantes régionales fonctionnent également - fr-CA pour le français canadien, en-GB pour l'anglais britannique - même si le code à deux lettres suffit à corriger la non-conformité.

La vérification voisine : la langue des passages

Si une page mêle réellement plusieurs langues - un article en français citant un paragraphe en anglais, par exemple - le critère 3.1.2 des WCAG (Langue d'un passage, niveau AA) demande que la portion concernée soit elle aussi signalée, afin que le lecteur d'écran change de moteur de prononciation en cours de page :

<p>Comme disent les Anglais, <span lang="en">better safe than sorry</span>.</p>

C'est une correction plus ciblée et moins souvent nécessaire que l'attribut lang de la page : la plupart des sites n'ont qu'à régler correctement le <html lang="...">, et seuls les sites riches en contenus multilingues doivent penser à signaler chaque passage.

Pourquoi commencer par celle-ci

Définissez la langue de la page dans la mise en page partagée lorsque c'est pertinent, puis vérifiez le rendu des pages. Les pages multilingues et les changements de langue à l'intérieur d'une page demandent leur propre examen : une seule modification de gabarit ne résout pas nécessairement tous les cas.

Références officielles

• Deque University : html-has-lang
• Technique W3C H57