Accessibilità e-commerce: la checklist dal catalogo al pagamento

Un e-commerce accessibile è un negozio che si usa anche senza mouse, con un lettore di schermo o con la vista ridotta: testi leggibili e ben contrastati, immagini descritte, campi con etichette ed errori spiegati, carrello e pagamento che non bloccano nessuno. Dal 28 giugno 2025 è un obbligo per molti negozi online rivolti ai consumatori, per effetto dell'European Accessibility Act recepito in Italia con il decreto legislativo 82/2022. Questa guida è la checklist pratica che uso quando controllo un negozio, dalla home alla conferma d'ordine.

Per il quadro normativo completo c'è la guida dedicata all'European Accessibility Act per i siti web. Qui restiamo sui controlli concreti.

Il mio negozio online è obbligato a essere accessibile?

La direttiva europea considera «servizi di commercio elettronico» quelli forniti a distanza, tramite siti e app, per concludere un contratto con un consumatore. Se vendi online ai privati, in linea generale rientri.

Sono esentate le microimprese che forniscono servizi, cioè le imprese con meno di 10 persone e un fatturato annuo o un totale di bilancio non superiore a 2 milioni di euro. Se sei in questa fascia non hai l'obbligo, ma i clienti con disabilità restano clienti, e un negozio accessibile è più comodo per tutti.

Nel dubbio sulla tua posizione, parlane con un consulente. Il riferimento tecnico, in pratica, sono le linee guida WCAG 2.1 al livello AA, richiamate dalla norma europea EN 301 549.

Testi, colori e ingrandimento

• Il testo ha un contrasto sufficiente con lo sfondo: per il testo normale il rapporto minimo è 4,5 a 1. Attenzione ai grigi chiari su bianco e alle scritte sopra le foto.
• Il sito resta usabile con il testo ingrandito al 200%, senza parti che si sovrappongono o spariscono.
• L'informazione non passa solo dal colore: un prodotto esaurito non è indicato solo con il grigio, un campo sbagliato non è segnalato solo dal rosso.
• Le dimensioni del testo sono comode anche sul telefono, senza dover ingrandire con le dita.

Navigazione da tastiera

Prova a usare il negozio solo con il tasto Tab, Invio e le frecce. È il test più rivelatore.

• Ogni elemento interattivo (menu, filtri, pulsanti, varianti, carrello) si raggiunge con la tastiera.
• Si vede sempre dove si trova il cursore: il contorno di evidenziazione non deve essere tolto dal tema.
• L'ordine con cui si passa da un elemento all'altro segue quello della pagina.
• I menu a tendina e le finestre sovrapposte si aprono e si chiudono da tastiera, e non intrappolano il cursore.
• C'è un collegamento per saltare al contenuto principale, utile quando il menu è lungo.

Immagini e schede prodotto

• Ogni foto di prodotto ha un testo alternativo che la descrive: «Divano a tre posti in tessuto grigio, vista frontale», non «IMG_2034».
• Le immagini decorative sono marcate come tali, così il lettore di schermo le salta.
• Le informazioni importanti (misure, composizione, istruzioni) sono testo vero, non scritte dentro le immagini.
• I selettori di taglia e colore hanno un nome leggibile, non solo un quadratino colorato.
• Quando la scelta di una variante cambia prezzo o disponibilità, il cambiamento è comunicato anche a chi usa un lettore di schermo.

Ricerca, filtri e categorie

• Il campo di ricerca ha un'etichetta e funziona con la tastiera.
• I filtri si attivano senza mouse e dicono quanti risultati ci sono dopo l'applicazione.
• I titoli delle pagine e le intestazioni seguono un ordine logico, così chi usa un lettore di schermo può saltare da una sezione all'altra.

Moduli, registrazione e accesso

I moduli sono il punto in cui più spesso un acquisto si blocca.

• Ogni campo ha un'etichetta visibile collegata al campo, non solo un testo grigio che sparisce quando scrivi.
• I campi obbligatori sono indicati in modo chiaro, non solo con un asterisco colorato.
• Gli errori dicono cosa è sbagliato e come correggerlo, vicino al campo, e il dato già inserito non viene cancellato.
• I campi usano il riempimento automatico del browser per nome, indirizzo, email.
• Se c'è un controllo anti-robot, esiste un'alternativa per chi non riesce a usarlo.
• Non ci sono tempi limite troppo brevi, o si possono estendere.

Carrello e pagamento

È la parte che conta di più, perché è dove si conclude il contratto.

• Nel carrello si possono cambiare quantità e rimuovere prodotti da tastiera, e il totale aggiornato viene comunicato.
• Il percorso di pagamento è diviso in passi chiari, con l'indicazione di dove ci si trova.
• I metodi di pagamento si scelgono senza mouse, e le finestre del fornitore di pagamento (per l'autenticazione della carta) sono anch'esse utilizzabili.
• Il riepilogo finale è leggibile e il pulsante che conclude l'ordine ha un testo chiaro.
• La conferma d'ordine arriva anche per email, in un formato leggibile.

Video, documenti e contenuti aggiuntivi

• I video hanno sottotitoli, e se mostrano informazioni importanti, una descrizione.
• Le schede tecniche e le condizioni in PDF sono accessibili, o disponibili anche come pagina web.
• La lingua della pagina è dichiarata correttamente, così il lettore di schermo pronuncia bene i testi.

Informazioni sull'accessibilità

La direttiva chiede ai fornitori di servizi di spiegare come il servizio soddisfa i requisiti di accessibilità, di solito nelle condizioni generali o in una pagina dedicata. Prepara una pagina chiara che descriva lo stato del negozio, le parti eventualmente non ancora conformi e un modo per segnalare problemi.

Come si verifica, in pratica?

Con tre tipi di controllo, perché nessuno basta da solo.

I controlli automatici, fatti con gli strumenti che analizzano le pagine, trovano in pochi minuti contrasti insufficienti, immagini senza testo alternativo, campi senza etichetta. Sono utili per partire, ma colgono solo una parte dei problemi: non possono dire se un testo alternativo descrive davvero l'immagine o se il percorso d'acquisto ha senso.

I controlli manuali sono quelli di questa checklist: tastiera, ingrandimento, moduli, ordine dei titoli. Richiedono tempo e un po' di metodo, e sono i più rivelatori.

La prova con un lettore di schermo completa il quadro. Su Windows esiste un lettore gratuito molto diffuso, NVDA; su iPhone e Mac c'è VoiceOver, già incluso nel sistema. Provare a comprare un prodotto ascoltando la pagina invece di guardarla fa capire in dieci minuti più di qualsiasi rapporto.

Il risultato va scritto: cosa è conforme, cosa no, cosa si corregge e quando. È anche la base per la pagina sulle informazioni di accessibilità.

I widget di accessibilità bastano?

No. I pulsanti che promettono di rendere il sito accessibile con un clic (ingrandisci, contrasto, lettura) non correggono il codice del negozio: se un campo non ha etichetta o il carrello non si usa da tastiera, il problema resta. A volte peggiorano le cose, interferendo con gli strumenti che le persone usano già. L'accessibilità si costruisce nel sito.

Da dove partire

1. Fai il test della tastiera sul percorso completo: home, categoria, prodotto, carrello, pagamento.
2. Controlla contrasto e testo ingrandito sulle pagine principali.
3. Rivedi i moduli: etichette, errori, campi obbligatori.
4. Sistema le schede prodotto più visitate: testi alternativi e varianti.
5. Prepara la pagina con le informazioni sull'accessibilità.
6. Pianifica le correzioni più profonde, che spesso riguardano il tema o la piattaforma.

Quanto tempo richiede adeguare un negozio esistente?

Dipende da quanto è profondo il problema. Molte correzioni sui contenuti (testi alternativi, etichette dei campi, contrasto dei colori) si fanno in fretta. Quelle che riguardano il tema o la piattaforma, come un carrello che non si usa da tastiera, possono richiedere interventi strutturali. Per questo conviene partire da un controllo completo e pianificare.

Ne parliamo?

Se vuoi sapere a che punto è il tuo negozio online, scrivimi dalla pagina contatti. Verifico il percorso d'acquisto con gli stessi controlli di questa guida e ti propongo le correzioni in ordine di importanza. Qui trovi come lavoro sull'accessibilità e sugli e-commerce; un esempio di sito pensato anche per l'accessibilità è quello di Depuratoritalia.

Fonti

• Direttiva (UE) 2019/882 sui requisiti di accessibilità dei prodotti e dei servizi (EUR-Lex)
• Decreto legislativo 82/2022 (Normattiva)
• W3C, Web Content Accessibility Guidelines (WCAG) 2.1

Crediti delle immagini

• Copertina: foto di Compagnons su Unsplash