Al focus

Il semplice spostamento su un elemento, ad esempio premendo Tab, non dovrebbe mai attivare un cambiamento importante, come il caricamento di una nuova pagina, l'invio di un modulo o l'apertura di un popup.

Si tratta di una : l'automazione non è in grado di stabilire in modo affidabile, da JavaScript minimizzato o basato su framework, se un gestore del focus modifica il contesto; per questo Silktide mostra il prompt su ogni pagina e una persona lo conferma usando il tasto Tab.

Perché è importante

Gli utenti che usano la tastiera spostano il focus attraverso una pagina per esplorarla, proprio come gli utenti del mouse spostano il puntatore: raggiungere un controllo non equivale a scegliere di usarlo. Se il semplice spostamento con Tab su una casella di ricerca ricarica la pagina o il raggiungimento di un pulsante apre una finestra di dialogo, gli utenti della tastiera e gli utenti di vengono portati in un punto in cui non avevano chiesto di andare, spesso perdendo la posizione e il lavoro svolto. Le persone con disabilità motorie che navigano lentamente, elemento per elemento, si imbattono continuamente in queste trappole.

Questo è il criterio di successo 3.2.1 di (Al focus), un requisito di , parte del livello di conformità più basilare.

Cosa controllare

Usa il tasto Tab per attraversare ogni controllo della pagina che può ricevere il focus.
Conferma che il solo focus non provochi mai una navigazione, l'invio di un modulo o l'apertura di una finestra di dialogo o di una nuova finestra.
I gestori del focus che si limitano a evidenziare un campo, mostrare un suggerimento o preparare dati in background non costituiscono un problema.

Se il focus non cambia mai contesto, il risultato.

Come risolvere il problema

Sposta l'azione fuori dal gestore del focus. La navigazione, l'invio e le finestre di dialogo devono essere attivati da un'azione esplicita, come click, Invio o una modifica confermata dal visitatore.
Usa i gestori del focus solo per effetti non invasivi.

// Problema: raggiungere il campo avvia immediatamente la navigazione
searchBox.addEventListener('focus', () => {
  window.location.href = '/search';
});

// Soluzione: navigare solo quando l'utente sceglie di farlo
searchBox.addEventListener('keydown', (event) => {
  if (event.key === 'Enter') {
    window.location.href = '/search';
  }
});

Come Silktide esegue il controllo

Silktide non è in grado di rilevare in modo affidabile i cambiamenti di contesto attivati dal focus analizzando il codice sorgente dei listener: i framework e la minimizzazione del codice rendono questo metodo poco affidabile. Per questo, questo controllo mostra un prompt di revisione per ogni pagina, descrivendo cosa verificare usando il tasto Tab.