SC 3.1.1 Livello A WCAG 2.0

Lingua della pagina

Dichiarare a livello programmatico la lingua umana predefinita di ogni pagina — di norma tramite l'attributo lang sull'elemento html. Screen reader, display braille e strumenti di traduzione utilizzano questa informazione per scegliere le regole di pronuncia, i profili vocali e le mappature dei caratteri.

Cosa richiede

Ogni pagina web deve dichiarare la propria lingua umana predefinita in modo che la tecnologia assistiva possa leggerla. In HTML ciò significa inserire un attributo lang valido sull’elemento radice <html>, impostato su un sottotag di lingua primaria conforme a BCP 47 (en, de, bg, zh-Hans). Il valore deve rispecchiare la lingua predefinita effettiva del contenuto testuale — non la lingua del CMS, non il paese del server di hosting.

Una pagina che mescola più lingue ha comunque una sola lingua predefinita; le lingue secondarie sono gestite dal criterio 3.1.2 Lingua delle parti.

Come soddisfarlo

Aggiungere lang all’elemento <html> di ogni pagina: <html lang="en">.
Utilizzare il sottotag BCP 47 corretto. Usare en per l’inglese generico; usare en-GB o en-US solo se la pronuncia regionale è rilevante.
Per il cinese, distinguere il sistema di scrittura: zh-Hans (semplificato), zh-Hant (tradizionale).
Per le lingue da destra a sinistra (arabo, ebraico, persiano), associare lang a dir="rtl".
In React/Next.js/Astro, impostare l’attributo nel template del layout radice, non nel corpo di _document, affinché ogni route lo erediti.
Nei siti multilingua, aggiornare lang per ogni route — non servire mai un’unica lingua predefinita globale alle pagine localizzate.

Errori comuni

lang completamente assente — il problema più diffuso nei siti legacy e nei siti basati su CMS.
lang="" (valore vuoto) o lang="italian" — non valido; sono conformi solo i sottotag BCP 47.
Tutte le pagine impostate su lang="en" anche quando il contenuto è in tedesco, francese o bulgaro.
Una pagina in francese con lang="en" perché il template del CMS viene consegnato con l’inglese come predefinito e nessuno lo ha modificato.
lang impostato su <body> anziché su <html> — accettato da alcuni strumenti ma non è la posizione canonica.

Perché è importante

Gli screen reader utilizzano lang per scegliere il sintetizzatore vocale corretto. Con la lingua sbagliata dichiarata, uno screen reader in inglese legge il testo tedesco in modo foneticamente errato — «Schmetterling» diventa una sequenza di sillabe incomprensibili. I display braille lo usano per selezionare le tavole di contrazione di grado 2 corrette. Le funzionalità di traduzione dei browser lo usano per rilevare la lingua di partenza. I motori di ricerca lo usano per il posizionamento e la generazione degli snippet.

Si tratta di una correzione che richiede trenta secondi e che migliora la comprensione per ogni utente di screen reader sulla pagina; eppure manca su una quota significativa dei siti in produzione. È uno dei problemi più citati negli audit automatici perché è binario e facile da rilevare.