Controllo vocale

Il controllo vocale è la classe di tecnologia assistiva che consente agli utenti di operare un computer tramite comandi vocali. I principali sistemi sono Dragon NaturallySpeaking (Windows, leader di mercato di lunga data), macOS Voice Control e iOS Voice Control (integrati in Apple, gratuiti con il sistema operativo), Windows Speech Recognition (integrato in Microsoft) e Google Voice Access (Android).

Il controllo vocale è destinato agli utenti con disabilità motorie che rendono difficile o impossibile l’uso di tastiera, mouse o touchscreen — come la sindrome da stress ripetitivo, l’artrite, il tremore, la paralisi a vari livelli. È anche ampiamente utilizzato per l’efficienza lavorativa (avvocati e medici che dettano note) dove l’utente non ha una disabilità documentata ma trae vantaggio dall’operare a mani libere.

Come il controllo vocale interpreta i comandi

Un sistema di controllo vocale è in ascolto di due tipi di comandi:

1. Dettatura — l’utente sta parlando per inserire testo in un campo attivo. Il sistema trascrive il parlato.
2. Comandi — l’utente nomina un’azione o un controllo. Il sistema confronta la frase pronunciata con un registro di comandi disponibili e di nomi accessibili dei controlli sullo schermo.

Il secondo tipo è quello in cui si interseca l’accessibilità web: quando l’utente dice «Clicca su Invia», il software di controllo vocale cerca un elemento con il nome accessibile «Invia» (o una corrispondenza approssimativa) e gli invia un evento di clic. Se il pulsante Invia non ha un nome accessibile — perché è un <button> senza etichetta, o un <div> personalizzato, o un pulsante con solo un’icona come etichetta — l’utente del controllo vocale non può attivarlo.

Implicazioni per gli sviluppatori web

La regola più importante per l’accessibilità del controllo vocale:

Ogni elemento interattivo deve avere un nome accessibile basato su testo che corrisponda alla sua etichetta visibile.

In pratica:

• I pulsanti necessitano di testo visibile. <button>Invia</button> funziona. I pulsanti con sola icona necessitano di aria-label corrispondente a ciò che l’utente è portato a dire — aria-label="Cerca" piuttosto che aria-label="Lente di ingrandimento".
• L’etichetta visibile e il nome accessibile devono corrispondere. Se il testo visibile di un pulsante è «Invia» ma il suo aria-label è «Invia modulo», il controllo vocale potrebbe non trovarlo quando l’utente dice «Clicca su Invia». Il criterio di successo WCAG 2.5.3 Label in Name (Livello A) richiede che il nome accessibile contenga il testo dell’etichetta visibile.
• I controlli personalizzati espongono il loro ruolo e il loro nome. Un <div role="button" aria-label="Invia"> funziona. Un <div onclick> senza ruolo né nome, no.
• Nessun controllo fantasma. Gli overlay di controllo vocale (overlay numerati che mostrano ogni elemento focalizzabile con un numero da richiamare) funzionano meglio quando il numero di elementi focalizzabili è gestibile. Gli elementi nascosti ma ancora focalizzabili ingombrano l’overlay.

Sovrapposizione tra controllo vocale e accessibilità per screen reader

La stessa disciplina di nomi accessibili e HTML semantico che rende un sito accessibile agli screen reader lo rende accessibile anche al controllo vocale. Entrambe le tecnologie operano attraverso l’albero di accessibilità e dipendono dalla presenza e correttezza dei nomi accessibili.

La principale eccezione: il controllo vocale non necessita di regioni live ARIA (non è uno screen reader), ma necessita di overlay numerati per esporre i controlli privi di etichette testuali, motivo per cui le etichette testuali sono particolarmente importanti per gli utenti vocali.

Problemi specifici del controllo vocale

• Etichette solo icona visibili. Un pulsante a forma di cuore (preferiti) senza testo visibile. L’utente dice «Clicca su Preferiti», ma il nome accessibile è «Salva» o del tutto assente. Mancata corrispondenza.
• Due controlli con lo stesso nome accessibile. Due link «Leggi tutto» nella pagina. L’utente dice «Clicca su Leggi tutto»; il sistema di controllo vocale mostra un overlay di disambiguazione numerato. Non è rotto, ma è lento.
• Etichette localizzate non corrispondenti. Pronunciate in italiano, ma la pagina è in inglese. Il controllo vocale dell’utente deve riconoscere la lingua corretta per il nome dell’elemento. Impostare correttamente lang sull’HTML è di aiuto.

L’audit manuale più rapido: attivare macOS Voice Control o Windows Speech Recognition e provare a usare il proprio sito tramite comandi vocali. I controlli non attivabili diventano evidenti nel giro di cinque minuti.