AccessLint Rule: The lang and xml:lang attributes on <html> must match.

About this AccessLint rule

When an HTML document includes both lang and xml:lang attributes on the <html> element, the two values must specify the same base language. If they differ, assistive technologies may not know which language declaration to trust. A screen reader could select the wrong speech synthesis voice, mispronouncing content throughout the entire page. This affects every screen reader user who visits the page.

The lang attribute is the standard way to declare a page's language in HTML5. The xml:lang attribute comes from XHTML and is only needed when serving documents as XML (with an application/xhtml+xml content type). In practice, most HTML5 pages do not need xml:lang at all. When both attributes are present, though, they must agree.

Why this matters

WCAG success criterion 3.1.1 (Language of Page) at Level A requires that the default human language of a page can be programmatically determined. Screen readers rely on the language declaration to load the correct pronunciation rules. A mismatch between lang and xml:lang creates ambiguity: the screen reader may pick one value over the other depending on the browser or the assistive technology in use. The result is unpredictable behavior, and potentially an entire page read aloud in the wrong language.

How to fix it

The simplest fix is to remove the xml:lang attribute entirely. HTML5 documents do not require it. If the document must be valid XHTML (served as application/xhtml+xml), keep both attributes but set them to the same language code.

Make sure the base language matches. For example, lang="en-US" and xml:lang="en-GB" are a mismatch even though both are English variants; the values must be identical.

Examples

Mismatched language attributes

The lang attribute says French, but xml:lang says English. A screen reader cannot reliably determine which is correct.

<!DOCTYPE html>
<html lang="fr" xml:lang="en">
  <head>
    <meta charset="utf-8">
    <title>Exemple</title>
  </head>
  <body>
    <p>Bonjour le monde</p>
  </body>
</html>

Fixed: remove xml:lang (preferred for HTML5)

Dropping xml:lang removes the ambiguity. The lang attribute alone is sufficient for HTML5.

<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="utf-8">
    <title>Exemple</title>
  </head>
  <body>
    <p>Bonjour le monde</p>
  </body>
</html>

Fixed: both attributes with matching values

If both attributes are needed (for example, in an XHTML document), they must have the same value.

<!DOCTYPE html>
<html lang="fr" xml:lang="fr">
  <head>
    <meta charset="utf-8">
    <title>Exemple</title>
  </head>
  <body>
    <p>Bonjour le monde</p>
  </body>
</html>