HTML and XML Language Attribute Mismatch
Rule ID: html-xml-lang-mismatch
Ruleset: axe-core 4.10
User Impact: Moderate
Guidelines: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), EN 301 549
How to Fix the Problem
To resolve this issue, follow these steps:
-
Add a
lang
Attribute to the HTML Element
Every HTML document must include alang
attribute in the<html>
tag to indicate the primary language of the content.
Example: -
Match the
xml:lang
Attribute (if used)
If you’re also using thexml:lang
attribute for XML compatibility, ensure that its value matches thelang
attribute exactly.
Example: -
Use Correct Language Codes
Use valid ISO 639 language codes. You can specify dialects if necessary:-
en-US
for American English -
en-GB
for British English -
fr-CA
for Canadian French -
es-MX
for Mexican Spanish
Refer to the ISO 639 language codes list for a comprehensive guide.
-
-
Support Multilingual Content
For documents that include multiple languages, mark those sections appropriately: -
Set Text Direction When Required
For right-to-left languages such as Arabic or Hebrew, use thedir="rtl"
attribute:For left-to-right languages (which is the default), you can specify
dir="ltr"
if needed.
Why it Matters
Setting the correct language attributes is vital for assistive technologies such as screen readers. Here’s why:
-
Screen Reader Accuracy: Screen readers rely on language settings to choose the correct pronunciation rules and voice profiles. Without a specified language, the screen reader defaults to the user’s preset language, which can result in garbled, unintelligible output.
-
Multilingual Accessibility: Documents with multiple languages need accurate tagging to switch between the correct voice engines. For example, reading Spanish text with an English voice engine can confuse users and hinder comprehension.
-
Inclusive Experience: Users who speak more than one language or who rely heavily on screen readers will benefit from accurate language tagging, enhancing usability and inclusivity.
Rule Description
The html
element in any HTML document must include a valid lang
attribute that accurately describes the primary language of the content. If the xml:lang
attribute is also present (used primarily in XHTML or XML-compliant documents), its value must exactly match the lang
attribute to avoid inconsistencies in language interpretation by user agents.
The Algorithm (in Simple Terms)
-
Check the
<html>
tag for alang
attribute. -
Validate that the
lang
value is not empty and conforms to a valid ISO language code. -
If
xml:lang
is present, ensure it matches thelang
value exactly.