<html> needs lang

ZMD013

The root <html> element must include a valid lang attribute (BCP 47 tag) to identify the page’s primary language.

✅ Good

<!DOCTYPE html>
<html lang="en">
  <head>…</head>
  <body>…</body>
</html>

❌ Bad

<!DOCTYPE html>
<html>
  <head>…</head>
  <body>…</body>
</html>

When: The <html> element has no lang attribute or it is empty

Warning: <html> element missing lang attribute

Solution: Specify the document language in the lang attribute (e.g., lang="en").

Why it matters

Accessibility: Without lang, screen readers may mispronounce content or apply incorrect reading rules :contentReference[oaicite:7]{index=7}.

SEO: Search engines lack language metadata, potentially lowering international indexing quality :contentReference[oaicite:8]{index=8}.

In brief

  • Goal: Programmatically define the page’s language for assistive technologies.
  • What to do: Add a lang attribute (e.g., lang="en") to the <html> tag.
  • Why: Screen readers use this to select pronunciation and reading rules.

Intent

Prevent ambiguity in text-to-speech rendering by explicitly declaring page language.

Benefits

  • Improved screen-reader pronunciation and intonation :contentReference[oaicite:3]{index=3}.
  • Better SEO: search engines index content with correct language metadata :contentReference[oaicite:4]{index=4}.
  • Enhanced compliance: meets WCAG 3.1.1 and internationalization best practices :contentReference[oaicite:5]{index=5}.

Techniques

  • H57: Using the lang attribute on the HTML element (Sufficient technique for SC 3.1.1).

HTML Semantics

The lang attribute on <html> defines the document’s default human language per the HTML spec :contentReference[oaicite:6]{index=6}.

References

Tips & edge cases

  • Use BCP 47 language tags (e.g., en, en-US, fr-CA) for accuracy :contentReference[oaicite:9]{index=9}.
  • When serving XHTML as text/html, include both lang and xml:lang for compatibility :contentReference[oaicite:10]{index=10}.
  • For pages in multiple languages, wrap sections in <span lang="…"> or <p lang="…"> as needed :contentReference[oaicite:11]{index=11}.

See also