- Success Criterion 3.1.1
- Conformance level A
Language Switcher That Doesn’t Update the Page’s Lang Attribute
3.1.1 — Language of Page
Scenario
Setting
A hospital's patient portal appointment scheduler
What’s wrong
single-page app localization switching UI language without updating document.documentElement.lang.
Example
<html>Why it matters
Screen-reader users who need correct pronunciation, and tools that depend on language metadata.
How to test
Switch the site's UI language and check document.documentElement.lang in DevTools console: if it doesn't update to match, it fails.
How to fix
The <html> element must carry a valid lang attribute matching the page language, updated when the site language switches.
<html lang="en">The lang attribute tells screen readers which pronunciation and language rules to apply to the whole page.
Outcome
On a hospital's patient portal appointment scheduler, this barrier is gone for screen-reader users who need correct pronunciation — they reach the same outcome without extra effort.
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
- Page’s Declared Language Not Matching Its Actual Content
- Language Attribute Set to an Invalid or Malformed Value
- Language Attribute Set on the Body Instead of the HTML Root
- Multilingual Site Serving Every Locale With the Same Lang Value