Accessibilità Web e WCAG 2.1 Livello AA: cosa prevede la norma (spiegata facile)

Autrice: Viola Niccolai

Tempo di lettura:

17–26 minuti

Accessibilità digitale cosa prevede la normativa

Il 28 giugno 2025 è entrato in vigore l’European Accessibility Act (EAA).

La normativa impone a tutte le aziende private che contano più di 10 dipendenti OPPURE hanno un fatturato di oltre 2 milioni di Euro/anno (quindi non configurabili come microimprese nel proprio bilancio annuale) di avere siti web e servizi digitali accessibili, se praticano online commercio B2C.

Le disposizioni sono tutte contenute nel testo della UNI EN 301549 (186 simpatiche pagine scritte in tecnichese stretto, che ti tradurrò in italiano facile nel corso di questo articolo).

Aziende private coinvolte

Sei soggetto a rispettare la norma, quindi, se rientri almeno in uno dei due parametri sopra citati (+10 dipendenti OPPURE 2mln€/anno di fatturato).

Esempio:

Hai 15 dipendenti e fatturi 1mln/anno?
Sei impattato dalla norma perché hai più di 10 dipendenti, anche se non raggiungi 2mln/anno di fatturato.

Hai 8 dipendenti e fatturi 2,5mln/anno?
Sei impattato dalla norma perché fatturi +2mln/anno, anche se hai meno di 10 dipendenti.

Hai 6 dipendenti e fatturi 1,8mln/anno?
NON sei obbligato a rispettare la norma.

Contenuti da rendere accessibili

L’European Accessibility Act obbliga le aziende sopra descritte a rendere accessibili i servizi digitali offerti ai loro utenti.

Quali sono i settori impattati dalla normativa?

ART. 2 – comma 2 della direttiva UE 2019/882

Fatto salvo l’articolo 32, la presente direttiva si applica ai servizi seguenti forniti ai consumatori dopo il 28 giugno 2025:

a. servizi di comunicazione elettronica, a eccezione di servizi di trasmissione utilizzati per la fornitura di servizi da macchina a macchina;

b. servizi che forniscono accesso a servizi di media audiovisivi;

c. gli elementi seguenti relativi ai servizi di trasporto passeggeri aerei, con autobus, ferroviari e per vie navigabili, ad eccezione dei servizi di trasporto urbani, extraurbani, e regionali, per i quali si applicano solo gli elementi di cui al punto v):

    i. siti web;

    ii. servizi per dispositivi mobili, comprese le applicazioni mobili;

    iii. biglietti elettronici e servizi di biglietteria elettronica;

    iv. fornitura di informazioni relative ai servizi di trasporto, comprese le informazioni di viaggio in tempo reale; per quanto riguarda gli schermi informativi ciò si limita agli schermi interattivi situati nel territorio dell’Unione; e

    v. terminali self-service interattivi situati nel territorio dell’Unione, a eccezione di quelli installati come parti integranti su veicoli, aeromobili, navi e materiale rotabile utilizzati per la fornitura di una qualsiasi parte di tali servizi di trasporto passeggeri;

d. servizi bancari per consumatori;

e. libri elettronici (e-book) e software dedicati;

f. servizi di commercio elettronico.

Per essere ritenuti accessibili i siti web e i servizi digitali dovranno rispettare quanto previsto nella UNI EN 301549, che a sua volta rimanda alle linee guida WCAG 2.1 (fino al livello AA).
(Altri tanti simpatici punti scritti in tecnichese, che tradurrò in italiano nel prossimo paragrafo).

È importante sottolineare che anche per realtà più piccole, l’accessibilità è una buona pratica etica e professionale, che migliora l’esperienza per tutti (non solo per chi ha una disabilità riconosciuta).

ATTENZIONE: la normativa è in evoluzione. (Novità giugno 2026)

È stata depositata una nuova bozza della UNI EN 301549 (v. 4.1.0) in cui si stabilisce che le nuove linee guida di riferimento saranno le WCAG 2.2.
La norma tecnica è in fase di approvazione e si stima che verrà ufficializzata entro fine anno 2026.

Cosa cambia nel concreto rispetto alle WCAG 2.1?
Sono stati aggiunti 6 nuovi criteri di successo ed è passato come obsoleto il criterio 4.1.1 Analisi sintattica (livello A).
Qui trovi l’articolo in cui parlo dei nuovi criteri introdotti dalle WCAG 2.2.

Cosa sono le WCAG 2.1

