Criteri di successo WCAG · Level A

WCAG 3.1.1: Lingua della pagina

WCAG 3.1.1 richiede che la lingua umana predefinita di ogni pagina web possa essere determinata in modo programmato, principalmente impostando un attributo lang valido sull’elemento HTML. Questo permette alle tecnologie assistive come gli screen reader di pronunciare correttamente i contenuti e aiuta le persone con disabilità cognitive e legate al linguaggio a comprendere la pagina.

Cosa Significa Questa Regola

WCAG 3.1.1 — Lingua della pagina è un criterio di successo di Livello A sotto il principio Comprensibile. Richiede che la lingua umana principale di ogni pagina web sia esposta in modo che le tecnologie assistive possano rilevarla in modo programmatico. In pratica, questo significa quasi sempre inserire un attributo lang valido direttamente sull’elemento <html> della pagina.

Il valore dell’attributo lang deve essere un tag di lingua BCP 47 valido. I tag BCP 47 consistono in un sottotag di lingua primaria (come en per l’inglese, tr per il turco, fr per il francese) e facoltativamente in un sottotag di regione separato da un trattino (come en-US, tr-TR o pt-BR). Il tag di lingua deve riflettere accuratamente la lingua dominante in cui è scritto il contenuto della pagina. Una pagina scritta principalmente in turco deve dichiarare lang='tr' o lang='tr-TR'; una pagina scritta in inglese deve dichiarare lang='en' o una variante regionale.

Una pagina supera questo criterio quando l’elemento <html> porta un attributo lang il cui valore è un tag di lingua BCP 47 sintatticamente valido e non vuoto che identifica correttamente la lingua principale della pagina. Una pagina non supera il criterio quando l’attributo lang manca del tutto, quando il valore è vuoto (lang='') o quando il valore non è un tag di lingua BCP 47 riconosciuto (per esempio, lang='turkish' o lang='en_US' con un underscore invece di un trattino).

Per le pagine XHTML servite con un tipo MIME XML, devono essere presenti sia l’attributo lang sia l’attributo di namespace XML xml:lang, e i loro valori devono corrispondere. Una mancata corrispondenza tra i due — come lang='en' insieme a xml:lang='tr' — costituisce una violazione sia di questo criterio sia della relativa regola axe-core html-xml-lang-mismatch.

WCAG nota esplicitamente un’eccezione: se la pagina è puramente decorativa, è un CAPTCHA che intenzionalmente non ha una lingua riconoscibile o consiste interamente di contenuto non linguistico (come una pagina che è solo un’immagine senza testo), potrebbe non avere una lingua determinabile. Tuttavia, questa eccezione è limitata e la stragrande maggioranza delle pagine reali contiene testo sufficiente da richiedere una dichiarazione di lingua.

Perché È Importante

I principali beneficiari di una lingua di pagina dichiarata correttamente sono gli utenti di screen reader, la maggior parte dei quali è cieca o ha una grave ipovisione. Gli screen reader come NVDA, JAWS e VoiceOver usano l’attributo lang per selezionare la voce e il motore di sintesi vocale (TTS) appropriati. Quando una persona turca visita una pagina che dichiara correttamente lang='tr', il suo screen reader passa a una voce TTS turca, applicando la corretta fonologia, gli schemi di accento e i diacritici turchi. Senza questa dichiarazione, uno screen reader può impostarsi sulla lingua di sistema dell’utente o su una lingua completamente errata, producendo una pronuncia simile a un gergo incomprensibile che rende il contenuto incomprensibile.

Consideriamo uno scenario concreto: una cittadina turca con disabilità visiva visita il sito web di un’istituzione pubblica per scaricare un modulo governativo. Il sito omette l’attributo lang. L’installazione di NVDA dell’utente è impostata di default su un profilo TTS inglese. Le parole turche vengono lette usando la fonologia inglese — parole come “şehir” (città) o “başvuru” (domanda) diventano irriconoscibili. L’utente non può compilare il modulo senza assistenza vedente, vanificando l’intero scopo del servizio digitale.

Anche le persone con disabilità cognitive e di apprendimento ne traggono beneficio. I browser usano l’attributo lang per offrire suggerimenti di traduzione accurati; alcune persone con dislessia si affidano a strumenti di traduzione basati sul browser per convertire il contenuto in una lingua che trovano più facile da elaborare. Un attributo lang errato o mancante fa sì che questi strumenti identifichino in modo errato la lingua di origine, producendo traduzioni scadenti o nessuna proposta di traduzione.

Le persone con disabilità motorie che si affidano a software di controllo vocale come Dragon NaturallySpeaking dipendono dal fatto che il software interpreti correttamente la lingua di una pagina per abbinare i comandi vocali al testo sullo schermo. Una lingua di pagina identificata in modo errato interrompe questo abbinamento.

