Accessibilità Web 101: Progettare per tutti

Il web design riguarda l'accessibilità. La maggior parte dei web designer mira a creare prodotti per la più ampia fascia di persone all'interno del proprio pubblico, lanciando i propri progetti come reti aperte per ottenere il maggior afflusso di utenti.

E mentre c'è una logica in quel principio di progettazione, mette in ombra un principio in qualche modo più semplice e inclusivo: design per tutte le persone, non per la maggior parte.

Ottimizza i contenuti in modo che ogni possibile utente possa godere e interagire con il tuo sito web e accedere alle informazioni e ai dati disponibili. Impegnarsi in questa pratica aiuterà a sviluppare un mercato più ampio e a diversificare la base di clienti. Il 15% della popolazione mondiale ha un certo livello di disabilità.

Si tratta di persone che, come chiunque altro, utilizzano spesso Internet e fanno molto affidamento sulla comunicazione e sugli strumenti digitali. L'ottimizzazione del tuo sito Web per garantire agli utenti un'esperienza eccezionale può espandere la tua rete di interazione. Attraverso la pratica dell'inclusione nel tuo design, sarai in grado di raggiungere milioni di persone che sono spesso trascurate.

Progettare per l'accessibilità non deve essere difficile. Deve solo essere semplice e premuroso nei confronti di tutti i potenziali utenti. Ecco come ottimizzare il tuo sito web per la massima accessibilità.

Comprendi i tuoi utenti

Conoscere il tuo pubblico è fondamentale in qualsiasi progetto, quindi è il miglior punto di partenza. Comprendi che i tuoi utenti possono includere individui con capacità diverse. Alcuni dei tuoi utenti potrebbero essere ipoudenti o ipovedenti, altri potrebbero avere disturbi convulsivi, altri potrebbero avere ancora problemi di mobilità.

Anche se non puoi progettare per ogni possibile scenario, amplierai il tuo orizzonte di progettazione se ti prendi il tempo per pensarne il più possibile. Dopo aver pensato al tuo pubblico allargato, fai qualche ricerca. Leggi casi di studio, parla con amici che hanno esperienze, consulta le guide sull'accessibilità.

Magari prova a prendere una pagina dal campo educativo, i principi del design universale sono un buon riferimento.

Pensa a UX

Ora che hai sviluppato una comprensione con i tuoi futuri utenti, inserisci quella comprensione nel tuo framework di esperienza utente (UX). Questo passaggio ti aiuterà a entrare in empatia con i tuoi utenti e a considerare cose a cui potresti non aver pensato prima. Ti indicherà anche la direzione di un'ampia varietà di definizioni di tecnologie assistive.

Proprio come un designer dovrebbe considerare il comportamento di un sito Web in tutti i principali browser, le tecnologie assistive dovrebbero far parte dell'elenco di controllo delle funzionalità. A volte, anche i più piccoli cambiamenti nel web design possono aprire nuove porte agli utenti disabili.

Un semplice cambiamento

Ad esempio, forse la modifica più semplice da implementare è il modo in cui utilizzi i tag di enfasi.

Visivamente, non c'è differenza tra <b> e <strong> , né <i> appare in modo diverso da <em> . Ma per le persone con disabilità, questi tag possono cambiare drasticamente le loro esperienze utente.

Sebbene rendano lo stesso, effettivamente grassetto e corsivo , la differenza tra questi tag è la loro funzione. Mentre i tag più semplici in grassetto e corsivo sono rappresentativi (cambiando il modo in cui il testo viene visualizzato), forte ed enfasi indica diversi modelli vocali per la tecnologia assistiva.

Ma non è così semplice sostituire ciecamente tutti i <b> con <strong> . Molte intestazioni usano il testo in grassetto per il contrasto, ad esempio, ma forse non è meglio che gli utenti con disabilità sperimentino un tag <strong> qui. Pensa: "Questo testo deve essere pronunciato in modo diverso affinché un utente possa sperimentarne il pieno significato?" In caso contrario, considera di eliminare <strong> o <em> meno che non siano realmente necessari.

Sottili modifiche e considerazioni come questa possono fare la differenza per gli utenti con disabilità. È importante aggiornare e non eseguire il downgrade dell'UX.

Progettare per non vedenti

Sebbene i consigli di cui sopra avvantaggiano già i non vedenti, non tutte le persone con problemi visivi avranno lo stesso livello o tipo di menomazione. È altrettanto importante offrire opzioni in grado di accogliere coloro che conservano l'uso della vista.