Le WCAG 2.1Web Content Accessibility Guidelines – sono delle linee guida internazionali pensate per rendere i contenuti digitali accessibili a tutte le persone, inclusi utenti con disabilità visive, uditive, motorie o cognitive.

In pratica, sono uno standard tecnico che indica come progettare siti e interfacce in modo che siano usabili da chiunque, senza barriere.

Queste linee guida si dividono in tre livelli di conformità:

Livello A (base)

Livello AA (intermedio)

Livello AAA (avanzato)

La normativa prevede che sia rispettata, al minimo, la conformità fino al livello AA (ovvero A+AA).

I 4 principi delle WCAG 2.1

Le WCAG si basano su 4 principi fondamentali: Percepibile, Operabile, Comprensibile, Robusto.

Percepibile: il contenuto deve essere presentato in modo che tutte le persone possano percepirlo (es. testi ben leggibili, alternative testuali per immagini e video…).

Operabile: il sito deve potersi navigare facilmente anche senza mouse (es. solo con la tastiera o comandi vocali).

Comprensibile: i contenuti e le interazioni devono essere chiari, prevedibili e ben organizzati.

Robusto: il sito deve essere compatibile con le tecnologie assistive (come lettori vocali), oggi e in futuro.

I 20 criteri da rispettare per essere conformi al livello AA

Qui sotto troverai i criteri di successo previsti per il livello AA delle WCAG 2.1, accompagnati da una spiegazione semplice e non tecnica.

Questa è la checklist base da tenere a mente per progettare (o aggiornare) un sito che sia davvero inclusivo e conforme.

In corsivo riporterò il testo contenuto nelle WCAG 2.1 ed a seguire una breve spiegazione.

1. Percepibile

1.2.4 Sottotitoli (in tempo reale)
Per tutti i contenuti audio in tempo reale sotto forma di media sincronizzati sono forniti sottotitoli.”

Significa che: se fai una diretta con l’audio (es. una live su Zoom o un video in streaming), chi non sente bene dovrebbe poter leggere i sottotitoli.

1.2.5 Audiodescrizione (preregistrata)
Per tutti i contenuti video preregistrati sotto forma di media sincronizzati è fornita una audiodescrizione.”

Significa che: nei video registrati, dovresti offrire una voce o un testo che spiega cosa succede nelle scene per chi non può vederle.

1.3.4 Orientamento
La visualizzazione e il funzionamento di un contenuto non dipendono dall’orientamento dello schermo, ad esempio verticale o orizzontale, a meno che questo non sia essenziale.”

Significa che: il sito deve funzionare bene sia in verticale che in orizzontale (pensa allo smartphone girato).

1.3.5 Identificazione dello scopo dell’input
Lo scopo di ciascun campo di input che raccoglie informazioni sull’utente può essere determinato programmaticamente.”

Significa che: nei moduli (es. iscrizione alla newsletter), serve indicare bene a cosa serve ogni campo, così che anche gli strumenti per chi ha disabilità lo capiscano.

1.4.3 Contrasto (minimo)
Il testo (e le immagini di testo) presenta un rapporto di contrasto di almeno 4.5:1, salvo eccezioni.”

Significa che: il testo deve essere abbastanza leggibile rispetto allo sfondo. No scritte grigine su sfondi chiari, insomma (puoi usare questo tool per verificare accessibilità contrasto di colore).

1.4.4 Ridimensionamento del testo
“Salvo per le didascalie e le immagini di testo, il testo può essere ridimensionato fino al 200% senza l’ausilio di tecnologie assistive e senza perdita di contenuto o funzionalità.”

Significa che: chi ha bisogno di ingrandire il testo deve poterlo fare usando la rotellina del mouse e la grafica deve restare integra all’interno della pagina, senza dover scorrere orizzontalmente.

1.4.5 Immagini di testo
“Se le tecnologie che sono utilizzate possono raggiungere l’effetto visivo, viene utilizzato testo reale piuttosto che immagini di testo, salvo eccezioni.”

Significa che: se vuoi scrivere qualcosa dentro un’immagine, usa testo vero in modo che sia leggibile dagli screen reader.

1.4.10 Ricalcolo del flusso
“Il contenuto può essere ripresentato senza perdita di informazioni o funzionalità e senza richiedere lo scorrimento in due dimensioni per: contenuto a scorrimento verticale con una larghezza equivalente a 320 CSS pixel; contenuto a scorrimento orizzontale ad un’altezza equivalente a 256 CSS pixel.”

