Tastiera
Ogni funzione della pagina deve essere utilizzabile tramite sola tastiera — senza movimenti del mouse, trascinamenti o tempistiche specifiche. Gli utenti di screen reader, di dispositivi di controllo alternativo e di controllo vocale dipendono tutti da questa base di partenza.
Cosa richiede
Tutte le funzionalità del contenuto devono essere utilizzabili tramite un’interfaccia a tastiera, senza richiedere tempistiche specifiche per le singole pressioni di tasti. L’utente deve poter raggiungere ogni elemento interattivo con Tab, attivarlo con Invio o Spazio e operare widget complessi con i tasti freccia e altre combinazioni standard.
Esistono due eccezioni limitate: l’input che dipende dal percorso del movimento dell’utente (disegno a mano libera, firma di un documento) e non solo dai punti di arrivo, e l’input che riproduce un’azione analogica nel mondo reale in cui il percorso è determinante.
Come soddisfarlo
- Usare elementi interattivi nativi (
<button>,<a href>,<input>,<select>) — sono accessibili da tastiera per impostazione predefinita. - Per i widget personalizzati costruiti con
<div>o<span>, aggiungererole,tabindex="0"e gestori di tasti per Invio, Spazio, Escape e frecce appropriati al pattern. - Seguire l’ARIA Authoring Practices Guide per menu, schede, combobox, finestre di dialogo e visualizzazioni ad albero — ciascuno ha un modello di interazione da tastiera definito.
- Fornire un equivalente da tastiera per ogni gesto esclusivamente con il mouse: il drag-and-drop necessita di un’alternativa di riordino tramite pulsanti, i menu attivati solo con hover richiedono l’apertura con clic, i caroselli a scorrimento richiedono pulsanti precedente/successivo.
- Verificare scollegando il mouse e percorrendo l’intero flusso.
Errori comuni
<div onclick>senzarole="button",tabindex="0"o un gestore di tasti — completamente invisibile agli utenti da tastiera.- Menu a tendina personalizzati in cui il trigger è raggiungibile ma le opzioni non sono navigabili con i tasti freccia.
- Bacheche kanban drag-and-drop, uploader di file o strumenti canvas senza alternativa da tastiera.
- Pulsanti di chiusura delle finestre modali presenti ma senza gestore del tasto Escape.
- Tooltip e menu attivati solo con hover che non compaiono mai sotto il focus da tastiera.
- Caroselli e gallerie di immagini utilizzabili solo con lo scorrimento o con clic su indicatori privi di
tabindex.
axe e Lighthouse segnalano tabindex mancanti e nomi accessibili assenti, ma non possono stabilire se il menu a tendina personalizzato risponde effettivamente ai tasti freccia — questa parte richiede verifica manuale.
Perché è importante
Questo è il criterio di successo più importante per l’operabilità. Gli utenti di screen reader navigano da tastiera. Gli utenti di dispositivi di controllo alternativo emulano una tastiera. Gli utenti di controllo vocale impartiscono comandi che si mappano su eventi da tastiera. Gli utenti esperti con disturbi da sforzo ripetitivo dipendono da essa. Un sito che non soddisfa il criterio 2.1.1 esclude di fatto chiunque non possa usare un mouse — e quella categoria è molto più ampia di quanto appaia ovvio.