Oltre all’accessibilità, ci sono concreti benefici SEO: i motori di ricerca usano l’attributo lang come uno dei diversi segnali per determinare la lingua e la regione target di una pagina, migliorando l’accuratezza dei risultati di ricerca localizzati. Una corretta marcatura della lingua migliora anche l’affidabilità delle funzioni di controllo ortografico e grammaticale del browser per tutte le persone, non solo per chi usa tecnologie assistive. Secondo l’Organizzazione Mondiale della Sanità, circa 2,2 miliardi di persone nel mondo hanno qualche forma di disabilità visiva, una parte significativa delle quali si affida agli screen reader — rendendo la corretta dichiarazione della lingua uno dei miglioramenti di accessibilità a più alto impatto e a minore sforzo disponibili.

Regole Axe-core Correlate

  • html-has-lang — Questa regola verifica se l’elemento <html> ha un attributo lang. Segnala qualsiasi pagina in cui l’attributo lang è completamente assente dal tag radice <html>, indipendentemente dal fatto che l’attributo compaia altrove nel documento. Questo è uno dei controlli automatici più comuni e più incisivi, perché la correzione consiste nell’aggiunta di un singolo attributo.
  • html-lang-valid — Questa regola verifica se il valore dell’attributo lang sull’elemento <html> è un tag di lingua BCP 47 valido. Segnala i valori che non sono codici di lingua riconosciuti, come lang='turkish' (che usa il nome inglese completo invece del codice ISO 639-1 tr), lang='en_US' (che usa un underscore come separatore invece di un trattino) o lang='xx' (un segnaposto senza lingua assegnata). Un attributo lang che esiste ma contiene un valore non valido è problematico quanto un attributo mancante, perché le tecnologie assistive non possono agire in modo affidabile su di esso.
  • html-xml-lang-mismatch — Questa regola si applica specificamente alle pagine XHTML che portano sia un attributo lang sia un attributo xml:lang sull’elemento <html>. Segnala i casi in cui i due attributi specificano codici di lingua diversi — per esempio, lang='en' e xml:lang='tr'. Quando questi valori sono in conflitto, le tecnologie assistive e i processori XML ricevono segnali contraddittori e possono comportarsi in modo imprevedibile. Entrambi i valori devono specificare lo stesso sottotag di lingua primaria.

Sebbene queste tre regole coprano gli errori programmatici più comuni, gli strumenti automatici non possono verificare l’accuratezza semantica — cioè non possono determinare se la lingua dichiarata corrisponde effettivamente alla lingua in cui è scritta la pagina. Una pagina scritta interamente in turco ma che dichiara lang='en' supererà tutte e tre le regole axe-core, ma non sarà comunque conforme a WCAG 3.1.1, perché la lingua dichiarata non riflette la lingua principale effettiva della pagina. È quindi sempre necessaria una revisione manuale insieme alla scansione automatizzata per confermare che la lingua dichiarata sia corretta.

Come Eseguire i Test

  1. Scansione automatizzata con axe DevTools o Lighthouse: Apri la pagina in Chrome o Firefox. Apri DevTools (F12), vai al pannello axe DevTools o alla scheda Lighthouse ed esegui un audit completo di accessibilità. Cerca in particolare le violazioni sotto le regole html-has-lang, html-lang-valid e html-xml-lang-mismatch. Axe evidenzierà l’elemento <html> e descriverà l’errore specifico. Lighthouse mostrerà problemi simili nella sua categoria Accessibilità. Annota tutte le violazioni segnalate e le correzioni raccomandate.
  2. Ispezione manuale del sorgente: Visualizza il sorgente della pagina (Ctrl+U nella maggior parte dei browser) e individua il tag di apertura <html>. Verifica che contenga un attributo lang, che il valore dell’attributo sia un tag BCP 47 valido (controlla rispetto all’IANA Language Subtag Registry) e che rifletta accuratamente la lingua in cui è scritto il contenuto della pagina. Per le pagine XHTML, verifica anche che l’eventuale attributo xml:lang riporti lo stesso sottotag di lingua primaria di lang.
  3. Test con screen reader usando NVDA e Firefox: Installa NVDA (gratuito, Windows) e apri la pagina in Firefox. Premi NVDA+T per leggere il titolo della pagina e ascoltare la voce TTS utilizzata. Se la pagina è in turco, la voce dovrebbe essere una voce TTS turca e le parole turche dovrebbero essere pronunciate correttamente. Se senti una voce inglese o comunque errata su contenuto turco, l’attributo lang è mancante o errato. Ripeti con JAWS in Chrome e VoiceOver in Safari su macOS (Cmd+F5 per attivare VoiceOver, poi naviga alla pagina e ascolta come viene pronunciato il testo del corpo).
  4. Verifica del rilevamento della lingua da parte del browser: Apri la pagina in Chrome. Cerca la barra di traduzione integrata del browser — Chrome offrirà di tradurre le pagine che identifica come in una lingua straniera rispetto alle impostazioni del browser. Se Chrome identifica in modo errato la lingua della pagina o non offre la traduzione quando dovrebbe, questo è un segnale pratico che l’attributo lang è errato o mancante. Non è un test di accessibilità definitivo, ma è un utile indicatore secondario.
  5. Verifica dell’accuratezza semantica (solo manuale): Leggi il contenuto della pagina e conferma che il valore lang dichiarato corrisponda alla lingua principale effettiva della pagina. Gli strumenti automatici non possono eseguire questo controllo. Presta particolare attenzione ai siti multilingue che servono versioni in lingue diverse da URL differenti — la pagina di ogni URL deve dichiarare la propria lingua corretta, e non ereditare un singolo valore predefinito globale.

