- Success Criterion 3.1.1
- Conformance level A
Language Attribute Set on the Body Instead of the HTML Root
3.1.1 — Language of Page
Scenario
Setting
A university's online course catalog
What’s wrong
lang on <body> instead of <html> in contexts where assistive technology reads the root.
Example
Watch a university's online course catalog closely and you'll spot this: lang on <body> instead of <html> in contexts where assistive technology reads the root.
Why it matters
Screen-reader users who need correct pronunciation, and tools that depend on language metadata. In this case (a university's online course catalog), they get garbled or unintelligible screen-reader output.
How to test
Check DevTools: if lang is set on body instead of html, some assistive technology reading the root element won't pick it up correctly.
How to fix
The <html> element must carry a valid lang attribute matching the page language, updated when the site language switches.
Outcome
Once corrected, a university's online course catalog lets them 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
- Page’s Declared Language Not Matching Its Actual Content
- Language Attribute Set to an Invalid or Malformed Value
- Language Switcher That Doesn’t Update the Page’s Lang Attribute
- Multilingual Site Serving Every Locale With the Same Lang Value