Quando ho pubblicato la prima versione di questo articolo nel 2017, parlare di accessibilità web sembrava quasi un tema di nicchia, un “plus” per sviluppatori sensibili.
Oggi, il panorama è radicalmente cambiato: l’accessibilità è diventata un pilastro fondamentale del web design, sorretta da una legislazione rigorosa che non ammette più zone d’ombra.
L’ispirazione per questo articolo nasce dall’esperienza diretta con utenti non vedenti ed esperti di tecnologie assistive. Vedere il web attraverso i loro sensi trasforma completamente la prospettiva di chi progetta: navigare un sito non è più solo una questione di usabilità ed estetica, diventa una scelta di autonomia e diritti.
Si parla spesso di accessibilità, ma cosa significa avere un sito veramente accessibile?
Cos’è l’accessibilità di un sito web?
L’accessibilità è l’insieme di tecnologie e pratiche che assicura a qualunque persona di poter utilizzare gli strumenti digitali e fruire dei contenuti senza incontrare difficoltà, discriminazioni, anche in condizione di deficit o difficoltà fisiche quali ad esempio persone non vedenti, ipovedenti o impossibilitate ad utilizzare un mouse per navigare all’interno del sito.
Per esempio, l’accessibilità di un sito consente a una persona ipovedente o non vedente di navigarlo per mezzo di una tecnologia assistiva come lo screen reader, un software che legge ad alta voce tutto quello che le persone normodotate vedono sullo schermo.
L’Istat, nella sua pubblicazione “Conoscere il mondo della disabilità” edizione 2019 (l’ultima pubblicata ad oggi) indica che le persone con disabilità in Italia sono 3,1 milioni.
Il numero di siti web che consente l’utilizzo di contenuti accessibili con screen reader o altri strumenti di navigazione alternativi ai browser tradizionali è invece molto limitato.
Oggi il numero di persone non vedenti o ipovedenti che utilizza il web e, più in generale, app e altri strumenti digitali, è in continua crescita e consente la fruizione di moltissimi contenuti gratuitamente, ad esempio giornali e riviste in formato digitale, e-commerce e app per la spesa o per ordinare cibo a domicilio, oltre che ad app specifiche che permettono di inquadrare un oggetto e farselo descrivere vocalmente oppure ottenere il colore di un capo di abbigliamento inquadrato con la fotocamera.
Cosa prevede il quadro normativo?
L’accessibilità è un requisito obbligatorio nei siti della Pubblica Amministrazione ed è regolamentata da una serie di leggi tra le quali la Direttiva UE 2016/2102 del Parlamento Europeo pubblicata il 26 ottobre 2016 e relativa a “Accessibilità dei siti web e delle applicazioni mobili degli enti pubblici”.
Dal 23 settembre 2020 a tutti i siti della Pubblica Amministrazione, pubblicati prima del 23 settembre 2018, è stato imposto l’adeguamento alle linee di accessibilità, e la pubblicazione della “Dichiarazione di Accessibilità” che consente l’invio di segnalazioni da parte degli utenti.
Se in passato l’obbligo riguardava solo la Pubblica Amministrazione, dallo scorso 28 giugno 2025, il recepimento dell’European Accessibility Act (EAA) tramite il D.Lgs. n. 82/2022 ha segnato una svolta precisa nel mondo dell’accessibilità dei siti web.
L’European Accessibility Act stabilisce l’obbligo di accessibilità anche nel settore privato per tutti i siti che erogano servizi o che vendono prodotti online, con l’unica esclusione delle “microimprese”, ossia delle imprese che occupano meno di 10 persone e realizzano un fatturato annuo oppure un totale di bilancio annuo non superiore a 2 milioni di Euro.
L’AgID (Agenzia per l’Italia Digitale) ha poteri sanzionatori reali nei confronti delle aziende che non rispettano i requisiti WCAG 2.1 (o successivi), con multe che possono arrivare fino al 5% del fatturato, oltre all’obbligo di adeguamento immediato.
Cos’è e come funziona uno Screen Reader?
Per capire bene l’accessibilità, bisogna conoscere le tecnologie assistive, una delle più diffuse ed utilizzate è lo Screen Reader (o lettore di schermo). È un software che riconosce ed interpreta il codice di una pagina e ne trasforma i contenuti in una descrizione vocale. L’applicazione analizza i contenuti mostrati sullo schermo per poi restituirli all’utente tramite un software di sintesi vocale altrimenti detto text-to-speech (TTS).
I software di sintesi vocale più usati sono Utility VoiceOver di Apple per sistemi operativi Mac OS e iOS e Assistente Vocale di Windows per sistemi operativi Windows.
Uno degli screen reader più conosciuti ed utilizzati è sicuramente NVDA (Non visual desktop access), software gratuito e open source per sistemi operativi Windows. Altro software molto valido ma altrettanto costoso è Jaws, acronimo di “Job Access With Speech” distribuito dalla software house Freedom Scientific.
Presenti sul mercato da molti anni, strumenti come NVDA (software open source per Windows) e JAWS oggi si sono evoluti enormemente grazie all’IA.
La quotidianità degli utenti negli ultimi anni è migliorata grazie anche ad app come Microsoft Seeing AI (ora totalmente in italiano) e Envision AI, che permettono di leggere testi fisici, riconoscere oggetti e descrivere ambienti in tempo reale. Per la mobilità, strumenti come Lazarillo GPS hanno affinato la precisione, rendendo il web e il mondo fisico un unico ecosistema accessibile.
Quali sono gli aspetti da considerare nella creazione di un sito accessibile?
Per essere conforme alle linee guida WCAG sull’accessibilità, un sito deve rispettare quattro principi: deve essere percepibile, utilizzabile, comprensibile e robusto. In concreto, ecco cosa serve:
Gerarchia dei contenuti
Usare i tag HTML (H1, H2, H3, P) correttamente. Uno screen reader permette all’utente di saltare da un titolo all’altro; se la gerarchia è sbagliata, l’utente si perde.
Mantenere i paragrafi di testo ordinati e accertarsi che sia possibile ingrandirli fino al 200% mantenendo la leggibilità inalterata (per i testi inseriti all’interno di fondi colorati assicurarsi che l’ingrandimento del testo non vada a collocare parte del testo al di fuori del fondo).
Contrasto e colore
I contenuti devono avere un contrasto elevato rispetto allo sfondo (rapporto minimo 4.5:1), per essere visibili e distinguibili in modo chiaro. Evitare combinazioni di colori che creino fastidio nella lettura, quali ad esempio fondo verde e testo rosso oppure fondo rosso e testo blu.
Occorre fare attenzione anche alle combinazioni di colore che possano confondere gli utenti con problemi di daltonismo (per verificare se il tuo sito è accessibile alle persone daltoniche puoi utilizzare il tool Colorblind Web Page Filter che mostra come il sito è visualizzato con i vari tipi di daltonismo).
Evitare di affidare l’informazione solo al colore (per esempio: “clicca sul tasto verde” è inutile per una persona daltonica).
Alternative testuali
Ogni immagine deve avere un attributo alt descrittivo.
Il tag “alt” o “alternative text” è il testo alternativo abbinato a una immagine che consente di capire cosa si sta guardando utilizzando uno screen reader o, in caso di connessione lenta, in attesa che il caricamento dell’immagine sia completato.
Per svolgere il suo compito in modo corretto il tag “alt” deve contenere una descrizione sintetica ma chiara dell’immagine; un tag “alt” corretto per una immagine raffigurante una villa con piscina fotografata di notte è “villa con piscina e giardino di notte”, mentre è da evitare un campo “alt” vuoto o con una dicitura come “IMG_2015.jpg” che renda impossibile capire cosa si sta guardando. Se un’immagine comunica un’emozione o un’informazione, lo screen reader deve poterla raccontare.
Form, moduli e captcha
Nella creazione di form e moduli utilizzare le etichette (label) in ogni campo per agevolare la compilazione e segnalare eventuali errori e campi non compilati, evitando l’utilizzo dei soli campi segnaposto (placeholder). Per gli avvisi di compilazione errata o incompleta utilizzare dei campi testuali ben visibili, evitando le “classiche” diciture di errore in colore rosso che molto spesso non sono percepite da persone con problemi di daltonismo.
L’utilizzo di un Capcha per aumentare il livello di protezione antispam nei form di un sito web va utilizzato sono nelle versioni “invisibili” che non richiedono interazione da parte delle persone. In caso contrario il Captcha non riesce ad essere interpretato da screen reader e tecnologie di assistenza.
Al contrario non ci sono problemi nell’utilizzo della tecnologia “Double Opt-In” per l’iscrizione a newsletter e liste di mail marketing.
Video e file allegati
I video e i contenuti multimediali caricati all’interno del sito (o ad esso collegati da piattaforme esterne come Youtube o Vimeo tramite un iframe o un player video) devono essere forniti di didascalie o sottotitoli. Inoltre deve essere possibile agire sui vari comandi del lettore multimediale anche senza l’utilizzo del mouse.
Dove è previsto il download di documenti, moduli, guide o altro gli allegati devono essere caricati in formati testuali interpretabili dagli screen reader quali, ad esempio, Word e Excel.
Nell’utilizzo di file PDF va verificato che i documenti abbiano origine da documenti testuali; in caso contrario, ad esempio per scansioni di documenti salvati in formato PDF, gli screen reader interpreteranno il file come immagine e non potranno fornire un contenuto audio.
Navigabilità da tastiera
Molti utenti non usano il mouse. Se un menu o un pulsante non è raggiungibile con il tasto “Tab”, quel sito è una barriera architettonica digitale.
Quali sono gli strumenti di validazione?
Oggi esistono metodi di validazione molto efficienti per l’accessibilità delle pagine di un sito.
Il primo metodo si basa sullo strumento WAVE, un’estensione del browser Chrome.
Il funzionamento è molto semplice e i risultati sono immediati. Aprendo il sito web alla pagina da validare e richiamando l’estensione, WAVE mostra in una finestra laterale l’elenco di errori e di messaggi di attenzione, gli stessi che si possono vedere “live” sulla pagina aperta nel browser con la possibilità di cliccare sull’icona dell’errore per visualizzarne la descrizione dettagliata.
Il secondo metodo che ho testato è il tool axe DevTools, anche questo è un’estensione del browser Chrome.
Il funzionamento è molto simile a quello di WAVE, i risultati sono però visibili nella finestra di ispezione di Chrome alla quale si accede dagli strumenti degli sviluppatori.
Il terzo metodo è basato su Lighthouse by Google, strumento integrato in Chrome che consente un controllo rapido del livello di accessibilità del sito.
L’ultimo metodo di verifica non è un tool ma un test manuale e consiste nel navigare le pagine di un sito con uno screen reader per capire come vengono “lette” e interpretate le pagine.
È il test più importante perché nessuno strumento può sostituire il test di un utente reale con uno screen reader o con un browser braille.
Qual strategia seguire? Aggiornare o rifare?
Una delle domande più frequenti che mi arriva dai clienti è: “Posso sistemare il mio sito attuale o devo ripartire da zero?”
La risposta, come spesso in questi casi, dipende dal tipo di sito e dalle sue condizioni attuali.
Se il sito è recente (2-3 anni), costruito con un CMS di ultima generazione, e le mancanze sono dovute soprattutto alla mancanza di testi alternativi, etichette o allo scarso contrasto tra i contenuti e lo sfondo, è possibile adeguare le pagine intervenendo su CSS e contenuti del CMS.
È la scelta più rapida ed economica per aumentare il livello di accessibilità.
Se invece il sito è datato o sviluppato con tecnologie obsolete, il rifacimento è la strada più conveniente invece di investire tempo e risorse nella correzione del vecchio sito.
Un nuovo sito garantisce performance migliori e conformità nativa alla normativa attuale.
Nel caso di e-commerce vanno analizzati con attenzione i processi di acquisto (checkout) per verificare se siano o meno navigabili da tastiera.
La scelta tra adeguamento e rifacimento passa soprattutto dal flusso di acquisto e dipende dal livello di accessibilità attuale e dagli altri processi attivi sul sito (personalizzazione prodotti, vendita ibrida di prodotti fisici e virtuali, gestione smart di ordini e fatture, ecc.).
Conclusioni
L’accessibilità non è un limite alla creatività, ma una sfida per un design migliore. Come emerso dai confronti con chi vive queste difficoltà ogni giorno, un sito accessibile è semplicemente un sito fatto meglio: più veloce, più facile da navigare per tutti e meglio indicizzato dai motori di ricerca.
Ritengo che il problema debba essere affrontato su due piani diversi; da un parte una maggiore attenzione nel lavoro di sviluppo, dall’altra un percorso di formazione per aumentare la consapevolezza dell’accessibilità in web designer e sviluppatori.
La chiacchierata con persone ipovedenti è stata davvero una esperienza utile per capire quali sono le problematiche più diffuse nei siti in rete e quali possono essere le soluzioni da adottare. Per loro e per le altre persone con disabilità il web può e deve essere uno strumento utilissimo, a condizione che possano accedervi in totale libertà.
Oggi non è più solo una questione di etica, ma di professionalità e conformità legale. Rendere il proprio spazio digitale accessibile significa smettere di escludere milioni di potenziali utenti.
Vuoi richiedere l’analisi dell’accessibilità per il tuo sito web?
Scrivimi una mail e mandami il link del tuo sito, potrai ricevere l’analisi gratuita col tool WAVE e poi valutare eventuali interventi di adeguamento da apportare sul sito.