Come Correggere

Attributo lang mancante — Non corretto

<!DOCTYPE html>
<html>
  <head>
    <meta charset='UTF-8'>
    <title>Başvuru Formu</title>
  </head>
  <body>
    <h1>Hoş Geldiniz</h1>
  </body>
</html>

Attributo lang mancante — Corretto

<!DOCTYPE html>
<html lang='tr'>
  <!-- lang='tr' indica agli screen reader di usare una voce TTS turca -->
  <head>
    <meta charset='UTF-8'>
    <title>Başvuru Formu</title>
  </head>
  <body>
    <h1>Hoş Geldiniz</h1>
  </body>
</html>

Valore dell’attributo lang non valido — Non corretto

<!DOCTYPE html>
<html lang='turkish'>
  <!-- 'turkish' non è un tag BCP 47 valido; axe segnalerà html-lang-valid -->
  <head>
    <title>Kurumsal Site</title>
  </head>
  <body>
    <p>Şirketimiz hakkında bilgi edinmek için buraya tıklayın.</p>
  </body>
</html>

Valore dell’attributo lang non valido — Corretto

<!DOCTYPE html>
<html lang='tr'>
  <!-- Usa il codice a due lettere ISO 639-1 'tr', non la parola inglese 'turkish' -->
  <head>
    <title>Kurumsal Site</title>
  </head>
  <body>
    <p>Şirketimiz hakkında bilgi edinmek için buraya tıklayın.</p>
  </body>
</html>

Incongruenza XHTML xml:lang — Non corretto

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
  'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='en' xml:lang='tr'>
  <!-- lang e xml:lang non corrispondono — violazione html-xml-lang-mismatch -->
  <head><title>XHTML Sayfası</title></head>
  <body><p>İçerik burada.</p></body>
</html>

Incongruenza XHTML xml:lang — Corretto

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
  'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='tr' xml:lang='tr'>
  <!-- Sia lang sia xml:lang sono 'tr' — coerenti e validi -->
  <head><title>XHTML Sayfası</title></head>
  <body><p>İçerik burada.</p></body>
</html>

Lingua dichiarata errata su un sito multilingue — Non corretto

<!-- Versione in inglese del sito, ma lang è impostato globalmente su 'tr' -->
<html lang='tr'>
  <head><title>About Us</title></head>
  <body>
    <p>Welcome to our company. We specialize in accessible web solutions.</p>
  </body>
</html>

Lingua dichiarata errata su un sito multilingue — Corretto

<!-- Ogni versione linguistica dichiara il proprio attributo lang corretto -->
<html lang='en'>
  <!-- Questa è la pagina in inglese; la pagina in turco su /tr/ dichiara lang='tr' -->
  <head><title>About Us</title></head>
  <body>
    <p>Welcome to our company. We specialize in accessible web solutions.</p>
  </body>
</html>

