L'usabilità non è una scienza esatta. Ciò che un visitatore considera utile, un altro considera noioso. Nonostante questa incertezza e complessità, dovresti sempre cercare di rendere il tuo sito il più accessibile possibile alle persone che stai cercando di raggiungere. Scoprirai che un po 'di catering per le esigenze speciali di una minoranza di utenti può migliorare drasticamente la funzione del tuo sito per tutti gli utenti. Ecco la nostra lista di dodici trappole per l'accessibilità da evitare insieme ad alcuni esempi che mostrano siti che eccellono o falliscono miseramente in queste aree.
captcha
Gli sviluppatori Web sembrano amare i captcha, ma gli utenti non li sopportano. Concedilo, non sono tutti cattivi, ma la maggior parte di questi è impossibile da leggere o inutilmente complicata come quella sopra. Un altro aspetto importante è che i captcha rappresentano spesso un serio ostacolo per i disabili visivi. Se devi assolutamente usare un captcha, assicurati che la maggior parte degli umani possa leggerlo / capirlo e avere opzioni in atto per quegli utenti che non sono in grado di vederlo.
Non usare? Alt? Attributi alle immagini
È sicuramente una buona pratica inserire sempre un po 'di utile alt testo per le immagini sul tuo sito. In questo modo gli utenti che non sono in grado di visualizzare le immagini sono rappresentati con un equivalente testuale. Si noti che non tutti i browser trattano il alt attributo allo stesso modo. A causa di ciò molti sviluppatori confondono lo scopo di alt e titolo, pensando erroneamente che le immagini con un alt l'attributo dovrebbe mostrare un suggerimento. In realtà, il titolo l'attributo è ciò che dovrebbe mostrare un suggerimento al passaggio del mouse (vedi l'esempio di Smashing Magazine sopra).
Uso di Pop Up per i contenuti
La maggior parte dei browser moderni garantisce che i tuoi contenuti verranno bloccati se si presentano sotto forma di pop-up. Ciò significa che corri il rischio di perdere diversi utenti che passano semplicemente quando si rendono conto che il tuo sito non è compatibile con la loro configurazione. Solo i visitatori più dedicati esamineranno il problema nelle tue pagine di aiuto per scoprire come risolvere il problema.
Etichette improprie sui moduli
Visita Mint.com (mostrato sopra) e controlla il modulo di iscrizione. Si noti che è possibile selezionare un campo specifico facendo clic sul campo stesso o sull'etichetta allegata. Questo perché gli sviluppatori di Mint stanno usando il etichetta elemento correttamente. La lezione qui è che semplicemente etichettare le tue forme con testo semplice non è sufficiente. Invece, dovresti sempre usare il etichetta elemento per massimizzare l'usabilità. Questo non solo fornisce campi facili da selezionare, ma garantisce anche che i lettori di schermo e le funzioni di riempimento automatico funzionino correttamente con i moduli.
Link irriconoscibili
Lo screenshot in alto mostra una sezione della homepage di Tutorial 9. Si noti che è possibile distinguere immediatamente tra il testo che contiene un collegamento e il testo che non lo fa. I modi più comuni per creare la differenziazione dei collegamenti includono il contrasto del colore, le sottolineature e gli effetti di rollover. Si noti che Tutorial 9 utilizza in realtà tutti e tre i metodi! Ciò aumenta notevolmente l'usabilità perché gli utenti possono vedere chiaramente dove fare clic se desiderano accedere a più contenuti.
Vago link di testo
Considera i seguenti esempi:
1. Per visitare la nostra galleria CSS, clicca qui.
2. Assicurati di fermarti alla nostra galleria CSS!
Mentre esegui la scansione di una pagina, è probabile che i tuoi occhi si concentrino su collegamenti differenziati più del resto del testo perché si distinguono. Il primo esempio potrebbe sembrare un buon modo per andare perché l'invito all'azione? Clicca qui? è ciò che cattura il tuo sguardo Tuttavia, senza leggere correttamente l'intera frase, fai clic qui? non ispira l'azione perché l'utente non è sicuro di dove conduce. Al contrario, il secondo link può essere immediatamente riconosciuto e inteso come un percorso verso una galleria CSS, indipendentemente dal fatto che l'utente abbia letto o meno il contenuto prima di esso.
Contenuto disordinato e spaziatura insufficiente
Il sito qui sopra è davvero più una parodia che un esempio appropriato, ma ha il significato di essere troppo divertente da non includere. In parole semplici, non scricchiolare i tuoi contenuti insieme o includere una quantità stravagante di immagini o testo (le notizie e i post del blog sono eccezioni). I proprietari di piccole imprese appena iniziato sul web quasi sempre cadono preda di questo errore e includono paragrafi dopo paragrafo di informazioni che nessuno leggerà mai. Piaccia o no, il web è una bestia visiva. Le informazioni sulla tua pagina devono essere chiaramente organizzate e facilmente comprensibili in pochi secondi.
La modifica della dimensione del carattere non dovrebbe rompere il layout
Non tutti sul web hanno 19 anni e sono 20/20. Molti utenti, giovani e meno giovani, devono aumentare le dimensioni del testo predefinito per rendere più leggibile una pagina. Scopri cosa succede a Fox News (e a molti altri siti di notizie popolari) quando aumenti le dimensioni del carattere. Il layout è completamente distrutto: i link di navigazione corrono tutti insieme, i pulsanti sono miglia dal loro testo associato e gli annunci che scorrono sul lato destro sono completamente scomparsi. Questa sorta di svista può allontanare una grande porzione di visitatori.
Scarsa contrasto tra testo e sfondo
Questi ragazzi potrebbero essere in possesso delle loro capacità progettuali, ma hanno rovinato la loro credibilità facendo così con un grafico che è quasi impossibile da leggere. Capisco che a volte i clienti richiedono l'uso di una fotografia d'archivio con zero spazio di copia, ma è il tuo lavoro come designer per capire come integrare un testo facilmente leggibile con l'immagine. Usa il grassetto, i tratti, le ombre esterne, le barre dei colori e qualsiasi altra cosa tu possa pensare per differenziare il tuo messaggio dal suo sfondo.
Uso eccessivo di Flash
Non interpretare erroneamente questo come un mantra Flash. Flash ha portato il web ad un livello di ricchezza che può far avverare i sogni più sfrenati di uno sviluppatore. Sono anche incline a essere risucchiato da un sito flash eccezionale e unico come il prossimo.Tuttavia, usa l'estrema cautela quando integri così tanto Flash nel tuo sito web che non funzionerà senza di esso.
Assicurati di considerare attentamente il motivo alla base dell'esistenza del sito e del tuo mercato di riferimento per il sito. Se vuoi creare un'applicazione online o un piacere per i visitatori, Flash potrebbe essere la soluzione giusta. Ma se il tuo mercato di riferimento è il pubblico in generale, un sito Flash tutto può essere una cattiva idea per una serie di motivi. Il primo è l'usabilità, gli sviluppatori di siti basati su Flash possono spesso essere così ossessionati dal fare qualcosa di carino che non si pensi a un utente che possa effettivamente capire come utilizzare il sito o meno. Ho notato che le agenzie pubblicitarie di grandi nomi tendono a seguire questa tendenza creando siti Web di qualità che possono richiedere alcuni minuti per capire come utilizzarli. Un altro motivo per evitare Flash è che molti utenti sono così infastiditi da Flash che lo disabilitano completamente. Infine, considera sempre se sia accettabile sacrificare i visitatori mobili. Molti smartphone come l'iPhone non supportano ancora il flash e sono quindi esclusi da molti siti Web tradizionali.
Menu a discesa complicati
C'è una linea sottile tra un menu utile e un pasticcio sovraccarico e gli sviluppatori di Microsoft stanno flirtando con esso. Da un lato, forniscono agli utenti un facile accesso alla loro linea completa di prodotti. D'altra parte, stanno lanciando molti più contenuti agli utenti di quanto non siano abituati in un semplice menu a discesa. Questo potrebbe essere accettabile se si fa clic su tutti i prodotti? pulsante ti porta in una pagina dedicata contenente l'elenco dei prodotti, ma non è questo il caso (cliccando solo si chiude il menu). Passa un minuto sul loro sito e vedrai che quasi tutti i menu di navigazione sono pieni zeppi di link piccoli (probabilmente difficili da leggere) e monotoni.
Il punto è che il sovrascrivere i menu di solito nasce da un tentativo di aumentare l'usabilità mentre in realtà ne risulta una diminuita usabilità a causa della quantità eccessiva di informazioni che devono essere controllate per arrivare dove si vuole andare.
Conclusione
Così ci sei, dodici semplici modi per rendere il tuo sito più amichevole con le masse. Spero che questo articolo ti abbia aiutato a individuare alcuni modi in cui puoi iniziare a migliorare l'accessibilità dei tuoi progetti. Fateci sapere cosa ne pensate di questi suggerimenti. Sentiti libero di non essere d'accordo su nessuno di essi e di essere sicuro di farci sapere tutte le piccole cose che ti infastidiscono in fatto di accessibilità.