Considera questi elementi:

• Consenti agli utenti di ingrandire il carattere. La maggior parte dei browser lo farà con o senza il tuo consenso, ma sembrerà più bello se hai preparato CSS per questo.
• Evita alcune combinazioni di colori come rosso e verde o blu e giallo. Invece, perché non utilizzare il colore per aumentare le conversioni aumentando l'accessibilità?
• Codice nel "testo alternativo". Il testo alternativo può essere letto dalla tecnologia assistiva e spiegare qualsiasi grafica sulla pagina.
• Usa i punti nelle abbreviazioni, anche quelle note. Il modo in cui uno screen reader elabora le informazioni è spesso fonetico: immagina di sentire "Fibby" contro l'FBI

Per ulteriori informazioni sui modi per incorporare elementi per utenti ipovedenti, consulta l'American Foundation for the Blind.

Progettare per i non udenti

Sebbene i non udenti richiedano meno alloggi, le recenti tendenze nell'uso dei video sui siti Web hanno aumentato la necessità di scelte di design intelligenti. Pertanto, se il tuo sito Web incorpora componenti uditivi, utilizza i sottotitoli o l'interpretazione del linguaggio dei segni.

Evita la tentazione di utilizzare i sottotitoli automatici: fermati a qualsiasi video casuale che è stato elaborato utilizzando la trascrizione automatica per vedere traduzioni di parole che non hanno senso e possono essere conteggiabili.

Per le linee guida specifiche per i sottotitoli, le raccomandazioni della National Association of the Deaf sono disponibili qui.

Progettare per l'epilessia fotosensibile

Uno dei problemi di progettazione relativi all'uso prevalente del video, in particolare il video che utilizza una funzione di riproduzione automatica, circonda gli utenti che soffrono di epilessia fotosensibile. Questi utenti possono sperimentare convulsioni innescate da effetti di tipo luce stroboscopica o immagini in movimento. I web designer possono utilizzare lo strumento di analisi dell'epilessia fotosensibile per verificare la probabilità che il loro contenuto scateni un attacco.

Se il contenuto è identificato come a rischio ma non può essere modificato per ridurre il rischio, avvisa sempre del potenziale e non riprodurre automaticamente il video. Assicurati che l'avviso sia visibile e vicino al pulsante di riproduzione.

Progettare per problemi di mobilità

Alcuni problemi di mobilità varieranno dalla perdita totale del controllo motorio fine a un lieve tremore. Entrambi i livelli di compromissione comportano la stessa esperienza utente su un sito Web che non li ha considerati:

• Gli utenti devono fare uno sforzo maggiore per raggiungere i collegamenti e potrebbero stancarsi rapidamente.
• Gli utenti non possono navigare nel sito perché non consente l'uso della tastiera.
• Il dover scorrere una pagina lunga provoca fatica perché non è disponibile l'opzione "torna all'inizio" o salta.

I siti ottimizzati per il touch screen o l'input del mouse possono presentare conseguenze più gravi per le persone con mobilità ridotta, rendendo il sito inutilizzabile.

Incorporare elementi di design come la navigazione che può essere gestita utilizzando la tastiera e frequenti link di ancoraggio che possono attirare l'utente in diverse sezioni della pagina può aiutare molto questi utenti.

Crea un'opzione del sito web "di base".

Il tuo design è impeccabile, interattivo e sorprendente, utilizza le ultime e migliori tendenze disponibili sul mercato aperto ed è a malapena accessibile per nessuno degli utenti sopra descritti.

Se suona come il tuo web design, un'alternativa più semplice può essere la creazione di un layout "semplice" che gli utenti possono attivare e disattivare. Questo non piacerà solo agli utenti disabili: per gli utenti che soffrono di emicrania innescata da un contrasto elevato, ad esempio, avere un interruttore di facile accesso può fare la differenza tra diventare un cliente o partire per affrontare un'emicrania di tre ore.

Non fermarti neanche qui. Applica la stessa opzione per i tuoi elenchi di abbonamenti, consentendo agli utenti di modificare facilmente le proprie preferenze prima di ricevere l'email marketing.

Continua a capire i tuoi diversi utenti. Continua a pensare a loro. Più capisci ed entri in empatia con i tuoi utenti, più facile diventerà il design dell'esperienza utente accessibile. Chissà? Potresti persino cambiare il mondo di qualcuno.