What does the html lang attribute do?

It tells assistive technology and browsers which language the page is written in, so a screen reader uses the correct voice and pronunciation engine instead of guessing.

How do I fix a missing page language?

Add a `lang` attribute to the ` ` element with the correct BCP 47 language code — for example en for English or de for German. For mixed-language content, mark individual passages with their own `lang`.

Which WCAG criterion requires a page language?

SC 3.1.1 (Language of Page), Level A. axe-core reports it as `html-has-lang`.

Common Violations

Missing Page Language: The One-Attribute Fix

Screen readers don't just read text out loud — they apply an entire pronunciation engine tuned to a specific language's phonetics. Without being told which language a page is in, most screen readers fall back to a default (often US English), which mangles the pronunciation of every other language: French, German, Ukrainian, Japanese — all read with English phonetic rules, producing something between mildly wrong and completely unintelligible.

Industry data puts this at roughly 42% of ADA web accessibility complaints. It's WCAG Success Criterion 3.1.1 (Language of Page), a Level A requirement, and it's about as close to a one-line fix as accessibility issues get.

The fix

Add a lang attribute to the <html> element, using a valid BCP 47 language code:

<!-- Before -->
<html>

<!-- After -->
<html lang="en">

Common codes: en (English), uk (Ukrainian), de (German), fr (French), es (Spanish), ja (Japanese). Region variants work too — en-GB for British English, en-US for American English — though the base two-letter code alone is sufficient to fix the core violation.

If a single page genuinely mixes languages — an English article that quotes a paragraph in French, for instance — WCAG 3.1.2 (Language of Parts, Level AA) asks that the specific mixed-language section be marked too, so the screen reader can switch its pronunciation engine mid-page:

<p>As the French say, <span lang="fr">c'est la vie</span>.</p>

This is a narrower, less commonly-needed fix than the page-level lang attribute — most sites only need to get the top-level <html lang="..."> right, and only content-heavy multilingual sites need to think about marking individual sections.

Why this one is worth fixing first

Because it's mechanically trivial (one attribute, one line, zero design or layout impact) and appears on literally every page of a site if it's missing from the base template, this is often the single highest-leverage fix available on a first audit — fixing it once in a shared layout file resolves the violation site-wide instantly.

Official references

Common questions

What does the html lang attribute do?: It tells assistive technology and browsers which language the page is written in, so a screen reader uses the correct voice and pronunciation engine instead of guessing.
How do I fix a missing page language?: Add a `lang` attribute to the `<html>` element with the correct BCP 47 language code — for example en for English or de for German. For mixed-language content, mark individual passages with their own `lang`.
Which WCAG criterion requires a page language?: SC 3.1.1 (Language of Page), Level A. axe-core reports it as `html-has-lang`.

Want to see how your own site scores?

Run a free accessibility scan