HTML Lang Attribute: What It Does and How to Add It

What is the HTML lang attribute?

The lang attribute in HTML is a global attribute that names the natural language of an element's content. On the html root element it sets the document language. The MDN lang attribute reference documents it, and our doctype declaration guide covers the line above it.

Syntax and placement

The value is a BCP 47 language tag: an ISO 639-1 language code such as en, then an optional script subtag (Hans) or region subtag (US), as in zh-Hans.

<!DOCTYPE html>
<html lang="en">

Overriding the language for one element

A child element can carry its own value, as WCAG 3.1.2 Language of Parts asks. A French phrase in an English page gets its own span, <span lang="fr">c'est la vie</span>, so screen readers switch voice for those words. An empty lang="" means unknown.

Does the HTML lang attribute help SEO?

For Google, no. It does not use the lang attribute to detect language, and nothing in its documentation makes lang a ranking factor. The payoff is accessibility, the same goal as our image alt text guide.

What Google says about language detection

The Google localized versions documentation, part of Google Search Central, says Google relies on its own algorithms, not hreflang or lang. Hreflang separately lists alternate URLs, so multilingual sites need both.

Who actually reads the attribute

NVDA, JAWS and VoiceOver use the value for screen reader pronunciation. Without it, many read a French page in the default voice, which is why WCAG 3.1.1 Language of Page is Level A. Browsers use it as a hint for the browser translation prompt and spellcheck language, and the CSS :lang() selector can target it.

Audits flag it too. The axe-core rule html-has-lang rates a missing value serious, and the Lighthouse accessibility audit fails its lang check.

How SEO Site Checker tests your HTML lang attribute

Our crawler loads the page in headless Chromium, waits for the load event and reads the lang attribute of the root html element.

The rule: any non-empty value passes. A missing or empty one fails with "This webpage has not language declared".

What passes

A passing page gets the green tick and its code in a badge, but nothing checks that the code is real, so lang="english" passes too.

What fails

Four cases fail: a missing language declaration, an empty lang attribute, lang only on body or a div, or xml:lang alone. A value a script adds after the load event can be missed, and the Content-Language header is not read. The same result feeds the Declared language line in the AI readiness section, which warns when it is missing.

Run the free SEO report

How to add the HTML lang attribute

1. Pick the language. Choose the code for the visible text from the table below.
2. Edit the opening tag. In the template that prints it, such as header.php, theme.liquid or index.html, add lang="en".
3. Match each translation. Print the value from the page's own language, so the Spanish URL outputs es and the German one de, in server-sent HTML.
4. Run the report again. Clear the cache, then look for the green tick.

Static HTML pages

Preview the edit in the Online HTML Viewer, then check the live page with View Source. See the charset declaration guide for the neighboring tag.

<!-- Before -->
<html>

<!-- After -->
<html lang="en">

Multilingual pages

Use values such as es-MX or fr-CA where audiences differ, and test one translated URL per language.

Set the lang attribute in WordPress, Shopify and JavaScript frameworks

CMS and store builders

In WordPress, set Settings, General, Site Language. Classic themes need language_attributes() in header.php. In Shopify, use lang="{{ request.locale.iso_code }}" in theme.liquid. In Wix and Squarespace, set the site language in settings.

JavaScript frameworks

Prefer server rendering, because a browser-side document.documentElement.lang can be missed. Our tools for developers cover more template checks.

Common HTML lang attribute mistakes and valid values

Slips: en_US should be en-US, "english" should be en, and en-UK should be en-GB.

Arabic, a right to left language, also needs dir="rtl", since lang does not set text direction. A Content-Language HTTP header describes the intended audience rather than the text, so it cannot stand in for lang. The W3C says never to use the meta http-equiv content-language tag, so leave that out.

Our report passes an invalid lang attribute value, so check yours in the IANA language subtag registry. The W3C language declaration guide adds that in XHTML served as text/html, xml:lang must match lang.