Errori Comuni

  • Usare il nome inglese completo della lingua invece del suo codice BCP 47 — scrivere lang='turkish', lang='english' o lang='arabic' invece dei codici corretti tr, en e ar. Questi valori non sono riconosciuti dalle tecnologie assistive.
  • Usare un underscore come separatore di regione — scrivere lang='en_US' o lang='tr_TR' invece delle forme con trattino lang='en-US' e lang='tr-TR'. BCP 47 richiede i trattini, non gli underscore.
  • Impostare l’attributo lang su <body> invece che su <html> — l’attributo lang deve trovarsi sull’elemento radice <html> per soddisfare la regola html-has-lang di axe-core e per fornire alle tecnologie assistive il contesto linguistico a livello di pagina di cui hanno bisogno prima di analizzare qualsiasi contenuto.
  • Lasciare lang come stringa vuota — impostare lang='' è trattato dalla maggior parte delle tecnologie assistive come un attributo mancante e verrà segnalato da html-has-lang perché una stringa vuota non è un tag di lingua valido.
  • Copiare un template da un progetto in un’altra lingua senza aggiornare l’attributo lang — un problema molto comune nei flussi di lavoro di sviluppo in Turchia, dove viene riutilizzato un boilerplate in inglese e il lang='en' sul tag <html> non viene mai cambiato in lang='tr'.
  • Dichiarare l’attributo lang corretto ma non aggiornarlo quando si lancia una nuova versione linguistica del sito — i siti multilingue che usano il rendering lato server devono assicurarsi che l’attributo lang sia impostato dinamicamente per ogni locale, e non codificato in modo statico con un unico valore in un template di layout condiviso.
  • Dare per scontato che un CMS o un framework imposti automaticamente l’attributo lang in modo corretto — molte piattaforme CMS (incluse alcune configurazioni di WordPress, Joomla e framework personalizzati) non impostano di default un attributo lang valido. Le persone sviluppatrici devono verificarlo a livello di template, non dare per scontato che sia gestito.
  • Confondere l’attributo lang (per HTML) con l’header HTTP Content-Language — l’header HTTP influisce sulla cache e sulla negoziazione dei contenuti ma non è usato dagli screen reader. L’attributo lang nel documento sull’elemento <html> è il meccanismo corretto per la conformità a WCAG 3.1.1.
  • Usare un sottotag regionale valido ma errato che implica un dialetto diverso — per esempio, dichiarare lang='zh-TW' (cinese tradizionale, Taiwan) su una pagina scritta in cinese semplificato (zh-CN) può far sì che uno screen reader selezioni il profilo vocale e le regole di pronuncia sbagliate.
  • Dimenticare di impostare lang sul contenuto a pagina intera iniettato dinamicamente nelle single-page application (SPA) — se una SPA carica contenuti in più lingue all’interno dello stesso shell di documento senza aggiornare l’attributo lang, le persone che navigano tra le sezioni in lingue diverse non riceveranno la pronuncia TTS corretta per le nuove sezioni di contenuto.

Relazione con le Normative di Accessibilità della Turchia

WCAG 3.1.1 Lingua della pagina ha un peso legale diretto in Turchia ai sensi della Circolare Presidenziale 2025/10, pubblicata nella Gazzetta Ufficiale n. 32933 il 21 giugno 2025. Questa circolare stabilisce requisiti obbligatori di accessibilità web allineati a WCAG 2.2 e designa la conformità di Livello A come standard minimo obbligatorio per tutti i soggetti interessati.

La circolare copre un’ampia gamma di organizzazioni sia del settore pubblico sia del settore privato. Le istituzioni pubbliche — inclusi ministeri, municipalità, università statali, ospedali pubblici e tutti gli enti di governo centrali e locali — sono tenute a raggiungere la piena conformità di Livello A entro un anno dalla pubblicazione della circolare. I soggetti del settore privato coperti dalla regolamentazione hanno una finestra di conformità di due anni e includono piattaforme di e-commerce, banche e istituzioni finanziarie, ospedali e fornitori di servizi sanitari privati, operatori di telecomunicazioni con 200.000 o più abbonati, agenzie di viaggio, società di trasporto private e scuole private che operano con autorizzazione del Ministero dell’Istruzione Nazionale (MoNE).

Poiché WCAG 3.1.1 è un criterio di Livello A, rientra nella base obbligatoria per ogni soggetto coperto dalla circolare. Il sito web di un’istituzione pubblica turca che omette lang='tr' dal proprio elemento <html> — o che dichiara un tag di lingua errato o non valido — è in diretta non conformità con uno standard legalmente obbligatorio. Per le organizzazioni del settore privato come banche e piattaforme di e-commerce, lo stesso errore all’interno della loro finestra di conformità costituisce una violazione normativa.

Le implicazioni pratiche per i team web turchi sono significative: ogni template di pagina, ogni layout di CMS, ogni shell di SPA e ogni pagina generata dinamicamente deve essere sottoposta ad audit per confermare la presenza di un lang='tr' valido (o variante appropriata) sull’elemento HTML radice. Questo non è semplicemente un consiglio di buona pratica — ai sensi della Circolare 2025/10, è un obbligo legale. Dato che le regole axe-core html-has-lang e html-lang-valid possono rilevare automaticamente la maggior parte di questi errori, non esiste alcuna barriera tecnica all’identificazione e alla correzione del problema prima delle scadenze di conformità.

Le organizzazioni soggette alla circolare dovrebbero trattare la conformità a WCAG 3.1.1 come un elemento di rimedio prioritario: è uno dei criteri più facili da correggere (un singolo attributo su un singolo elemento), e tuttavia ha un impatto sproporzionato sull’accessibilità di ogni pagina per le persone che usano screen reader — il gruppo i cui diritti la regolamentazione è più direttamente progettata per tutelare.