Significa che: il sito si deve adattare a schermi piccoli (tipo smartphone), senza dover scorrere in tutte le direzioni per leggere tutto.

1.4.11 Contrasto in contenuti non testuali
“La presentazione visiva dei componenti dell’interfaccia utente e degli oggetti grafici ha un rapporto di contrasto di almeno 3:1 rispetto agli elementi adiacenti.”

Significa che: così come i testi piani (punto 1.4.3) anche i bottoni, icone e altri elementi visivi devono avere colori ben contrastati per essere visibili da chi ha difficoltà visive (puoi usare questo tool per verificare accessibilità contrasto di colore).

1.4.12 Spaziatura del testo
“Nessuna perdita di contenuto o funzionalità si verifica quando gli utenti modificano: l’altezza della linea, la spaziatura dei paragrafi, la spaziatura delle lettere e la spaziatura delle parole.”

Significa che: se una persona ha bisogno di più spazio tra le righe o tra le parole, il sito deve funzionare lo stesso.
(Spesso vengono utilizzate estensioni per browser tipo questo Editor di spaziatura del testo)

1.4.13 Contenuti al passaggio del puntatore o al focus
“Quando il contenuto aggiuntivo diventa visibile e poi nascosto al passaggio del puntatore o al focus della tastiera, è possibile: chiudere il contenuto aggiuntivo senza spostare il puntatore o il focus, mantenere il contenuto visibile mentre il puntatore o il focus è su di esso, e avvisare l’utente prima che il contenuto scompaia.”

Significa che: se un utente modifica la spaziatura del testo tramite un’estensione del browser (per citare un esempio: questo Editor di spaziatura del testo) o uno screen reader con opzioni avanzate… il tuo sito deve continuare a funzionare bene e restare leggibile.

2. Operabile

2.4.5 Differenti modalità
“Sono disponibili più di un modo per individuare una pagina Web all’interno di un insieme di pagine Web, salvo quando la pagina è il risultato di un processo o di un passo in un processo.”

Significa che: l’utente deve poter trovare una pagina in più di un modo (es. menu, link nel footer, mappa del sito…).

2.4.6 Intestazioni e etichette
“Le intestazioni e le etichette descrivono l’argomento o lo scopo.”

Significa che: titoli e nomi dei campi devono dire chiaramente di cosa si parla, così chi legge capisce subito. Ad esempio: sostituire il pulsante “Clicca qui” con frasi più descrittive “Prenota consulenza” “Vai al carrello” “Leggi altre informazioni”.

2.4.7 Focus visibile
“Qualsiasi interfaccia utente operabile tramite tastiera ha un indicatore di focus visibile.”

Significa che: quando si naviga con la tastiera, deve essere chiaro dove si è: il “focus” (es. un bordo evidenziato) deve essere sempre visibile.

3. Comprensibile

3.1.2 Parti in lingua
“La lingua di ciascun passaggio o frase nel contenuto può essere determinata programmaticamente, salvo eccezioni.”

Significa che: se inserisci parti in un’altra lingua (es. una frase in inglese in una pagina italiana), il sito deve indicarlo in modo che i lettori vocali leggano correttamente. (Si può fare aggiungendo l’attributo lang=”xx” all’interno dell’html).
“Il nostro servizio è tailor made” in html sarà : Il nostro servizio è <span lang=”en”>tailor made </span>.

3.2.3 Navigazione coerente
“I meccanismi di navigazione che si ripetono in più pagine Web all’interno di un insieme di pagine Web si presentano nello stesso ordine relativo ogni volta che sono ripetuti, salvo quando l’utente ne modifica l’ordine.”

Significa che: i menù, i link e gli elementi ripetuti devono essere sempre nello stesso ordine e posizione in ogni pagina.

3.2.4 Identificazione coerente
“I componenti che hanno la stessa funzionalità all’interno di un insieme di pagine Web sono identificati in modo coerente.”

Significa che: se un bottone o link fa la stessa cosa in più pagine, deve avere lo stesso aspetto e nome, per evitare confusione.

3.3.3 Suggerimenti per gli errori
“Se viene rilevato automaticamente un errore di input e sono noti suggerimenti per correggerlo, questi suggerimenti sono forniti all’utente.”

Significa che: se qualcuno sbaglia a compilare un modulo, deve ricevere un messaggio chiaro con indicazioni su come correggere.

