La checklist essenziale WCAG per l'accessibilità dei siti web

Nonostante i vantaggi dell'accessibilità digitale, le organizzazioni faticano ancora a soddisfare i requisiti minimi di accessibilità. In base a una scansione di oltre 400.000 pagine web aziendali su 15.000 siti, abbiamo rilevato che:

Il 38% delle immagini non è accessibile alle persone con disabilità visive.
L'80% delle pagine contiene link non chiari per persone con disabilità visive o cognitive.
Il 35% dei moduli manca di etichette chiare.

Questi problemi — tra decine di altri — fanno sì che solo il 3% di Internet sia accessibile alle persone con disabilità.

Il World Wide Web Consortium (W3C) ha creato le Linee guida per l'accessibilità dei contenuti web (WCAG) per aiutare le organizzazioni a migliorare l'accessibilità per le persone con disabilità. Le WCAG sono uno standard internazionale condiviso che le aziende dovrebbero seguire per rispettare i criteri di accessibilità riconosciuti. Le linee guida contengono 86 criteri di successo che, se rispettati, aumentano l'accessibilità e l'usabilità su piattaforme digitali, inclusi siti web, dispositivi mobili, documenti digitali e altre interfacce utente.

Di seguito, abbiamo raccolto una checklist approfondita dei criteri di successo WCAG per garantire che i tuoi prodotti digitali rispettino gli standard di conformità all'accessibilità web.

Checklist WCAG

Abbiamo creato una checklist completa per aiutarti a soddisfare i requisiti di accessibilità WCAG. Non lasciarti sopraffare dal numero di criteri di successo: sono tanti, ma rispettarli è possibile con gli strumenti giusti (il Web Accessibility Checker gratuito di AudioEye è un ottimo punto di partenza).

Consigliamo di iniziare dai criteri di successo di Livello A prima di passare ai livelli superiori. Potresti anche valutare di risolvere prima le problematiche più semplici mentre crei un piano per quelle più complesse.

Checklist WCAG Livello A

Criteri di successo	Descrizione	Completato
Contenuto non testuale	Tutti i contenuti non testuali (ad es. immagini, pulsanti immagine e aree attive di mappe immagine) hanno un testo alternativo appropriato.
Solo audio e solo video	Sono forniti trascrizioni descrittive e accurate per contenuti solo video o solo audio.
Sottotitoli	I sottotitoli sono forniti per video preregistrati o in diretta (ad es., YouTube).
Informazioni e relazioni	Le intestazioni includono il corretto markup semantico. Le tabelle sono collegate alle intestazioni appropriate e includono didascalie se necessario. Le etichette di testo sono associate ai giusti campi del modulo.
Sequenza significativa	L'ordine di navigazione segue l'ordine del codice; la navigazione è chiara e intuitiva.
Caratteristiche sensoriali	Le istruzioni non dipendono dalla posizione visiva, dalla forma o dalla dimensione (ad es., 'Le istruzioni sono elencate a destra' o 'Clicca sul pulsante quadrato per continuare').
Uso del colore	Il colore da solo non viene utilizzato per trasmettere informazioni, né per distinguere i link dal testo circostante a meno che il contrasto cromatico sia adeguato.
Controllo audio	Gli utenti possono mettere in pausa, interrompere, cambiare volume o silenziare i contenuti audio che si avviano automaticamente su una pagina per più di tre secondi.
Tastiera	Gli elementi web possono essere facilmente condivisi tramite tastiera e includono scorciatoie specifiche per la pagina.
Nessuna trappola da tastiera	Il focus e le scorciatoie da tastiera non sono bloccati o intrappolati su nessun elemento della pagina.
Scorciatoie da tastiera con caratteri	Gli utenti devono poter disabilitare i comandi da tastiera e passare a tasti non stampabili, come Ctrl, Alt, ecc.
Temporizzazione regolabile	Le pagine con limiti di tempo consentono agli utenti di regolare, disattivare o estendere il limite di tempo.
Pausa, arresto, nascondi	I contenuti che si muovono, lampeggiano, scorrono o si aggiornano automaticamente per più di cinque secondi possono essere messi in pausa, fermati o nascosti dagli utenti.
Tre lampeggi o meno	Il contenuto della pagina non lampeggia più di tre volte al secondo.
Salta blocchi	Gli utenti possono saltare la navigazione o altri elementi ripetuti nelle pagine web.
Titoli di pagina	La pagina web ha un titolo descrittivo e informativo.
Ordine del focus	L'ordine dei link è chiaro e segue una sequenza logica e intuitiva.
Scopo del link	Gli utenti possono comprendere lo scopo del link dal solo testo. I link con testo simile che portano a destinazioni diverse sono facilmente distinguibili.
Gesti con puntatore	Le azioni dell'utente possono essere eseguite con un singolo gesto del puntatore.
Annullamento del puntatore	L'attivazione involontaria dei controlli viene evitata non utilizzando l'attivazione 'onmousedown'.
Attuazione tramite movimento	Le funzionalità attivate dal movimento dell'utente o dal movimento del dispositivo possono essere disabilitate e funzionalità simili possono essere ottenute tramite controlli standard come pulsanti o comandi.
Identificazione degli errori	Gli errori di validazione o di inserimento nei moduli sono chiaramente identificati e l'accesso all'errore è fornito rapidamente.

