# Default language is specified - **Pattern:** `ab-000125` (`accessibility-wcag.understandable.lang-attribute`) - **Severity:** low - **Lifecycle:** active - **Last modified:** 2026-04-18 - **Canonical URL:** https://auditbuffet.com/patterns/ab-000125 - **License:** CC-BY-4.0 — attribute to AuditBuffet Pattern Catalog (https://auditbuffet.com/patterns/ab-000125) ## Why it matters The `lang` attribute on the `` element tells screen readers which language to use for pronunciation. Without it, a French-language site read by VoiceOver defaults to the user's system language — French words get English pronunciation rules and become unintelligible. WCAG 2.2 SC 3.1.1 (Language of Page) is a Level A requirement. It is a one-line fix that has an outsized impact on all non-English content and multilingual applications. ## Severity rationale Low because the `lang` attribute is a one-attribute fix with zero functional impact beyond screen reader pronunciation, but its absence violates WCAG 2.2 SC 3.1.1 at Level A for every user who depends on synthesized speech. ## Remediation Add a valid BCP-47 language code to the root `` element. In Next.js App Router, set it in `app/layout.tsx`. ```tsx // app/layout.tsx export default function RootLayout({ children }: { children: React.ReactNode }) { return ( {/* or 'fr', 'de', 'ja', 'pt-BR', etc. */} {children} ) } ``` For multilingual applications, also set `lang` on individual content sections when the language changes mid-page: ```tsx

Liberté, égalité, fraternité

``` Confirm the value is a valid BCP-47 tag (e.g., `en`, `en-US`, `zh-Hant-TW`) — not an ISO 639-2 three-letter code or a locale string like `en_US`. ## Detection - **ID:** `lang-attribute` - **Severity:** `low` - **What to look for:** Enumerate every relevant item. Check the root `` tag for a `lang` attribute with a valid BCP-47 language code (e.g., "en", "en-US", "fr-CA"). - **Pass criteria:** At least 1 of the following conditions is met. The `` tag has a `lang` attribute with a valid language code. - **Fail criteria:** No `lang` attribute on `` tag. - **Skip (N/A) when:** Never — language declaration applies to all HTML documents. - **Detail on fail:** Example: `" tag has no lang attribute. Screen readers cannot determine language for pronunciation"` - **Remediation:** Add the lang attribute: ```tsx export default function RootLayout({ children }) { return ( {children} ) } ``` ## External references - wcag 3.1.1 - section-508 501.1 Taxons: accessibility HTML version: https://auditbuffet.com/patterns/ab-000125