3.3.4 Prevenzione degli errori (legale, finanziario, dati)
“Per le pagine Web che richiedono all’utente di inviare informazioni, almeno una delle seguenti è vera: le azioni sono reversibili, i dati inseriti sono controllati per errori e all’utente viene data la possibilità di correggerli, o l’utente ha la possibilità di rivedere e confermare prima dell’invio finale.”

Significa che: se si compila qualcosa di importante (tipo un pagamento o un contratto), il sito deve dare modo di rivedere, correggere o annullare l’azione prima di inviarla.

4. Robusto

4.1.3 Messaggi di stato
“Nei contenuti implementati utilizzando i linguaggi di marcatura, i messaggi di stato possono essere determinati programmaticamente tramite ruolo o proprietà in modo tale che possano essere presentati all’utente mediante tecnologie assistive senza ricevere il focus.”

Significa che: se succede qualcosa (es. invio di un modulo riuscito, errore, caricamento…), chi usa lettori vocali deve ricevere un messaggio chiaro, anche se non c’è un cambiamento visivo evidente.

Non saltare un gradino!

Il livello AA delle WCAG 2.1 è quello richiesto per legge a partire dal 28 giugno 2025 per molte realtà pubbliche e private, ma per essere conformi è indispensabile rispettare anche i criteri del livello A, che rappresentano la base dell’accessibilità.
(Leggi qui l’articolo ad hoc sulle WCAG 2.1 livello A, che prevede altri 30 punti.)

Non si può adeguare il sito solo al livello AA saltando un gradino.
Per costruire un sito accessibile e a norma, bisogna assicurarsi che tutti i requisiti A + AA siano correttamente implementati.

Sviluppare in modo accessibile, anche se non si rientra nelle categorie obbligate per legge, è la strada verso un web più inclusivo, usabile e aperto davvero a tutte le persone.
Inoltre, se fatta bene, migliora l’esperienza di chiunque navighi il tuo sito, nessuno escluso.

Overlay di accessibilità

Non farti fregare

Stanno spuntando come funghi annunci di aziende che ti vendono una soluzione infiocchettate per “rendere il sito accessibile con un solo tool”. Beh… ATTENZIONE.

Questi strumenti, chiamati anche “overlay di accessibilità” vengono venduti per mettere una pezza, sfruttare l’ingenuità o le buone intenzioni delle attività che si dovranno mettere a norma per generare profitto.

Questi strumenti infatti sono spesso di facciata; fanno stare sereno l’imprenditore, ma all’atto pratico non funzionano affatto per chi ha davvero bisogno di strumenti accessibili.

Ti consiglio di recuperare su Youtube questa live di Andrea Marchetti in cui è intervenuta Elena Brescacin, inclusive designer e analista presso Tangity, cieca dalla nascita che vive l’accessibilità sulla propria pelle come utente e come professionista ogni anno dall’avvento di internet a oggi.

Personalmente l’ho trovata molto interessante ed offre un sincera prospettiva sull’accessibilità web e la sua genuina importanza.

Screenshot live accessibilita web

Domande frequenti

Sì, ne esistono diversi.
Personalmente utilizzo Silktide, un’estensione gratuita per browser che permette di fare i controlli primari e gran parte dell’audit di accessibilità in modo rapido e chiaro. È un ottimo punto di partenza, soprattutto se ti stai avvicinando ora al tema.

Esistono poi strumenti a uso professionale più avanzati (come Axe DevTools, WAVE, Lighthouse integrato in Chrome), ma per una prima verifica Silktide fa egregiamente il suo mestiere.

Importante: nessun tool automatico rileva il 100% dei problemi di accessibilità. Molti criteri (soprattutto quelli legati alla comprensibilità e all’esperienza reale con tecnologie assistive) richiedono una verifica manuale o il confronto con utenti reali.

No. È un equivoco molto comune: il livello AA non sostituisce il livello A, lo integra.
I livelli di conformità WCAG funzionano a gradini cumulativi:

Livello A → i requisiti base, senza i quali il sito presenta barriere gravi

Livello AA → requisiti intermedi, che si aggiungono a quelli del livello A

Livello AAA → requisiti avanzati, che si aggiungono ai precedenti

Quando la normativa chiede la conformità al livello AA, in realtà intende A + AA. Non si può “saltare il gradino” e adeguare solo i 21 criteri del livello AA ignorando i circa 30 criteri del livello A.