Checklist WCAG Livello AA

Criteri di successo	Descrizione	Completato
Sottotitoli	I media in diretta con audio contengono sottotitoli sincronizzati.
Descrizione audio	Gli utenti hanno accesso a descrizioni audio per i video non in diretta.
Orientamento	L'orientamento della pagina web non è limitato a verticale o orizzontale; gli utenti possono regolarlo secondo necessità.
Identificare lo scopo dell'input	I campi che raccolgono determinate informazioni sull'utente hanno l'attributo 'autocomplete' definito.
Contrasto	Sia il testo che le immagini hanno un rapporto di contrasto di almeno 4,5:1. Il testo grande ha un rapporto di almeno 3:1.
Ridimensiona testo	Gli elementi della pagina restano leggibili e funzionanti quando vengono ingranditi al 200%.
Immagini di testo	Se una rappresentazione visiva può essere resa solo tramite testo, non viene utilizzata un'immagine per presentare il testo.
Riadattamento	La funzionalità non viene persa quando il contenuto è presentato a una larghezza di 320 pixel. Lo scorrimento orizzontale viene evitato il più possibile.
Contrasto non testuale (minimo)	Un rapporto di contrasto minimo di 3:1 è garantito per oggetti diversi, come icone, grafici o diagrammi.
Spaziatura del testo	Il contenuto o la funzionalità non vengono persi quando gli utenti regolano la spaziatura dei paragrafi.
Contenuto su hover o focus	Il contenuto presentato su hover o focus può essere chiuso senza spostare la tastiera o il puntatore.
Più modi	Gli utenti hanno più di un modo per trovare altre pagine web su un sito.
Intestazioni ed etichette	Le intestazioni di pagina e le etichette sono informative e non vengono duplicate se non strettamente necessario.
Focus visibile	È presente un indicatore visibile per gli elementi della pagina quando ricevono il focus da tastiera.
Focus non oscurato	Gli elementi con focus da tastiera sono completamente visibili.
Movimento di trascinamento	Le azioni che richiedono il trascinamento del puntatore possono essere eseguite anche con un solo puntatore.
Dimensione del target	Le dimensioni dei puntatori sono almeno 24 x 24 pixel, salvo diversa specifica.
Lingua delle parti/pagina	La lingua delle pagine è facilmente identificabile tramite l'attributo 'lang'.
Navigazione coerente	Gli elementi che si ripetono su una pagina web (ad es., una barra di ricerca) sono etichettati in modo coerente su tutte le pagine del sito.
Suggerimento per l'errore	Quando viene rilevato un errore, vengono fornite indicazioni su come risolverlo in modo tempestivo e accessibile.
Prevenzione degli errori	Se un utente modifica o elimina dati finanziari, legali o di test, l'azione può essere annullata, confermata o verificata secondo necessità.
Autenticazione eccessiva	Durante i processi di autenticazione non sono richieste funzioni cognitive, a meno che non sia possibile completare il processo in altro modo, saltarlo o fornire identificazione di contenuti non testuali da parte dell'utente (ad es., immagine fornita dall'utente).
Messaggi di stato	I messaggi di stato vengono annunciati ai lettori di schermo tramite live region o avvisi ARIA.

