Set the page lang attribute

SkillDocs & knowledge

lang-attribute is a skill for checking language declarations in HTML documents. It verifies that the opening `<html>` tag carries a `lang` attribute with a non-empty, valid BCP 47 language code, and that individual elements with content in another language declare their own `lang` value. This helps an AI agent review web pages so screen readers and browsers interpret them properly.

Available today. Use it from your connected AI after setup.

Have an AI agent that can load skills.

Then ask your AI: use the Set the page lang attribute skill

What your AI can do with it

  • Check the `<html>` opening tag for a `lang` attribute
  • Verify the `lang` value is non-empty and a valid BCP 47 language code
  • Detect `lang` attribute changes on individual elements
  • Review inline quotes and foreign terms for correct language tagging
  • Check multilingual documents for per-element language declarations

Getting started

  1. Have an AI agent that can load skills.
  2. Add the lang-attribute skill to the agent's available skills.
  3. Apply it when working on HTML documents, since it applies to all HTML documents.
  4. Ask the agent to check the document's language declarations, including elements with content in multiple languages.

What this skill tells your AI

The instructions your AI receives, as published by thedaviddias/front-end-checklist in skills/lang-attribute/SKILL.md and read by ahel’s review.

Screen readers select the correct text-to-speech voice and pronunciation engine based on the lang attribute. Without it, VoiceOver defaults to the user's system language, and NVDA uses its default voice — both may mispronounce words in other languages, making content unintelligible. French text read with an English voice profile is incomprehensible. The lang attribute also enables browser translation features (Chrome's Translate), hyphenation algorithms (CSS hyphens: auto), and correct spell checking. This is a WCAG Level A requirement — the most fundamental accessibility baseline.

Quick Reference

  • The <html> element must have a lang attribute — WCAG 2.1 SC 3.1.1 (Language of Page, Level A)
  • The value must be a valid BCP 47 language tag: en, en-US, fr, zh-Hant, ar, etc.
  • Use lang on individual elements to indicate language changes within the page — WCAG 2.1 SC 3.1.2 (Level AA)
  • The lang attribute affects screen reader pronunciation, spell checking, hyphenation, and browser translation
  • An empty lang='' is treated as unknown language — equivalent to having no lang attribute

Check

Inspect the <html> element in the page source. Verify: (1) a lang attribute is present; (2) its value is non-empty; (3) its value is a valid BCP 47 language code matching the primary language of the page content (e.g., en for English, fr for French, zh-Hant for Traditional Chinese). Flag: missing lang, empty lang='', language codes using full names instead of codes (e.g., lang='english' is invalid), and mismatches where the declared language does not match the actual content language. For multilingual pages, also check for lang changes on block-level elements containing content in a different language.

Fix

Add or correct the lang attribute on the <html> element: <html lang='en'> for English, <html lang='fr'> for French, <html lang='es'> for Spanish, <html lang='de'> for German, <html lang='ja'> for Japanese, <html lang='zh-Hans'> for Simplified Chinese, <html lang='zh-Hant'> for Traditional Chinese, <html lang='ar'> for Arabic. For content sections in different languages, add lang to the containing block element. Validate language codes against the IANA Language Subtag Registry.

Explain

WCAG 2.1 SC 3.1.1 (Language of Page, Level A) requires that the default human language of each web page can be programmatically determined. The lang attribute on <html> fulfills this requirement. The value must be a BCP 47 language tag — a standardized system of subtags that identifies language, script, and region. The primary language subtag (e.g., en, fr) is required; region subtags (e.g., en-US, fr-CA) are optional but useful for dialect-specific pronunciation and spell checking. SC 3.1.2 (Language of Parts, Level AA) extends this to inline language changes within a page.

Code Review

Review templates, server-rendered HTML, and shared components that output markup related to Set the page lang attribute. Flag exact elements, attributes, and routes where the rendered HTML violates the rule.


For full implementation details, code examples, and framework-specific guidance, see references/rule.md.

Rule page: https://frontendchecklist.io/en/rules/html/lang-attribute

Signals

GitHub stars
74k
Forks
7k
Last commit
Aug 2026

Questions

When should this skill be used?
It applies to all HTML documents. Use it when checking that a page declares its language correctly.
What does it check on the html tag?
It checks the `<html>` opening tag for a `lang` attribute with a non-empty, valid BCP 47 language code.
Does it handle multilingual content?
Yes. It checks for `lang` attribute changes on individual elements when the document contains content in multiple languages, such as inline quotes, foreign terms, and multilingual content.
Advanced
Item type
skill
Key
lang-attribute
Source
github.com/thedaviddias/front-end-checklist