Sarebbe come costruire il secondo piano di una casa senza aver costruito il primo: tecnicamente impossibile, e di fatto il sito non sarebbe conforme.
Per essere davvero a norma devi quindi assicurarti che tutti i requisiti A e tutti i requisiti AA siano correttamente implementati.

Dipende da quanto sei a tuo agio nel mettere mano al sito.
Sulle cose più basilari puoi sicuramente intervenire in autonomia, ad esempio:

sistemare i contrasti di colore tra testo e sfondo;

aggiungere i sottotitoli ai video;

scrivere alt text descrittivi per le immagini;

rendere più chiari i testi dei bottoni (no “clicca qui”, sì “prenota consulenza”);

controllare che i titoli seguano una gerarchia logica (H1, H2, H3…).

Per tutto il resto e per essere davvero a norma ti conviene rivolgerti a chi padroneggia la materia e può fare da ponte tra la normativa e il codice. Perché un conto è sapere cosa va fatto, un altro è sapere come tradurlo concretamente in HTML, CSS e nelle logiche del tuo CMS.

Se hai un sito in WordPress, scrivimi: valutiamo insieme lo stato attuale e capiamo se e come posso fare al caso tuo.

In caso di mancato adeguamento sono previste sanzioni amministrative, oltre al rischio di segnalazioni da parte degli utenti.
Ma al di là delle sanzioni, un sito non accessibile significa tagliare fuori una fetta importante di potenziali clienti e utenti.

Dipende dallo stato di partenza.
Se il sito è deve essere realizzato ex novo, la progettazione sarà studiata per essere accessibile fin dall’inizio, il costo aggiuntivo è abbattuto.
Se invece si tratta di adeguare un sito esistente, il costo varia in base alla complessità, al numero di pagine e a quanto lavoro serve su codice, contenuti e design.

Il mio consiglio è sempre di partire da un audit per capire lo stato attuale, poi pianificare gli interventi per priorità.

No. Nessuna piattaforma ti rende automaticamente conforme. Temi, plugin, contenuti caricati (immagini senza alt, PDF non accessibili, video senza sottotitoli…) e personalizzazioni possono creare barriere anche su piattaforme nate con buone intenzioni in ambito accessibilità.
La conformità dipende sempre da come viene costruito e gestito il sito, non solo dalla tecnologia scelta.

L’accessibilità non è un traguardo, ma un processo continuo. Ti consiglio di:

verificare l’accessibilità ogni volta che aggiungi nuove funzionalità o pagine;

formare chi carica contenuti (redattori, marketing) affinché rispetti le buone pratiche ogni giorno (alt text, titoli, contrasti, ecc.);

fare un audit completo almeno una volta l’anno, se hai cambiato i contenuti presenti nel tuo sito.

Per gli enti pubblici è obbligatoria da tempo. Per i privati soggetti all’EAA, è buona pratica pubblicare una dichiarazione di accessibilità che indichi il livello di conformità raggiunto, eventuali contenuti non ancora accessibili e un canale di contatto per segnalare problemi.

Sì. I PDF sono contenuti a tutti gli effetti e devono rispettare i criteri di accessibilità: struttura semantica corretta, testo selezionabile (no scansioni di immagini), alt text sulle immagini, ordine di lettura logico, tag corretti.

Se hai molti PDF sul sito, valuta se sia il caso di convertirli in pagine HTML: quasi sempre è la soluzione più accessibile e anche più SEO-friendly.

Verifica sempre che il tema dichiari di essere conforme alle WCAG 2.1 AA. Attenzione però: “accessibility-ready” non significa automaticamente conforme. I temi forniscono una base, ma le personalizzazioni, i colori scelti, i contenuti caricati e i plugin aggiunti possono comunque compromettere l’accessibilità.

No. Come ho spiegato nell’articolo, gli overlay di accessibilità sono spesso soluzioni di facciata che non risolvono davvero i problemi per chi utilizza tecnologie assistive. In alcuni casi possono addirittura peggiorare l’esperienza.

La conformità vera si ottiene lavorando sul codice, sul design e sui contenuti – non applicando un cerotto sopra.

Ciao, mi chiamo Viola

Web designer freelance specializzata in siti web custom.

Nel vasto mare digitale, non puoi permetterti di presentarti su una zattera.

Per raggiungere i tuoi obiettivi e navigare lontano, hai bisogno di una nave solida, veloce e costruita su misura per la tua rotta.

Devi creare o rifare il tuo sito web? Scegline uno fatto bene.

viola fotoritratto professionale