Lessons · HTML and CSS · which language to pronounce
Which language to pronounce
lang on the html element tells a screen reader which language to pronounce the page in.
Hone is a place to practise programming. This is one of its lessons, written out in full and free to read without an account.
What it is for
Without it a synthesiser guesses, and English read with French pronunciation rules is not slightly worse, it is unintelligible. One attribute, whole page.
How to think about it
Set it on <html>, and again on any element in a different language -- lang nests, so a French quotation inside an English page takes its own. A region like en-GB tunes pronunciation and typography, but the whole of the value is in having any correct lang at all.
Worked example
<html lang="en-GB"><head><title>Invoices | Acme</title></head>…The browser reports lang as 'en-GB' and the title as 'Invoices | Acme' -- both of which are read before anything else on the page.
<html><head><title>Untitled</title></head>…lang reads back as an empty string. Nothing has told the synthesiser anything.
Your turn
The attribute that names a page's language.
<html ="en">
Write a page and watch it render
The trap
The title is announced before the page is read, so 'Untitled' or a title identical on every page wastes the first thing anybody hears.