October 28, 2026·8 min read
The HTML lang Attribute: One Line Screen Readers Need
HTML lang attribute accessibility starts with one line on the html element. Set the page language, then mark any passage written in another language.
HTML lang attribute accessibility starts with a line visitors never see. A screen reader does not guess the language of a page from the words on it. It reads the language value in the code, then loads the pronunciation rules for that language. When that value is missing or wrong, the reader can pronounce every word with the rules of the wrong language.
WCAG success criterion 3.1.1, Language of Page, at Level A, states that the default human language of each web page can be programmatically determined. Software must be able to read the page language from the code, not infer it from the text. The usual way to do that in HTML is the lang attribute on the html element.
Key takeaways
- Set
langon thehtmlelement on every page, using the language most of the page is written in. - Use a valid BCP 47 language tag, such as
en,fr, ores. Do not invent a code, and do not leave the value blank. - Mark any passage in a different language with
langon the closest element that holds that passage. - Skip the extra marking for proper names and for single words that already belong to the surrounding language.
- Check the value in view source. A missing or wrong value is visible in seconds, and the fix is one line.
What a screen reader does with lang
A screen reader turns text into speech, and speech needs pronunciation rules. English, French, and Spanish do not share the same rules for the same letters, so the reader has to know which set to use before it starts. The lang value tells it. W3C notes that screen readers can load the correct pronunciation rules when the page language is identified.
A wrong value can be worse than a missing value. A missing value leaves the reader to fall back to its default voice. A wrong value sends it to the wrong voice on purpose: a French page tagged as English will be read with English pronunciation rules, even when every word is spelled right.
Set the page language first
The page language goes on the html element, at the top of the document. For a page written in English, the line is:
<html lang="en">
For a page written in French, it is:
<html lang="fr">
Use the language that most of the page is written in. W3C states that when a page uses several languages, the default text processing language is the language used most, and that if several languages are used equally, the first language used should be chosen as the default. The main language still wins the html element, and the short passage gets its own marking, covered below.
Keep the value simple. en says English, while en-GB and en-US name a regional variety. A region subtag is valid, but it is not required for most pages.
Wrong values, and the correction for each
Most lang faults fall into a short list. Use this table as a checklist when you open a template.
| Fault | What it looks like | Correction |
|---|---|---|
| No lang at all | <html> with no attribute |
Add lang with the main language, such as lang="en" |
| Empty value | <html lang=""> |
Replace the empty value with the main language |
| Invented code | <html lang="sp"> for Spanish |
Use the real code, lang="es" |
| Wrong language | A Spanish page tagged lang="en" |
Change the value to the language the page is written in |
| Language in the wrong place only | A meta tag or header naming the language, but no lang on html |
Add lang to the html element; do not rely on the header alone |
Two notes on that table. First, sp is a common mistake for Spanish; the code is es. Second, an empty value is not the same as a missing value: MDN says an empty string sets the language to unknown, and unknown is not a fix. A Content-Language header describes the intended audience, not the language the document is written in, so it does not replace lang.
These faults usually come from a theme or a starter template. A theme can ship with no lang at all, or with a hard coded en that stays in place after the site is translated. After any translation job, check the html element on a translated page.
Passages in another language: WCAG 3.1.2
The page value covers the main language. It does not cover a passage in a different language inside that page. That is the job of WCAG success criterion 3.1.2, Language of Parts, at Level AA. It states that the human language of each passage or phrase in the content can be programmatically determined, with exceptions for proper names, technical terms, words of indeterminate language, and words or phrases that have become part of the vernacular of the surrounding text.
Put lang on the closest element that holds the passage. For a French paragraph inside an English page:
<p lang="fr">Ce paragraphe est en francais.</p>
For a short phrase inside a sentence, use a span:
<p>He closed with the French phrase <span lang="fr">a tout a l'heure</span>, then left.</p>
W3C gives the same pattern with a German phrase inside an English sentence, marked with lang="de" on a span. Without the marking, the reader keeps the English rules and pronounces the French words as if they were English words.
Do not over mark. Proper names do not need a language change, and a borrowed word that English readers already pronounce as English, such as rendezvous, does not need marking either, since W3C counts it as part of the vernacular of the surrounding text. Mark a passage when the pronunciation changes and that change matters for understanding. The same care applies to language menus: a link that reads Deutsch should carry lang="de", and one that reads Espanol should carry lang="es".
How to check your site in five minutes
You do not need a screen reader for the first check. You need view source and a short list.
- Open a page in a browser, right click, and choose View page source.
- Find the first line that starts with
<html. Read thelangvalue next to it. - Ask: is there a value, is it a real BCP 47 code, and does it match the language most of the page is written in?
- Repeat the check on a second template, such as a blog post, and on one translated page if your site has translations.
- Search the page source for
lang=and read each value. A passage value in a language that does not appear on the page is a copy error.
Fix the fault at the source, not on one page. A theme file, a layout file, or a translation setting is the usual source, and fixing one page while the template still writes the wrong value means the fault returns with the next page you publish.
How Axeazy helps with this exact issue
Axeazy lists language attributes among the 14 fix categories it works on. Read the honest scope on the capabilities page, and read how the scan works to see how findings are recorded with a date and time. For WordPress sites, the free plugin adds lang to the html element when a theme omits it. Read the details on the WordPress plugin page.
For related reading, see the WordPress skip link guide, which covers another fix the same plugin applies at activation. The view source check above catches a wrong value that a visual check cannot show.
Want a quick read on your own site? Run Axeazy's free 60 second scan . It needs no signup.
Last checked: October 28, 2026.
FAQ
What happens if a page has no lang attribute at all?
A screen reader falls back to its default voice and pronunciation rules, which may not match the language the page is written in. Adding the right value to the html element fixes the page level fault in one line.
Is lang="en-US" better than lang="en"?
Not for most pages. Both are valid BCP 47 tags, and both tell the reader the text is English. The plain code en leaves the voice choice to the reader's own settings, while a region code narrows it to one variety.
Do I need to mark a single foreign word in a sentence?
Usually no. WCAG 3.1.2 excepts proper names, technical terms, words of indeterminate language, and words that have become part of the vernacular of the surrounding text. Mark a passage when the pronunciation changes and that change matters for understanding.
My site is translated into three languages. Do I set lang once for the whole site?
No. Set it once per page, on that page's html element, in the language that page is written in. A single hard coded value across all pages will be wrong on every translated page, so check the theme setting that writes the value.
Sources
- W3C Understanding Success Criterion 3.1.1: Language of Page, checked October 28, 2026
- W3C Understanding Success Criterion 3.1.2: Language of Parts, checked October 28, 2026
- W3C Technique H57: Using the language attribute on the HTML element, checked October 28, 2026
- MDN: lang HTML global attribute, checked October 28, 2026
- Axeazy capabilities page, checked October 28, 2026
- Axeazy WordPress plugin page, checked October 28, 2026
Check your own site
See what is actually wrong with your site.
Free, 60 second WCAG 2.2 AA scan. No credit card required.
Scope of every report we ship: SCOPE LIMITATION: This report documents violations identified by automated WCAG 2.2 AA scanning using axe-core v4.11.0. Automated tools cannot test every WCAG criterion; many criteria require manual review. This report does not constitute legal advice, guarantee ADA compliance, or protect against legal action. ADA compliance is a legal determination made by courts. For full WCAG conformance assessment, engage an IAAP-certified accessibility professional.