The lang Attribute

Declare the language of your page for accessibility and SEO.

Syntax<html lang="en">

The lang attribute declares the language of the document. It is added to the <html> element.

Why lang matters

  • Helps screen readers pronounce content correctly.
  • Helps search engines serve the right results.
  • Assists browser translation tools.

For example, lang="en" means English and lang="es" means Spanish.

Example

Try it yourself
Loading editor…
Press Run to see the result.

When to use it

  • A developer sets lang="fr" on a French page so screen readers use the correct voice pronunciation engine.
  • A multilingual site sets lang="ar" on a section of Arabic text so the browser applies right-to-left rendering.
  • A search engine reads lang="de" on a German page to index it in the appropriate regional search results.

More examples

Page-level language declaration

lang="en" on <html> declares English as the document language for browsers and assistive tools.

Example · html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>English Page</title>
</head>
<body>
  <p>Welcome to SoundsCode.</p>
</body>
</html>

Language subtag for regional variant

Region subtags like en-GB or pt-BR let spell-checkers and TTS engines use locale-specific rules.

Example · html
<!-- British English -->
<html lang="en-GB">

<!-- Brazilian Portuguese -->
<html lang="pt-BR">

<!-- Simplified Chinese -->
<html lang="zh-Hans">

Inline language switch for a quote

A lang attribute on an inline element overrides the page language for that specific span of text.

Example · html
<p>The French say <q lang="fr">Bonjour le monde</q> to greet the world.</p>

Discussion

  • Be the first to comment on this lesson.
The lang Attribute — HTML | SoundsCode