perché uno screen reader non legge correttamente i titoli sulla mia pagina

Titoli mancanti o in ordine errato

Un lettore di schermo di solito non identifica correttamente i titoli su una pagina perché sono formattati visivamente come titoli — più grandi, grassetto, colore diverso — ma non sono codificati come titoli. Un lettore di schermo legge la struttura sottostante della pagina, non come appare. Se una parola è in lettere grandi e grassetto ma nel codice non c'è un elemento titolo (come h1, h2 o h3) dietro, un lettore di schermo legge semplicemente una riga di testo normale e non segnala nulla riguardo a un titolo. Un utente che usa la tastiera per saltare da un titolo all'altro al fine di navigare rapidamente perderà completamente quel testo nella sua visione d'insieme.

Anche un ordine errato dei titoli è una causa comune. Una pagina che salta da un h1 direttamente a un h4, o in cui un h3 si trova sopra un h2, fornisce a un lettore di schermo un'immagine distorta di come il contenuto è strutturato — alcuni utenti si aspettano una gerarchia logica per determinare se desiderano aprire una sezione o saltarla. Questo problema non è isolato da altri errori di struttura su una pagina: problemi simili si verificano con campi di modulo che non vengono letti correttamente e con il salto della messa a fuoco durante la navigazione tramite tastiera. In tutti i casi, si tratta dello stesso concetto fondamentale: la presentazione visiva è corretta, ma il codice sottostante utilizzato da un lettore di schermo non lo è.

Dove questo si trova in WCAG: informazioni e relazioni

Il fatto che la struttura deve essere riconoscibile a livello di codice — quindi nel codice, non solo visivamente — deriva dal criterio di successo su informazioni e relazioni in WCAG 2.1, la linea guida su cui EN 301 549 si basa nella pratica. Se i titoli sono effettivamente codificati come titoli e sono in un ordine logico è qualcosa che un controllo automatizzato può segnalare in gran parte; cosa può trovare e cosa non può trovare una scansione automatica è una distinzione rilevante in questo contesto, perché una scansione può vedere la presenza di elementi titolo ma non sempre può valutare se il layout scelto è logico per un utente.