WCAG 2.2 AA: le 12 verifiche che bloccano più spesso i siti italiani

Quando si parla di accessibilità web, la conformità alle WCAG 2.2 AA è il riferimento tecnico più utilizzato in Europa e in Italia. Ma quali sono i criteri che fanno davvero fallire i siti? Non serve conoscere a memoria tutti i 50 requisiti: basta concentrarsi su quelli che, nella pratica, vengono violati più spesso.

In questo articolo ti mostro le 12 verifiche che riscontriamo più di frequente nei siti italiani, da quelle tecniche a quelle più semplici da sistemare. E ti spiego come uno strumento di monitoraggio come LEXABLE può aiutarti a individuarle in pochi minuti.

1. Contrasto del testo (1.4.3)

Il testo deve avere un rapporto di contrasto di almeno 4,5:1 rispetto allo sfondo. Spesso i siti usano colori troppo chiari o combinazioni eleganti ma illeggibili. Un controllo automatico può verificare tutti i colori del sito in un attimo.

2. Testo alternativo per le immagini (1.1.1)

Ogni immagine deve avere un attributo alt descrittivo. Molti siti lo dimenticano, soprattutto per le immagini decorative o quelle generate da slider. Attenzione: l'alt vuoto è consentito solo per immagini puramente decorative, ma deve essere presente.

3. Etichette nei moduli (3.3.2)

Ogni campo di un modulo deve avere un'etichetta associata. Non basta il placeholder: serve un elemento <label> programmaticamente collegato. Questo è uno degli errori più comuni nei form di contatto e checkout.

4. Navigazione da tastiera (2.1.1)

Tutte le funzionalità devono essere utilizzabili con la tastiera. Elementi come menu a tendina, popup e caroselli spesso non sono accessibili senza mouse. Verifica di poter raggiungere e attivare ogni elemento con il tasto Tab.

5. Focus visibile (2.4.7)

Quando si naviga con la tastiera, deve essere chiaro quale elemento ha il focus. Molti siti rimuovono l'outline di default per motivi estetici, ma questo rende impossibile orientarsi. Un bordo visibile (anche se poco elegante) è essenziale.

6. Link con testo significativo (2.4.4)

Evita link come “clicca qui” o “leggi di più”. Il testo del link deve descrivere la destinazione. Se il link apre un PDF, indica il formato e il peso, ad esempio “Scarica il report (PDF, 2 MB)”.

7. Intestazioni di sezione correttamente gerarchiche (1.3.1)

Le intestazioni (H1, H2, H3) devono seguire un ordine logico e non saltare livelli. Uno scanner può facilmente rilevare se la struttura è corretta, ma anche un controllo manuale può bastare per pagine semplici.

8. Ridimensionamento del testo (1.4.4)

Il testo deve poter essere ingrandito fino al 200% senza perdita di contenuto o funzionalità. Layout fluidi e unità relative (em, rem) aiutano. Molti siti bloccano lo zoom o usano larghezze fisse.

9. Spaziatura del testo (1.4.12)

La spaziatura tra lettere, parole e righe deve poter essere aumentata senza perdita di contenuto. Questo criterio, introdotto nelle WCAG 2.1, viene spesso trascurato ma è semplice da rispettare con CSS fluidi.

10. Riuscita dei pulsanti (2.5.8)

I pulsanti devono avere una dimensione minima di 24×24 pixel, meglio se 44×44. Su mobile è facile, ma su desktop molti bottoni sono troppo piccoli. Un controllo automatico può misurare le dimensioni di tutti gli elementi cliccabili.

11. Messaggi di errore identificabili (3.3.1)

Quando un modulo non viene compilato correttamente, deve essere mostrato un messaggio che descrive il problema e indica come risolverlo. Non basta un bordo rosso: serve testo esplicativo, possibilmente associato al campo.

12. Lingua della pagina (3.1.1)

L'attributo lang deve essere presente e corretto. Per i siti multilingua, ogni pagina deve indicare la propria lingua. Sembra banale, ma molti siti lo dimenticano, specialmente i template.

Come LEXABLE ti aiuta a superare queste verifiche

Identificare manualmente tutti questi problemi su ogni pagina del tuo sito è quasi impossibile, soprattutto se hai un e-commerce o un sito con molte pagine. LEXABLE analizza automaticamente il tuo sito secondo le WCAG 2.2 e ti fornisce un report dettagliato con l'elenco delle violazioni, la loro gravità e le indicazioni per risolverle.

Il widget di accessibilità di LEXABLE inoltre, una volta installato sul tuo sito, consente agli utenti di personalizzare l'esperienza di navigazione (contrasto, dimensione del testo, evidenziazione dei link) e calcola automaticamente la dichiarazione di accessibilità, semplificando la conformità alla normativa europea EAA.

Non aspettare che qualcuno segnali problemi di accessibilità: esegui una scansione gratuita e scopri subito dove intervenire. Con LEXABLE puoi monitorare il sito nel tempo e garantire che ogni nuovo contenuto rispetti gli standard.

Per iniziare, basta creare un account gratuito e inserire l'URL del tuo sito: in pochi minuti avrai un report chiaro e azionabile. Non serve essere esperti di WCAG: LEXABLE traduce i criteri tecnici in suggerimenti pratici, adatti anche a chi non ha competenze di sviluppo.