← All criteria

Understandable · Level A · 3.1.1

Language of Page

The <html> element needs a lang attribute (lang="en", lang="hr", and so on) stating what language the page is predominantly written in. It isn't decorative — it's what tells a screen reader which pronunciation rules to use for every word on the page.

  • Blind
  • Cognitive
  • Deaf / hard of hearing

How to recognize it

Inspect the <html> element and check whether it has a lang attribute at all, and whether it's the right one. Missing entirely is one failure; wrong is another and arguably more common — a Croatian site left with lang="en" because that's what the starter template shipped with, and nobody touched it again. The practical symptom, if you actually listen with a screen reader, is that without the right lang it falls back to the screen reader's own default language and reads everything with the wrong pronunciation rules and stress patterns — genuinely hard to follow, since prosody is language-specific, not just vocabulary. It's an easy attribute to set once and an easy one to forget, because it lives in a template file most people touch on day one of a project and never look at again.

How to fix it

Set lang on the <html> element to the correct BCP 47 language code for whatever language the page's content is predominantly in — lang="en" for English, lang="hr" for Croatian. If a page genuinely mixes languages, this attribute reflects whichever language most of the content is in; individual passages written in a different language get their own lang attribute on the specific element wrapping them, which is a related but distinct requirement (3.1.2), not this one.

Example

Avoid

<html>
<!-- no lang attribute at all -->
<html lang="en">
<!-- page content is actually entirely in Croatian -->

Prefer

<html lang="hr">
<html lang="en">
<!-- correct, because this page's content actually is in English -->

Resources