Senior Web designer freelance

Ecco quali sono le caratteristiche di un sito accessibile

In questo articolo ti spiego quali sono le caratteristiche di un sito web accessibile e perchè è davvero importante applicare questi piccoli accorgimenti che rendono la vita facile a chi è diversamente abile

Oggi parliamo di accessibilità web e di come realizzare siti web professionali accessibili anche per le persone diversamente abili.

Cosa intendo per persone diversamente abili?

Le persone diversamente abili hanno disabilità o limitazioni fisiche, cognitive o sensoriali che possono influire sulla loro capacità di utilizzare dispositivi digitali e quindi accedere a contenuti online.

Queste persone sono molto più numerose di quello che tu possa immaginare e spesso non possono navigare nel modo tradizionale usufruendo di tutte le informazioni online.

Secondo il Parlamento Europeo sono circa 80 milioni le persone in Europa con disabilità e circa 215 milioni le persone che hanno gravi problemi di vista.

Tra queste 1 persona su 4 non naviga online perché la maggior parte dei siti web hanno al loro interno problematiche che non gli permettono di visualizzare correttamente il sito web.

Secondo il “rapporto sull’accessibilità del 2023circa il 98% dei siti online ha l’home page non accessibile.

Questo cosa significa? Che circa 53 milioni di persone non possono navigare perché la loro disabilità non viene tenuta in considerazione nel momento della progettazione dei siti web.

Secondo Institute for Disability Research, Policy, and Practice il 96,3% delle home pages analizzate presenta errori tali da non permettere alle persone diversamente abili di navigare in modo corretto.

Screenshot del report dove vengono mostrati gli errori più comuni presenti nelle home pages online nel 2023.

Report di  Institute for Disability Research, Policy, and Practice

Stiamo parlando di errori che potrebbero essere evitati facilmente: testi e colori poco contrastati, alt text mancanti, collegamenti ipertestuali rotti..

La responsabilità è soprattutto di noi web designers e UX designers. Siamo noi che abbiamo il compito di rendere i progetti web accessibili a tutti.

Ti sei mai chiesto come fa un ipovedente a navigare su internet? Come fa a sapere dove deve cliccare se non può vedere lo schermo? Come fa a capire cosa rappresenta l’immagine pubblicata?

Queste persone sono aiutate da degli screen reader, software che leggono ad alta voce ogni testo visibile (e non visibile) presente nella pagina.

Se un sito web è stato progettato e realizzato in modo accessibile, anche una persona ipovedente o non vedente può leggere ciò che scriviamo.

Grazie alla Legge Stanca, del 2004  è stato trattato l’argomento legato all’accessibilità: questa legge tratta le “Disposizioni per favorire l’accesso dei soggetti disabili agli strumenti informatici”, in poche parole sono state stilate alcune caratteristiche tecniche che i siti della pubblica amministrazione devono obbligatoriamente  avere per poter permettere l’accesso anche alle persone con diversi problemi di salute.

Accessibilità web: Quali sono le caratteristiche che deve avere un sito accessibile?

Un sito web accessibile deve essere progettato e sviluppato in modo tale da consentire l’accesso e l’uso efficace da parte di tutte le persone, indipendentemente dalle loro abilità o disabilità.

Ma quali sono le caratteristiche che non devono assolutamente mancare?

Testo Alternativo per le Immagini

Un sito web accessibile deve fornire descrizioni testuali alternative delle immagini in modo che gli utenti non vedenti o con problemi di visione possano comprendere il contenuto.

campo in cui inserire l'alt text
campo in cui inserire l’alt text

Struttura Logica e Intuitiva

Il contenuto del sito web e di ogni singola pagina deve essere organizzato in modo logico e intuitivo. In poche parole le informazioni devono essere facilmente raggiungibili.

Contrasto dei Colori

I colori scelti devono essere abbastanza contrastati da permettere una buona visualizzazione e lettura anche per chi è ipovedente o daltonico.

Adobe offre un tool gratuito per controllare i contrasti di palette.

