Informa disAbile

domenica 25 agosto 2019
archivio notizie
Categorie

7 cose che ogni web designer deve sapere sull’accessibilità

Una piccola guida riassuntiva in 7 punti che ci aiuta a capire come deve essere impostato un sito per essere accessibile.

webdesignCome deve essere strutturato un sito per essere accessibile?

Sulla base di un articolo di Jesse Hausler, sviluppatore del sito di Salesforce specializzato nell’accessibilità, in cui spiega quali sono i punti fondamentali dell’accessibilità sul web, proponiamo qui questa mini guida riassuntiva.

Garantire i parametri di accessibilità in un sito significa permettere alle persona con disabilità di percepire, capire, navigare, interagire e contribuire con e per il web. Le linee guida che interessano l’accessibilità sono racchiuse negli standard minimi della Section 508 e nella Guida ai contenuti accessibili W3C. Il resto sarà nelle mani degli sviluppatori.

Di seguito i 7 consigli di Jesse Hausler per siti navigabili anche da persone con disabilità.

1. In primis, ovviamente, il progetto dovrebbe considerare i diversi utenti che interagiranno con il sito che significa persone cieche, daltoniche o ipovedenti, persone sorde o che hanno difficoltà nell’ascolto, persone con disabilità cognitive o motorie (temporanee o permanenti).

 

2. Uso corretto del colore

Il colore va utilizzato per sottolineare o bilanciare ciò che è già visibile. Per esempio, chi vede in scala di grigi non sarà in grado di distinguere i campi di errore in un modulo se questa indicazione è demandata solo all’uso del colore rosso. Ci sono molti modi accettabili per rendere un modulo visualmente accessibile: ad esempio si può usare un’icona a forma di triangolo in tutti i campi d’errore; si può usare del testo per indicare o spiegare perché il di quell’errore nel dato campo; si possono usare bordi spessi, testo in grassetto, sottolineato o in corsivo ecc.

 

3. Assicurate sufficiente contrasto tra il testo e lo sfondo

Il contrasto tra sfondo e testo dovrebbe essere abbastanza marcato per favorire la lettura degli utenti ipovedenti, ciechi e daltonici.

 

4. Le indicazioni visive servono ad attirare l’attenzione sulla tastiera

L’evento focus è la modificazione dello stato di una determinata area da inattiva ad attiva, in questo modo l’utente capisce che può interagire con l’area in questione. Nel caso di una textarea o di un campo di input, ad esempio, si verifica l’evento focus nel momento in cui il campo diventa compilabile. L’indicazione dell’attivazione di un determinato campo deve essere ben visibile, ad es. Twitter utilizza una combinazione di impostazioni predefinite e strumenti che mostrano il focus nei moduli. Passando il mouse sopra il retweet l’icona passa dal grigio al verde attivando anche delle etichette.

 

5. Attenzione alle form

Per quanto riguarda i form, è bene far attenzione a due elementi:  la definizione chiara dei bordi e etichette visibili (didascalia).

Moduli e bordi: I bordi chiaramente definiti sono importanti per gli utenti con disabilità motoria ed intellettiva. Conoscere lo spazio e la misura del target da cliccare è importante per le persone che utilizzano standard o indicatori adattabili. Gli utenti con disabilità cognitive potrebbero avere difficoltà a trovare e interagire con i campi senza segnalazioni visive. Qui sotto un esempio di campo di testo corretto. È un rettangolo con un bordo delimitato. Può essere riempito con il colore, ma non dovrebbe esserlo. Vi è anche una etichetta (didascalia) visibile a lato.

Moduli ed etichette: Le etichette dicono all’utente la funzione di quel campo, mantenendo la loro utilità anche quando il focus è all’interno del campo o dopo averlo completato. Dovrebbero essere fornite anche le indicazioni, in modo intuitivo, relative al campo in questione facendo in modo che siano sempre visibili

 

6. I menu e l’uso della tastiera

Uno dei principali problemi dell’accessibilità del web riguarda molti modelli inclusi menu, alberi, tabelle, ecc che utilizzano gli attributi ARIA. Questi attributi ARIA, in breve, suggeriscono agli utenti come interagire con le frecce del menu per spostarsi in alto ed in basso, come l’auto-completamento. Il designer deve considerare chi utilizza principalmente la tastiera per muoversi all’interno del sito, per esempio nella costruzione dei menu. Un menu è un dispositivo che offre all’utente una lista di scelte. Se offriamo multiple possibilità per riga non è più considerato un menu poiché cambia il modello d’interazione con la tastiera dall’usare le frecce o il tasto tab. Sapendo la differenza tra loro e gli effetti che hanno sull’esperienza dell’utente è importante capire come un piccolo cambiamento di design può potare a cambiamenti all’interno del modello d’interazione dell’utente. Si tratta di un approccio particolarmente importante in specifiche aree che hanno una costruzione più articolata come i menu di navigazione.

 

7. Le informazioni devono essere facilmente individuabili

Potrebbe sembrare scontato, ma le informazioni devono essere fornite in modo semplice a tutti, tenendo particolarmente in considerazione gli utenti con disabilità di avere informazioni immediate o posizionate intuitivamente all’interno del sito per raggiungere i contenuti con facilità.

 

In estrema sintesi è quindi importante:

  • Porre le azioni secondarie (didascalie) all’interno dei menu (o le finestre di dialogo)
  • Schiarire il contrasto delle icone secondarie e scurire il contrasto del colore usato per marcare il campo ed il testo
  • Usare elementi tangibili per porre l’attenzione, come icone

Con la giusta attenzione si scopre che tutti le sfide di design possono incontrare i bisogni di tutti gli utenti, anche quelli con disabilità.

Fonte: disabili.com


Ultimo aggiornamento Aggiornata il 28 Luglio 2015
Torna su