onpage

Déclarez la langue de la page

MetricSpot vérifie la présence d'un attribut lang valide sur <html>. Sans lui, les lecteurs d'écran prononcent mal, hreflang perd son ancre et les outils de traduction devinent.

Ce que vérifie ce contrôle

Lit l’attribut lang sur l’élément racine <html> et vérifie qu’il s’agit d’un code de langue BCP 47 valide (en, en-US, es, de-AT, pt-PT). Le contrôle échoue quand :

  • L’attribut est absent.
  • La valeur est vide (lang="").
  • La valeur ne correspond à aucun sous-tag de langue connu.

Pourquoi c’est important

L’attribut lang est l’une des hygiènes HTML les moins coûteuses — un attribut sur un seul élément — mais son absence casse trois consommateurs différents d’un coup.

  • Les lecteurs d’écran changent de voix / moteur de prononciation selon lang. Une page française avec lang="en" est lue par la voix anglaise qui prononce mal chaque mot. NVDA, JAWS, VoiceOver et TalkBack se comportent tous ainsi.
  • La traduction du navigateur (« Traduire cette page » de Chrome, menu de traduction de Safari) utilise lang comme langue source. Sans lang, elle doit deviner d’après le contenu, ce qui est plus lent et moins fiable sur les pages courtes.
  • Ancres hreflang. Vos balises <link rel="alternate" hreflang="…"> ont besoin d’une auto-déclaration sur la page racine — la documentation de Google recommande explicitement de déclarer lang sur chaque page pour corroborer le réseau hreflang.
  • SEO. Google utilise lang parmi plusieurs signaux pour décider du pays/langue à associer à la page. Le rapport « Ciblage international » de Search Console signale les pages sans lang.
  • Extraction par IA. Les systèmes LLM multilingues découpent le contenu en utilisant la langue déclarée comme indice. Un lang mal déclaré abaisse le score de confiance du chunk.

Comment le corriger

Définissez lang sur l’élément <html>. Utilisez un code de langue à deux lettres pour du contenu général, ou langue-région si votre contenu est spécifique à une région :

<!DOCTYPE html>
<html lang="fr">
…
<html lang="pt-PT">  <!-- Portugais européen, distinct du pt-BR -->

Sites multilingues — déclarez par page. Le lang sur <html> doit correspondre au contenu principal de la page, pas à la langue par défaut de votre site. Si vous avez une traduction espagnole sur /es/, cette page a besoin de <html lang="es">, pas <html lang="en">.

Astro :

---
const { lang = "en" } = Astro.props;
---
<html lang={lang}>

Puis passez lang="es" depuis votre layout espagnol.

Next.js (App Router) :

// app/layout.tsx
export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>{children}</body>
    </html>
  );
}

Routes par locale : séparez en app/[locale]/layout.tsx et lisez la locale depuis les params.

WordPress : l’élément <html> est généré par l’appel language_attributes() de votre thème, qui lit la langue du site depuis Réglages → Général. Le template fait déjà ça — l’échec signifie presque toujours que le thème a écrasé header.php et supprimé l’appel. Remettez <html <?php language_attributes(); ?>>.

Contenu en plusieurs langues. Si un paragraphe ou un bloc est dans une langue différente de la page, déclarez-le inline :

<p>Les Anglais l'appellent <span lang="en">the mot juste</span>.</p>

Les lecteurs d’écran changent de voix pour le span, puis reviennent à la précédente.

Auditez vous-même : DevTools → Console → document.documentElement.lang → devrait renvoyer "fr", pas "".

Questions fréquentes

Faut-il utiliser en ou en-US ?

Utilisez en sauf si votre contenu est spécifiquement en anglais américain (ou spécifiquement britannique, australien, etc.) et que cela compte pour la traduction/prononciation. en couvre toutes les variantes d’anglais ; en-US les restreint. Pour la plupart des sites, le tag plus large est le bon choix.

Quelle est la différence entre lang et xml:lang ?

lang est pour HTML, xml:lang est pour XML (et XHTML). Les pages HTML5 modernes n’ont besoin que de lang. N’ajoutez pas les deux — c’est juste du bruit.

Mon CMS met lang="en-US" partout. Est-ce faux ?

Pas faux ; c’est juste plus étroit que nécessaire. Pour les sites ciblant les États-Unis, laissez. Pour les sites avec une audience anglophone mondiale, passez à en simple.

Sources

Dernière mise à jour 2026-05-11