Checklist WCAG Livello AAA

Criteri di successo	Descrizione	Completato
Lingua dei segni	È fornita l'interpretazione nella lingua dei segni per i media con audio.
Descrizione audio estesa	Quando il video originale non contiene pause sufficienti e non è ottimizzato per la descrizione audio, viene fornito un video separato con pause adeguate e descrizioni audio.
Alternativa ai media	I media preregistrati includono una trascrizione descrittiva.
Solo audio	Per i contenuti in diretta che contengono audio viene fornito un testo descrittivo.
Identificare lo scopo	ARIA viene utilizzato per migliorare la semantica HTML, consentendo agli utenti di comprendere più facilmente lo scopo degli elementi dell'interfaccia.
Contrasto	Immagini e testo hanno un rapporto di contrasto di 7:1.
Audio di sottofondo basso o assente	I contenuti audio hanno poco o nessun rumore di sottofondo, garantendo che siano facilmente distinguibili.
Presentazione visiva	I blocchi di testo superiori a una frase: sono larghi meno di 80 caratteri, non sono giustificati completamente, hanno un'adeguata spaziatura tra le righe, includono colori di primo piano e sfondo appropriati e non richiedono scorrimento orizzontale se la dimensione viene raddoppiata.
Immagini di testo	Il testo all'interno di un'immagine viene utilizzato solo per decorazione o se l'informazione non può essere presentata solo tramite testo.
Tastiera	Tutte le funzionalità sono disponibili tramite tastiera.
Nessuna temporizzazione	Non ci sono limiti o vincoli di tempo per il contenuto o le funzionalità della pagina.
Interruzioni	Le interruzioni come avvisi o aggiornamenti possono essere posticipate dall'utente.
Riautenticazione	Gli utenti possono riautenticare una pagina e continuare le attività senza perdere dati.
Timeout	Gli utenti vengono adeguatamente avvisati dei timeout che possono comportare la perdita di dati (a meno che i dati non possano essere conservati per più di ore di inattività dell'utente).
Tre lampeggi	Nessun contenuto della pagina lampeggia tre volte al secondo.
Animazioni da interazioni	Le animazioni e i movimenti non essenziali possono essere disabilitati dagli utenti.
Posizione	Una pagina web che fa parte di una sequenza di pagine viene indicata come tale tramite breadcrumb o specificando i passaggi della sequenza.
Scopo del link	Gli utenti possono distinguere lo scopo di ogni link dal solo testo del link.
Intestazioni di sezione	Le sezioni di contenuto sono designate tramite intestazioni.
Focus non oscurato (avanzato)	Gli elementi con focus da tastiera sono completamente visibili.
Aspetto del focus	Nei casi in cui sono presenti indicatori o sfondi personalizzati, il contrasto tra stato con focus/senza focus è almeno 3:1 e l'area è almeno pari a quella di un perimetro spesso 2 pixel che circonda l'elemento.
Dimensione del target	I target cliccabili sono di almeno 44 x 44 pixel, salvo che sia prevista una dimensione alternativa.
Meccanismi di input simultanei	Il contenuto non è limitato a un solo tipo di input (ad es., solo tastiera o solo touch) e supporta input alternativi.
Parole insolite	Le parole sconosciute o ambigue sono definite tramite un indice, un elenco di definizioni o altro metodo appropriato.
Abbreviazioni	Le abbreviazioni sconosciute vengono espanse e definite la prima volta che vengono utilizzate.
Livello di lettura	Per i contenuti avanzati vengono fornite alternative più comprensibili (tipicamente per contenuti superiori al livello di lettura della nona classe).
Pronuncia	Vengono fornite guide alla pronuncia per le parole fondamentali per la comprensione della pagina.
Modifica su richiesta	Le modifiche sostanziali (ad es., apertura di finestre pop-up o cambiamenti di focus da tastiera) sono avviate dall'utente e possono essere disabilitate se desiderato.
Aiuto	Vengono fornite istruzioni o suggerimenti agli utenti che necessitano di assistenza per completare le attività.
Prevenzione degli errori	Gli utenti possono annullare, verificare o confermare l'invio dopo aver inviato le informazioni.
Autenticazione accessibile (avanzata)	Non sono richiesti test di funzione cognitiva in nessuna fase del processo di autenticazione, a meno che il test non possa essere saltato o completato con l'aiuto di un altro meccanismo.

Conformità WCAG e leggi sull'accessibilità digitale

Tutti hanno il diritto di accedere e utilizzare i contenuti online — seguire i criteri di successo sopra riportati ti permette di creare un ambiente accessibile e funzionale che tutti possono utilizzare. Tuttavia, l'accessibilità digitale è anche un requisito legale in tutto il mondo. La maggior parte delle leggi internazionali sull'accessibilità utilizza le WCAG come standard di riferimento, tra cui:

Americans with Disabilities Act (ADA): L' ADA vieta la discriminazione contro le persone con disabilità negli spazi pubblici, incluso Internet. Il mancato rispetto dell'ADA (che include la creazione di un sito web conforme all'ADA) può comportare azioni legali. Per rispettare l'ADA, è necessario soddisfare i requisiti previsti dalle WCAG 2.1 Livello AA.
European Accessibility Act (EAA): Simile all'ADA, l' EAA richiede a tutte le organizzazioni del settore pubblico dell' Unione Europea (UE) di offrire prodotti e servizi accessibili. Da notare che l'EAA applica i principi POUR rispetto alle WCAG; tuttavia, seguire i principi WCAG ti mette in una posizione forte per rispettare anche i principi POUR.

AudioEye: ti aiuta a raggiungere la conformità WCAG con facilità

Rendere il tuo sito accessibile non deve essere un compito travolgente. La checklist sopra ti offre una solida base, ma con così tanti criteri di successo WCAG — e alcuni dettagli altamente tecnici — può essere difficile identificare e risolvere ogni problema da soli.

È qui che entra in gioco AudioEye. Il nostro approccio all'accessibilità in tre fasi combina una potente automazione, tecnologia AI assistita da esperti, e test durante il processo di sviluppo per semplificare il percorso verso l'accessibilità. Inoltre, con AudioEye Assurance, avrai un livello di protezione superiore del 400% rispetto ai soli approcci automatizzati o di sola consulenza. Con il nostro approccio completo, godrai di una conformità leader del settore alle leggi sull'accessibilità e della tranquillità di sapere che i tuoi contenuti digitali sono protetti.

Che tu stia muovendo i primi passi verso la conformità WCAG o voglia portare l'accessibilità del tuo sito a un livello superiore, AudioEye ti offre strumenti, competenze e supporto continuo per costruire un'esperienza digitale accessibile — e mantenerla tale nel tempo.

Pronto a iniziare? Usa il nostro Website Accessibility Checker gratuito per vedere quanto sono accessibili i tuoi contenuti attuali.

Vuoi vedere AudioEye in azione? Prenota una demo oggi stesso.

Domande frequenti

Quali sono le diverse versioni delle WCAG?

Quali sono i diversi livelli delle WCAG?

Qual è l'ultima versione delle WCAG?

Quando verrà rilasciata la WCAG 3.0?

Quali sono i quattro principi delle WCAG?

Quali sono le conseguenze della non conformità alle WCAG?

Condividi articolo