- Success Criterion 3.1.1
- Conformance level A
Page’s Declared Language Not Matching Its Actual Content
3.1.1 — Language of Page
Scenario
Setting
A streaming music app's search results
What’s wrong
Wrong lang (template shipped lang="en" on a Hindi/Arabic/French site) — screen readers use wrong speech synthesizer.
Example
Consider a streaming music app's search results: wrong lang (template shipped lang="en" on a Hindi/Arabic/French site) — screen readers use wrong speech synthesizer.
Why it matters
Screen-reader users who need correct pronunciation, and tools that depend on language metadata. On a streaming music app's search results, that means they get garbled or unintelligible screen-reader output.
How to test
Check the html lang attribute against the page's actual content language: a template shipping lang="en" on a Hindi/Arabic/French page fails.
How to fix
The <html> element must carry a valid lang attribute matching the page language, updated when the site language switches.
Outcome
With the fix in place on a streaming music app's search results, they get accurate screen-reader output.
Who is affected
Screen-reader users who need correct pronunciation, and tools that depend on language metadata.
Learn more
- Understanding Understanding document (opens in a new tab)
Related scenarios
- Page Published With No Language Declared in the Code
- HTML Element Missing Its Language Attribute Entirely
- Language Attribute Set to an Invalid or Malformed Value
- Language Switcher That Doesn’t Update the Page’s Lang Attribute
- Language Attribute Set on the Body Instead of the HTML Root
- Multilingual Site Serving Every Locale With the Same Lang Value