Accessibilità: preparare il tuo sito web per gli screen reader

Tempo di lettura: 3 min.
Alcuni dei visitatori del tuo sito potrebbero utilizzare tecnologie assistive come gli screen reader per navigare nel tuo sito. Gli screen reader sono app utilizzate da coloro che hanno problemi di vista. Scansionano il contenuto del tuo sito e lo "leggono" ad alta voce al visitatore. I visitatori che utilizzano gli screen reader generalmente utilizzano anche il tasto Tab per navigare nel tuo sito, in quanto potrebbero non essere in grado di vedere dove cliccare.
L'ordine DOM del tuo sito è l'ordine in cui gli screen reader e il tasto Tab evidenziano e/o "leggono" il contenuto della pagina. Dovrebbe seguire un ordine logico per garantire che i visitatori ottengano la migliore esperienza possibile sul tuo sito e possano capirne e apprezzarne i contenuti.
Nota:
Alcuni visitatori potrebbero non avvalersi di uno screen reader ma utilizzare comunque il tasto Tab per navigare nel tuo sito, come nel caso di problemi di mobilità. Pertanto, ti consigliamo di assicurarti sempre che l'ordine DOM del tuo sito sia corretto.
In questo articolo, scopri di più su:

Informazioni sull'ordine DOM del tuo sito

Il DOM è l'ordine degli elementi sul tuo sito. È particolarmente importante quando i visitatori del sito utilizzano screen reader e/o il tasto Tab, in quanto devono essere in grado di navigare nel tuo sito in un ordine logico. Ad esempio, il menu del sito dovrebbe apparire per primo, seguito dal resto degli elementi nell'intestazione, quindi dal titolo della pagina, quindi dal contenuto della pagina, ecc. Se l'ordine DOM non è corretto, lo screen reader/tasto Tab salta il contenuto della tua pagina.
Wix imposta automaticamente un ordine DOM per te. La sequenza utilizza l'ordine visivo degli elementi; da sinistra a destra e dall'alto verso il basso. Quando sviluppiamo i nostri strumenti di accessibilità, testiamo i nostri prodotti utilizzando i seguenti lettori di schermo:
  • Windows + Firefox o Chrome: NVDA (lettore gratuito)
  • iOS + Safari: Voiceover (lettore integrato)
Ciò significa che abbiamo creato l'ordine DOM automatico del tuo sito tenendo conto delle funzioni delle applicazioni di cui sopra. Puoi testare l'ordine DOM automatico del tuo sito utilizzando il tasto Tab della tastiera o uno screen reader sul tuo sito live.

Modificare l'ordine DOM del tuo sito

Se provi l'ordine DOM del tuo sito e noti che non è logico, puoi modificarlo manualmente nella procedura guidata del Wizard accessibilità. Il Wizard è uno strumento che scansiona il tuo sito, individua potenziali problemi di accessibilità e fornisce soluzioni attuabili per correggere questi problemi. Oltre a questo, puoi anche utilizzare il Wizard accessibilità per modificare le impostazioni di accessibilità avanzate sul tuo sito. 
Importante:
Se l'ordine di tabulazione del tuo sito è logico, non devi fare nulla. Modificare l'ordine quando è già corretto può causare problemi ai visitatori che utilizzano gli screen reader e/o il tasto Tab.

Per modificare le impostazioni DOM:

  1. Seleziona Impostazioni nella barra superiore dell'Editor
  2. Seleziona Wizard accessibilità
  3. Seleziona l'icona Altre azioni in alto a destra del Wizard
  4. Seleziona Impostazioni avanzate per l'accessibilità
  5. Seleziona Ordine DOM automatico
  6. Disabilita l'interruttore nel pannello
  7. Seleziona Disattiva nella finestra pop-up
  8. Seleziona l'icona Livelli in basso a sinistra dell'Editor
  9. Controlla l'elenco ed elimina tutti gli elementi ridondanti. Ciò include elementi duplicati che non hanno un uso sul tuo sito e possono confondere gli utenti di screen reader
  10. Trascina gli elementi rimanenti nell'ordine desiderato
Il pannello delle impostazioni avanzate del Wizard accessibilità. L'interruttore automatico dell'ordine DOM è stato disabilitato.
Note:
  • La navigazione in un sito utilizzando il tasto Tab consente di spostarsi solo tra gli elementi interattivi e non gli elementi statici, come il testo. Se vuoi testare uno screen reader su elementi statici come il testo, segui le istruzioni nel centro assistenza dello screen reader su come navigare correttamente in un sito web con una tastiera
  • Gli elementi bloccati vengono posizionati automaticamente alla fine della sequenza di tabulazioni. Se vuoi che vengano visualizzati prima nella sequenza, ti consigliamo di sbloccarli e posizionarli nell'intestazione
Prossimi passi:
  • Apri l'Editor mobile e ripeti gli stessi passaggi
  • Torna alla Checklist per l'accessibilità per continuare a lavorare sull'accessibilità del tuo sito

Hai trovato utile questo articolo?

|