Screen reader

Definizione — Uno screen reader è un software che trasforma l’interfaccia in voce e/o in braille, permettendo a persone cieche o ipovedenti di usare siti, app e documenti. Interpreta DOM e semantica (tag, ruoli, stati ARIA), l’ordine di lettura, l’ordine del focus e le regioni aria-live. I più diffusi: NVDA e JAWS (Windows), VoiceOver (macOS/iOS) e TalkBack (Android).

Come navigano

• Per struttura: liste di titoli, link, campi modulo, landmark.
• Per focus: tasti Tab/Shift+Tab e attivazione con Invio/Spazio.
• Comandi rapidi (esempi): H per heading, B per pulsanti, F per campi, T per tabelle, R per landmark (varia per SR).

Impatti sul design/sviluppo

• HTML semantico prima di ARIA: usa <button>, <nav>, <main>, tabelle con <th scope>.
• Nome/ruolo/stato (WCAG 4.1.2): etichette esplicite (<label for>), aria-expanded, aria-selected aggiornati.
• Form: istruzioni e errori associati con aria-describedby, role="alert" per errori globali.
• Focus: focus visibile, nessuna keyboard trap, gestione modali con role="dialog" e ritorno al trigger.

Protocollo di test (rapido)

1. Apri la pagina e avvia la lettura continua: il flusso ha senso rispetto al contenuto visivo?
2. Apri le liste di titoli/landmark/link: l’H1 è unico e descrittivo? Le sezioni sono etichettate?
3. Compila un form da tastiera: etichette, aiuti e messaggi di errore vengono annunciati correttamente?
4. Prova un dialog: focus intrappolato all’interno, titolo annunciato, chiusura con Esc, ripristino al pulsante di apertura.

Errori comuni

• “Div-bottoni” non tastierabili o senza nome accessibile.
• Link con testo generico (“leggi di più”) ripetuto ovunque, senza contesto.
• Uso eccessivo/errato di ARIA (ruoli in conflitto, aria-hidden su contenuti necessari).
• Ordine DOM che non corrisponde alla narrazione (rottura della sequenza significativa).