About This Accessibility Rule
Screen readers rely on language-specific sound libraries to pronounce text accurately. Each language has its own pronunciation rules, intonation patterns, and phonetic characteristics, so screen readers load the appropriate library based on the declared language of the document. When the <html> element has no lang attribute or contains an invalid value — such as a misspelling or a fabricated code — the screen reader cannot determine which library to use. It defaults to whatever language the user configured during setup, which means content written in French might be read aloud using English pronunciation rules. The result is speech that sounds like a confusing, unintelligible accent.
This issue primarily affects blind users and deafblind users who rely on screen readers, but it also impacts users with cognitive disabilities who may use text-to-speech tools to aid comprehension. When pronunciation is wrong, understanding drops dramatically.
Related WCAG Success Criteria
This rule maps to WCAG Success Criterion 3.1.1: Language of Page (Level A), which requires that the default human language of each web page can be programmatically determined. This is a Level A requirement — the most fundamental level of accessibility — meaning it must be satisfied for basic compliance under WCAG 2.0, 2.1, and 2.2. It is also required by the Trusted Tester methodology, EN 301 549, and RGAA.
How to Fix It
-
Add a
langattribute to the opening<html>element. - Set its value to a valid BCP 47 language tag that represents the primary language of the page.
-
Double-check the spelling of the language code. Common valid codes include
"en"(English),"fr"(French),"es"(Spanish),"de"(German),"ja"(Japanese), and"ar"(Arabic). -
You can optionally include a regional subtag, such as
"en-US"for American English or"fr-CA"for Canadian French. -
For XHTML documents served as XML, use
xml:langinstead of or in addition tolang.
If the language changes within the document for specific passages, use the lang attribute on the appropriate element to indicate the switch. For right-to-left languages, also include the dir="rtl" attribute.
Examples
Incorrect: Missing lang attribute
<html>
<head>
<title>My Page</title>
</head>
<body>
<p>Welcome to my website.</p>
</body>
</html>
Without a lang attribute, screen readers cannot determine the page language and will default to the user’s configured language, which may not match the content.
Incorrect: Invalid lang value
<html lang="english">
<head>
<title>My Page</title>
</head>
<body>
<p>Welcome to my website.</p>
</body>
</html>
The value "english" is not a valid BCP 47 language tag. The correct code for English is "en".
Correct: Valid lang attribute
<html lang="en">
<head>
<title>My Page</title>
</head>
<body>
<p>Welcome to my website.</p>
</body>
</html>Correct: Regional subtag
<html lang="fr-CA">
<head>
<title>Ma page</title>
</head>
<body>
<p>Bienvenue sur mon site web.</p>
</body>
</html>Correct: Language change within the page
<html lang="en">
<head>
<title>Multilingual Page</title>
</head>
<body>
<p>This paragraph is in English.</p>
<p lang="es">Este párrafo está en español.</p>
</body>
</html>Correct: Right-to-left language
<html lang="ar" dir="rtl">
<head>
<title>صفحتي</title>
</head>
<body>
<p>مرحبا بكم في موقعي.</p>
</body>
</html>
The dir="rtl" attribute ensures the text direction is correctly rendered for right-to-left languages like Arabic and Hebrew.
Help us improve our guides
Detect accessibility issues automatically
Rocket Validator scans thousands of pages with Axe Core and the W3C Validator, finding accessibility issues across your entire site.