Frontend is a free bonus on CodeMentor AI — the main product is Python. Register to save your progress and unlock all 290 Frontend lessons + 1,000+ Python lessons.Sign up — free
TaskBuild a page in Ukrainian (lang='uk'). Title 'Привіт', body has an h1 'Привіт, світ' and inside a p with the English phrase 'Hello, world' wrapped in span lang='en'.
lang attribute: not just for screen readers
75 XP6 minFREE
Theory
Four things lang quietly controls
<html lang="en">
This one attribute affects:
- Screen reader voice — VoiceOver speaks English differently from German. Without
lang, it guesses (and gets it wrong on multilingual pages). - Hyphenation — CSS
hyphens: autouses the language dictionary. Without lang, it can't hyphenate at all. - Spellcheck in inputs — browsers apply the matching dictionary. A French
lang="fr"page gets French spellcheck for free in any<textarea>. - Quotation marks —
q { quotes: auto }picks""for English,«»for French,„"for German.
Mixing languages on one page
For a primarily-English page that has a French quote inside:
<html lang="en"> … <p>The motto is <q lang="fr">liberté, égalité, fraternité</q>.</p> </html>
The lang="fr" on the inner element narrows the scope. Screen readers switch voices for that span.
BCP 47 codes
en— English (any variant)en-US— US English specificallyzh-Hans— Simplified Chinesept-BR— Brazilian Portuguese
Use the shortest code that's accurate. CodeMentor itself uses <html lang="uk"> on its Ukrainian-translated pages.
Live preview