Content Language Declaration with the HTML `lang` Attribute

Declare the document's primary language with the HTML `lang` attribute so assistive technologies and other user agents can apply appropriate pronunciation and language-specific processing rules. For a typical English document, use `lang="en"` on the root `<html>` element.

The `lang` attribute identifies the natural language of an HTML element's content. For the page's primary language, it is normally placed on the root `<html>` element, such as `<html lang="en">`.

The declaration is especially important for accessibility. Screen readers can use the language information to select an appropriate pronunciation engine and language-specific rules, reducing the chance that words are pronounced using the wrong language.

The value should use a valid language tag, such as `en`, `fr`, `de`, or `ja`. More specific tags can identify a regional or linguistic variant when that distinction matters, for example `en-GB` for British English.

The attribute can also be applied to an element containing text in a different language. This lets user agents switch language handling for that portion without changing the document's overall language declaration.

Key points

• Put the primary document language on the root `<html>` element.
• Use a language tag such as `en` or `en-GB`, rather than an arbitrary descriptive word.
• Language metadata helps screen readers choose appropriate pronunciation and processing rules.
• Use `lang` on a specific element when its text switches to another language.
• Do not confuse `lang` with the document's character encoding declaration.

Interview questions

Where should you declare the primary language of an HTML document?

Declare it with the `lang` attribute on the root `<html>` element. For an English page, a typical declaration is `<html lang="en">`. This gives browsers and assistive technologies a document-wide language context.

Why is the HTML `lang` attribute important for accessibility?

Assistive technologies can use the declared language to select appropriate pronunciation and language-specific processing rules. Without accurate language metadata, a screen reader may interpret text using the wrong language settings. Correctly declaring language therefore improves the experience for users of assistive technology.

How do you represent a regional language variant such as British English?

Use a more specific language tag when the regional distinction is relevant, such as `lang="en-GB"`. The first part identifies the language and the following subtag identifies the region. The choice should reflect the actual language variant being used rather than being added merely for decoration.

How would you handle a Spanish quotation inside an English document?

Keep the document's default language on `<html>`, then put `lang="es"` on the element containing the Spanish quotation. That nested declaration overrides the inherited language for the quotation and its descendants. This gives assistive technologies the correct language context without changing the page's overall language.

What is the difference between `lang` and character encoding?

`lang` describes the natural language of human-readable content, while character encoding describes how characters are represented and decoded. For example, `lang="en"` identifies English, whereas `<meta charset="utf-8">` declares UTF-8 encoding. They solve different problems and are commonly used together.