Inserendo i colori della propria palette è possibile sapere se sono abbastanza contrastati e quali abbinamenti fare.

Schermata di Adobe che offre un tool gratuito per testare i contrasti tra i colori
Schermata di Adobe che offre un tool gratuito per testare i contrasti tra i colori

Scelta ideale: scritte nere su sfondo bianco o viceversa, evitare sfumature di colore quasi tono su tono ed effetti luminosi e lampeggianti. Troppi effetti sui testi rendono difficile la lettura per chi soffre di crisi epilettiche.

Navigazione senza mouse

Garantire che il sito possa essere navigato completamente utilizzando solo la tastiera, in modo da essere accessibile anche a chi ha problemi motori o non utilizza un mouse.

Sottotitoli e Trascrizioni per i video e contenuti audio

Importante è rendere disponibili i propri contenuti in più formati.

Se una persona ha problemi di udito per esempio, potrà leggere la trascrizione delle contenuto audio proposto, oppure potrà leggere i sottotitoli del video pubblicato.

Adattabilità e navigazione da ogni dispositivo

Per garantire una buona navigazione, un sito web accessibile deve essere responsive, cioè, la sua struttura deve adattarsi perfettamente ad ogni dispositivo mutlimediale.

Leggibilità del Testo

E’ estremamente importante offrire opzioni per regolare la dimensione del testo e scegliere combinazioni di colori adatte per facilitare la lettura.

Links descrittivi

Descrivere a che cosa rimanda il collegamento che abbiamo inserito sul nostro sito è importante per chi ha problemi di visita.

Ad esempio: se vuoi far scaricare una guida non inserire semplicemente la scritta “Clicca qui” con il link alla guida, ma piuttosto inserisci un pulsante con scritto “Scarica la guida su come installare WordPress”.

In questo modo, lo screen reader può leggere in modo appropriato ciò che hai scritto e la persona saprà che cliccando sul pulsante indicato scaricherà la guida di installazione di WordPress.

Form contatti facili da compilare

Punto dolente di molti siti web: il form contatto.

I form contatto devono essere chiari e semplici da utilizzare.

Puntare sulle etichette e nel caso di un form complesso, con tanti campi da compilare, aggiungere la compilazione assistita che indica all’utente a che punto della compilazione si trova.

L'immagine sopra mostra come si può rendere accessibile un form molto articolato.
Il pulsante in basso con scritto "avanti" e la barra azzurra che indica la percentuale di avanzamento

L’immagine sopra mostra come si può rendere accessibile un form molto articolato.
Il pulsante in basso con scritto “avanti” e la barra azzurra che indica la percentuale di avanzamento

Dopo la compilazione e il click di invio, inserire un feedback visivo o un messaggio di avvenuta spedizione del messaggio, magari utilizzando la tecnica del microcopywriting.

Strumenti di Assistenza Compatibili:

Verificare che il sito web sia  compatibilità con tecnologie assistive, come ad esempio screen reader, screen magnifiers e altri dispositivi specializzati.

Compatibilità con Standard Internazionali:

Seguire le linee guida di accessibilità web, come il Web Content Accessibility Guidelines (WCAG), per garantire una progettazione accessibile e conforme agli standard internazionali.

Integrare queste caratteristiche può migliorare notevolmente l’accessibilità del sito web e consentire a una più ampia gamma di utenti di interagire con successo con i contenuti online.

Responsive

Un sito web accessibile deve adattarsi ad ogni dispositivo mobile e fisso (pc, smartphone e tablet). Proprio su questo argomento ho scritto un articolo, leggi l’articolo “sito web responsive, 27 milioni di motivi per averlo”

Conclusioni

Se vuoi che il tuo sito web venga visualizzato e navigato da tutte le persone in modo corretto e che non discrimini nessuno, migliora la sua accessibilità, seguendo le linee guida elencate in questo articolo e quelle indicate nel blog dell’ Institute for Disability Research, Policy, and Practice.

Se invece vuooi far valutare da un esperto l’accessibilità e l’usabilità del tuo sito web, prenota un’analisi sito web

condividi l'articolo

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *