Home › Risorse › Per sistema

L'accessibilità con Shopify

I temi e le app di Shopify decidono l'accessibilità. Il checkout è in gran parte imposto da Shopify.

Riscontri frequenti

Colori del tema con contrasto troppo basso, immagini prodotto senza testo alternativo, app di recensioni e pop-up senza uso da tastiera, mega-menu che si aprono solo al passaggio del mouse, caroselli senza pausa. Il core di Shopify di solito non è il problema — lo sono il tema, le app e i contenuti creati nell'editor di testo formattato.

Verificare e scegliere il tema

Il tema decide il contrasto, il focus visibile, la struttura dei titoli e l'uso da tastiera di menu e filtri. Criteri prima di scegliere: percorri la home page, una collezione e una pagina prodotto con il tasto Tab — il focus è sempre visibile? Il menu si apre senza mouse? Il contrasto di testo e pulsanti è almeno 4,5:1? I temi predefiniti di Online Store 2.0 (Dawn e i suoi derivati) sono un buon punto di partenza; per i temi a pagamento aiuta fare il test da tastiera sulla demo e chiedere al fornitore una dichiarazione di accessibilità.

Immagini prodotto, varianti e testo formattato

Dai a ogni immagine prodotto nell'admin un testo alternativo che descrive il contenuto — non il nome del file. Lo stesso vale per le immagini delle varianti. Il testo impresso come grafica in un badge o banner («Saldi», «Solo oggi») è invisibile agli screen reader; usa testo reale. Nell'editor di testo formattato della descrizione prodotto usa bene i livelli di titolo (non limitarti a ingrandire il testo) e le liste come liste reali.

App e widget incorporati

Le app di recensioni, pop-up, upsell e cookie banner spesso inseriscono widget propri che intrappolano il focus da tastiera, non hanno etichette o mostrano overlay senza possibilità di chiusura. Testa ogni app singolarmente con la tastiera; le app di slider e conto alla rovescia hanno bisogno di una pausa e non devono far lampeggiare nulla. Un overlay di accessibilità come app non risolve i problemi strutturali ed è criticato dalle associazioni delle persone interessate. Nel dubbio: rimuovi l'app.

Checkout: cosa impone Shopify e cosa no

Il checkout standard di Shopify è gestito da Shopify ed è in gran parte costruito in modo accessibile — lì hai poche leve. Ciò che influenzi: le estensioni del checkout e i campi personalizzati (messaggio regalo, verifica dell'età) possono ostacolare l'uso da tastiera o screen reader, e il percorso fino al checkout — carrello, campo codice sconto, scelta della spedizione — sta nel tema. Prova anche questi passaggi.

Testare e domande frequenti

Test rapido: usa la home page, una collezione e una pagina prodotto solo con la tastiera, ingrandisci al 200% nel browser, esegui un'estensione come WAVE o axe DevTools. La scansione gratuita di a11yglass verifica in più l'HTML servito per contrasto, testi alternativi, etichette, lingua e struttura. Il mio negozio Shopify ha bisogno di una dichiarazione di accessibilità? Di norma sì — un negozio tramite cui i consumatori acquistano è commercio elettronico ai sensi del BFSG; vedi la pagina sulla dichiarazione di accessibilità. Il checkout di Shopify è già accessibile? In gran parte responsabilità di Shopify, ma le estensioni possono romperlo. Quale tema è accessibile? Non esiste un marchio — ciò che conta è la realizzazione nel caso concreto.

Come aiuta a11yglass

La scansione gratuita verifica l'HTML e il CSS forniti alla ricerca di violazioni WCAG rilevabili automaticamente e indica per ogni riscontro il criterio di successo e una misura concreta. Rileva circa il 20–35 % dei problemi e non sostituisce un audit completo.

Continua a leggere

Informazione generale fornita in buona fede, priva di valore di consulenza legale. Per il caso concreto rivolgersi a uno studio specializzato in diritto delle tecnologie dell'informazione.