Lista di controllo del sito Web di conformità ADA gratuita

Perché hai bisogno di un sito web conforme ADA

Qualsiasi azienda o istituzione di fronte al pubblico che deve essere conforme all'ADA nella propria sede fisica e "che utilizza Internet per le comunicazioni relative ai propri programmi, beni o servizi deve essere preparata a offrire tali comunicazioni anche attraverso mezzi accessibili", secondo una lettera aperta del Dipartimento di Giustizia.

Qualsiasi azienda che abbia più di 15 dipendenti a tempo pieno ed è aperta per più di 20 settimane all'anno è tenuta a seguire il Titolo III dell'Americans with Disabilities Act essendo facilmente accessibile al pubblico in generale. Gli attivisti hanno recentemente iniziato a cercare e citare in giudizio siti web non conformi; Solo nel 2018 sono state presentate 2250 cause.

Se il tuo sito web risulta non conforme, perderai migliaia di dollari in multe e spese processuali. Subirai anche un incubo nelle pubbliche relazioni quando i media riferiscono che la tua azienda è stata citata in giudizio per aver discriminato i disabili.

Mentre "accessibilità" è stata definita vagamente nel 1996 quando è stata pubblicata la lettera del DOJ, il Linee guida per l'accessibilità dei contenuti Web sono ora lo standard utilizzato dal governo federale per la propria presenza sul web e dai tribunali per valutare le violazioni del titolo III dell'ADA.

Il tuo sito web attuale è probabilmente non conforme

I dirigenti raramente si rendono conto che la conformità ADA è una preoccupazione quando si acquista un nuovo sito web. Quelli che spesso si fidano del fatto che chiunque sia in grado di creare siti Web eleganti e attraenti crei anche siti Web conformi ad ADA. Sfortunatamente, i web designer spesso ignorano le migliori pratiche per la conformità ADA o le ignorano per implementare nuove interessanti funzionalità di progettazione.

Anche i team pubblicitari di molti marchi ignorano i requisiti. Altri li prendono come suggerimenti e ignorano problemi importanti come il contrasto del colore e la dimensione del carattere perché richiederebbe il rebranding o modifiche a una campagna in corso per conformarsi.

Se non sei sicuro della conformità del tuo sito web, verificalo con la nostra checklist. Un'ora del tuo tempo potrebbe far risparmiare alla tua azienda decine di migliaia di dollari e l'umiliazione pubblica.

Testa il tuo sito web per la conformità ADA

Noi di Sagapixel Web Design abbiamo creato una checklist per testare la conformità ADA di un sito web. Ciò consente ai nostri team di progettazione web e creazione di contenuti di garantire che il loro lavoro sia accessibile al maggior numero di visitatori e potenziali clienti.

Come utilizzare la lista di controllo

Il test per la conformità ADA richiede più strumenti per testare diverse aree del tuo sito web. Esistono numerosi strumenti gratuiti come WAVE che possono testare i fattori di conformità più importanti, ma una revisione umana è necessaria per cose come sottotitoli e casi anomali che lo strumento non può rilevare, come problemi di ridisposizione e immagini con testo alternativo che non descrive cosa c'è nella cornice.

Scorri la nostra lista di controllo e prova per ogni articolo. Se superi il livello AA, congratulazioni! La tua attività è accessibile alla maggior parte delle persone con disabilità. Se non riesci a ottenere un articolo, sei a rischio di un'azione legale. Se non superi più di alcuni criteri, l'acquisto di un nuovo sito Web sarà probabilmente più economico che trattenere uno sviluppatore per risolvere i problemi che hai attualmente.

Visualizza l'elenco di controllo online di seguito o scarica un PDF dell'elenco di controllo per stamparlo o visualizzarlo offline.

Lista di controllo

Conformità di livello A

• Tutti i contenuti non testuali hanno un'alternativa testuale che serve allo stesso scopo.
• Qualsiasi media basato sul tempo, comprese le presentazioni solo audio e solo video, ha un'alternativa facilmente accessibile.
• Tutti i media sincronizzati preregistrati hanno sottotitoli.
• L'ordine di lettura di qualsiasi contenuto può essere determinato a livello di codice. Il contenuto è presentato in un ordine logico e la navigazione tramite tastiera segue questo ordine.
• Le istruzioni non si basano esclusivamente su caratteristiche sensoriali, come colore, suono o orientamento visivo, per spiegare come gestire i contenuti del sito web.
• Il colore non viene mai utilizzato come unico mezzo per comunicare la presenza di prompt, collegamenti o altri elementi visivi.
• Se l'audio è programmato per essere riprodotto automaticamente per più di 3 secondi, è disponibile un meccanismo per mettere in pausa l'audio o abbassare il volume indipendentemente dal volume del sistema.
• Gli utenti possono accedere a tutte le funzioni di un sito Web solo con una tastiera.
• I campi di input potrebbero non richiedere tempi di battitura specifici a meno che i tempi dei movimenti di un utente non siano essenziali per la funzione del campo.
• Se è possibile accedere a un componente tramite tastiera, deve anche essere possibile abbandonare quel componente utilizzando una tastiera.
• Se è necessario avere un comando di uscita da un componente sulla pagina, dovrebbe essere un unico tasto non stampabile, come Esc o Tab.
• Le scorciatoie a lettera singola devono avere almeno una delle seguenti caratteristiche:
  • Ci deve sempre essere un modo per disabilitare il collegamento.
  • Esiste un meccanismo per rimappare il collegamento a un carattere non stampabile.
  • Il collegamento funziona solo in un componente specifico ed è attivo solo quando quel componente ha lo stato attivo.
• Gli utenti dovrebbero essere in grado di estendere o disattivare i limiti di tempo nei contenuti, a meno che tale limite di tempo non sia una parte essenziale di una funzione della vita reale, come un'asta.
• Gli utenti dovrebbero essere in grado di nascondere eventuali funzioni di lampeggiamento o scorrimento. L'unica eccezione è per gli avvisi di emergenza autentici.
• Nessuna funzione può lampeggiare più di tre volte in un secondo.
• Deve esistere un meccanismo per aggirare i blocchi di contenuto duplicati.
• Tutti i titoli delle pagine devono descrivere l'argomento e lo scopo della pagina.
• Quando una pagina viene esplorata in sequenza, i componenti devono ricevere lo stato attivo nell'ordine corretto quando vi si accede dalla tastiera.
• Qualsiasi gesto multi-input ha un'unica alternativa di input.
• Quando una funzione viene attivata con un clic, deve utilizzare una delle seguenti funzioni di accessibilità:
  • Il solo clic in basso non attiva la funzione.
  • C'è un'opzione per annullare o interrompere il clic.
  • Il rilascio del pulsante del puntatore interrompe il clic.
  • L'unica eccezione è quando la funzione è progettata per emulare una tastiera o un tastierino.
• Quando un pulsante include testo o immagini, il nome del pulsante contiene quel nome o descrive il contenuto visivo del pulsante.
• Le funzioni attivate dal movimento devono anche avere un modo per attivarsi tramite l'interfaccia utente. L'unica eccezione è quando il movimento è una parte essenziale dell'attività e la GUI non è in grado di replicare la funzione.
• La lingua predefinita di una pagina Web può essere determinata a livello di codice.
• I pulsanti e altri componenti interattivi non possono cambiare il loro scopo quando ricevono lo stato attivo dall'utente.
• La modifica delle impostazioni utente non dovrebbe modificare il contesto dei pulsanti o degli elementi interattivi.
• Gli errori di input devono avere un nome e una descrizione testuali chiari.
• Qualsiasi campo di input dovrebbe avere un'etichetta e istruzioni chiare.
• Il nome, il ruolo e lo stato di tutti i componenti dell'interfaccia utente possono essere determinati a livello di codice.
• Qualsiasi contenuto o funzionalità implementata con il linguaggio di markup ha tag accurati e utilizza ID univoci.

Conformità al livello AA

• I contenuti multimediali sincronizzati dal vivo verranno presentati con sottotitoli.
• I media preregistrati dovrebbero avere sottotitoli con descrizione audio.
• L'orientamento di una pagina (orizzontale o verticale) non limita la visualizzazione o il funzionamento, a meno che l'orientamento non sia una caratteristica essenziale del contenuto.
• Lo scopo di qualsiasi input che raccolga informazioni sull'utente è chiaramente etichettato e può essere determinato a livello di codice.
• Il testo normale deve avere un contrasto di 4,5:1.
• Il testo con una dimensione del carattere di 18pt o superiore può avere un rapporto di contrasto minimo di 3:1. I testi puramente decorativi e i loghi aziendali sono esenti da questi standard.
• Il testo deve conservare tutti i contenuti e le funzionalità quando viene ridimensionato fino al 200%.
• Le immagini di testo non dovrebbero essere utilizzate in nessun luogo in cui il testo effettivo sarebbe sufficiente. Se l'immagine non ha alternative pratiche, come presentazioni di opere d'arte o documenti antichi, dovrebbe essere disponibile una descrizione dell'immagine.
• Il contenuto deve ridiscendere in una larghezza di 320 pixel CSS (scorrendo verticalmente) o 256 pixel CSS (scorrendo orizzontalmente) se ridimensionato fino al 400%
• I componenti dell'interfaccia utente e qualsiasi separazione cromatica non decorativa devono avere un contrasto di almeno 3:1.
• Spaziatura minima del testo:
  • L'altezza della linea è 1,5 volte la dimensione del carattere.
  • La spaziatura tra i paragrafi è 2 volte la dimensione del carattere
  • La spaziatura delle lettere è 0,12 volte la dimensione del carattere
  • La spaziatura delle parole è 0,16 volte la dimensione del carattere.
  • Se una determinata lingua o scrittura non supporta una di queste opzioni di spaziatura, è esente da tale opzione per motivi di accessibilità.
• Quando il contenuto viene visualizzato al passaggio del mouse o al focus della tastiera:
  • Dovrebbe esserci un modo per ignorare il contenuto senza cambiare focus.
  • Il contenuto non dovrebbe scomparire finché il puntatore o lo stato attivo rimangono su di esso.
  • Il contenuto non dovrebbe scomparire a meno che l'utente non lo attivi (ad esempio modificando il focus o ignorando il contenuto) o le informazioni non diventino valide.
• Esiste più di un modo per accedere a una pagina Web all'interno di un insieme di altre pagine Web a meno che quella pagina non sia una fase di un processo.
• Tutti i titoli e le etichette descrivono l'argomento o lo scopo del contenuto sottostante.
• L'indicatore di messa a fuoco della tastiera dovrebbe essere sempre visibile, ove applicabile.
• La lingua di un passaggio di testo è contrassegnata a livello di codice.
  • Si possono fare eccezioni per nomi, gergo tecnico e vernacolo ragionevole.
• Gli elementi di navigazione dovrebbero condividere lo stesso design, posizione e scopo nelle pagine relative al Web.
• Gli errori di input vengono rilevati automaticamente e vengono forniti suggerimenti su come risolverli.
• Se una pagina Web provoca un impegno legale, risulta in una transazione finanziaria o invia risposte di prova, deve includere almeno una di queste funzionalità:
  • La presentazione è reversibile.
  • Il sito Web verifica la presenza di omissioni ed errori di dati e offre all'utente la possibilità di correggerli.
  • L'utente ha la possibilità di rivedere, correggere e confermare tutte le informazioni che ha inserito.
• Il sito Web presenta messaggi di errore e di stato alla tecnologia assistiva anche quando l'utente non mette a fuoco il messaggio di errore.

Conformità al livello AAA

• L'interpretazione della lingua dei segni è fornita per qualsiasi supporto sincronizzato preregistrato.
• I contenuti multimediali preregistrati hanno sottotitoli con descrizione audio estesa.
• Sono fornite alternative senza tempo per i media solo video.
• Sono fornite alternative senza tempo per i media solo audio.
• Il contenuto implementato tramite linguaggi di markup e lo scopo dei componenti dell'interfaccia utente possono essere determinati a livello di codice.
• Il contrasto del testo normale è almeno 7:1. e il testo in grassetto è almeno 4,5:1.
• Se l'audio preregistrato è principalmente parlato, non dovrebbe esserci alcun rumore di fondo o la differenza tra rumore di fondo e parlato dovrebbe essere di almeno 20 dB. I contenuti musicali sono esenti.
• L'utente dovrebbe essere in grado di modificare il formato dei blocchi di testo in modo che:
  • i colori di primo piano e di sfondo sono selezionabili dall'utente,
  • i paragrafi non superano gli 80 caratteri o i 40 glifi cinesi/giapponesi/coreani,
  • l'interlinea è almeno 1,5 e l'interlinea tra i paragrafi è almeno 3,
  • Il testo non richiede all'utente di scorrere orizzontalmente quando viene ridimensionato fino al 200%.
  • Le immagini di testo sono utilizzate esclusivamente come decorazione. I loghi sono esenti.
• Tutte le funzionalità di un sito Web sono accessibili solo con un'interfaccia di tastiera.
• Nessuna funzione su un sito Web dovrebbe essere sensibile al tempo a meno che non sia legata a eventi del mondo reale.
• Eventuali interruzioni non di emergenza possono essere sospese o ignorate dall'utente.
• Alla scadenza di una sessione, gli utenti dovrebbero essere in grado di autenticarsi nuovamente e riprendere l'immissione delle informazioni.
• Gli utenti dovrebbero essere chiaramente informati se i dati andranno persi dopo un periodo di inattività e dovrebbe essere fornita un'opzione per salvare i dati dell'utente e continuare in un secondo momento.
• I movimenti animati non sono essenziali per trasmettere informazioni.
• Le animazioni possono essere disabilitate.
• Quando le pagine Web sono un insieme connesso, dovrebbe esserci una chiara indicazione visiva e programmatica della posizione di un utente.
• Il testo di un collegamento dovrebbe identificare lo scopo di un collegamento.
• Il testo è organizzato con tag di intestazione HTML.
• I pulsanti e le altre destinazioni per un puntatore devono essere almeno 44 px per 44 px.
• Modalità di input alternative possono essere bloccate dalla programmazione solo quando la restrizione è necessaria per un valido scopo di sicurezza.
• I prestiti linguistici, i modi di dire e il gergo tecnico stranieri sono definiti con markup del testo o collegamenti a un dizionario appropriato.
• Le abbreviazioni sono definite o possono essere ampliate per mostrare il termine completo.
• Una versione semplificata del contenuto dovrebbe essere disponibile se scritta al di sopra del livello di lettura del 9° grado.
• Quando la pronuncia di una parola è ambigua, dovrebbe essere inclusa una chiave per la pronuncia.
• Gli elementi di navigazione non dovrebbero mai cambiare contesto, a meno che l'utente non avvii la modifica.
• La guida sensibile al contesto o le descrizioni comandi sono sempre disponibili.
• Quando una pagina Web richiede a un utente di inviare informazioni personali, è inclusa almeno una di queste funzionalità:
  • La presentazione è reversibile.
  • Il sito Web verifica la presenza di omissioni ed errori di dati e offre all'utente la possibilità di correggerli.
  • L'utente ha la possibilità di rivedere, correggere e confermare tutte le informazioni che ha inserito.

Domande frequenti sulla progettazione Web conforme

Quali sono le linee guida ufficiali del sito web ADA?

Nonostante le revisioni recenti del 2008, l'ADA non menziona specificamente i siti Web o l'accessibilità a Internet. Migliaia di azioni legali vengono intentate ogni anno sull'accessibilità online e i tribunali hanno utilizzato le linee guida pubblicate dal World Wide Web Consortium (W3C), un'organizzazione riconosciuta a livello internazionale per gli standard Internet, come modello per una progettazione conforme. Linee guida per l'accessibilità dei contenuti Web (WCAG) del consorzio sono stati pubblicati dal 1999. Questi standard sono stati adottati come standard ISO nel 2012 e sono la base per le leggi sull'accessibilità del web in Europa e in Asia. Gli Stati Uniti ora impongono la conformità di livello AA alle WCAG per tutti i siti Web del governo e i giudici federali fanno riferimento a questi standard quando si pronuncia sull'accessibilità del sito Web e sulle violazioni del Titolo III ADA.

Con quale frequenza cambiano le linee guida di conformità?

Le linee guida sono state pubblicate per la prima volta nel 1999, con importanti revisioni nel 2008 e nel 2018. WCAG 2.1 è l'ultimo aggiornamento, pubblicato a giugno 2018. Contiene 17 nuovi criteri, per lo più volti all'accessibilità per smartphone e altri piccoli dispositivi touchscreen.

Il rispetto delle linee guida 2.0 risulterà comunque in un sito desktop accessibile. Tuttavia, gli standard 2.0 sono stati pubblicati 11 anni fa e non prevedevano la rivoluzione degli smartphone. Di conseguenza, non ci sono linee guida per creare siti Web mobili conformi e poche indicazioni per input operativi basati su touch e gesti. Se il tuo sito Web è stato creato per essere conforme ad ADA prima del 2018, potrebbe non soddisfare più gli standard minimi di conformità, soprattutto se accessibile da uno smartphone.

Qual è la differenza tra i livelli di conformità A, AA e AAA?

Il livello A è costituito da elementi e funzioni che devono essere assolutamente presenti affinché una persona con disabilità possa utilizzare il tuo sito web. Se una funzione di livello A è assente, il tuo sito Web semplicemente non è accessibile.

Il livello AA contiene elementi fortemente consigliati per l'accessibilità. Se mancano delle funzionalità AA, sarà molto difficile per le persone con disabilità visive o fisiche navigare nel tuo sito web. Per la conformità ADA, questo è il livello di accessibilità minimamente accettabile.

Il livello AAA contiene le funzionalità di accessibilità più avanzate. Non tutte queste funzionalità sono possibili su tutti i siti Web o piattaforme digitali. Si consiglia di includere il maggior numero possibile di funzionalità AAA o funzionalità AAA parziali, ma la piena conformità AAA non è un obiettivo ragionevole per la maggior parte dei siti Web o dei tipi di attività.

I principi del web design conforme ad ADA

Percettibile

• Adattabile: il contenuto non deve perdere struttura o funzionalità se presentato in un formato alternativo, ad esempio se ingrandito o elaborato da un'utilità per la lettura dello schermo.
• Distinguibile: il contenuto visivo e audio deve essere chiaro e distinto, compreso il contrasto tra i colori del testo e dello sfondo e collegamenti ipertestuali e pulsanti chiaramente contrassegnati.
• Alternative multimediali basate sul tempo: dovrebbero esserci alternative facilmente accessibili per contenuti audio e video, come una trascrizione completa di clip audio e spiegazioni scritte di qualsiasi grafica o tabella.

Operabile

• Tastiera accessibile: tutte le funzioni di un sito Web dovrebbero essere disponibili solo con una tastiera. I gesti e l'utilizzo del mouse non dovrebbero mai essere l'unico metodo di input.
• Navigabile: dovrebbero esserci indicazioni chiare su dove si trova un utente su un sito Web e su come raggiungere le varie pagine collegate. Tutti i pulsanti, i collegamenti ei campi di input devono essere chiaramente etichettati e facilmente distinguibili.
• Gesti e input accessibili: la funzionalità non dovrebbe mai dipendere da gesti o attività del puntatore basati sul percorso o multipunto e qualsiasi input dovrebbe avere un'opzione di interruzione o annullamento.

Comprensibile

• Leggibile: qualsiasi contenuto di testo dovrebbe poter essere analizzato da dispositivi di assistenza.
• Prevedibile: le pagine Web dovrebbero funzionare in modo coerente e logico. I pulsanti di navigazione dovrebbero mantenere lo stesso contesto prima e dopo l'uso e qualsiasi modifica nel contesto dovrebbe essere chiara per l'utente.
• Assistenza all'input: le pagine Web dovrebbero aiutare gli utenti a evitare e correggere possibili errori. Qualsiasi messaggio di errore dovrebbe avere una spiegazione chiara, un suggerimento per risolverlo e un'etichetta.

Robusto

• Compatibilità con le versioni precedenti: i siti Web dovrebbero essere in grado di interfacciarsi con le generazioni precedenti di tecnologie assistive, oltre a soddisfare tutti gli standard attuali.
• Progettato per le tecnologie assistive: tutti gli elementi di un sito Web devono avere nomi, ruoli e valori che possono essere determinati a livello di codice da lettori di schermo e altri dispositivi di assistenza.
• Markup e messaggi di stato: il markup del testo e i messaggi di stato importanti devono essere programmati in modo da essere accessibili agli screen reader, anche se il messaggio non è attualmente a fuoco.

Le piccole imprese dovrebbero essere conformi all'ADA?

Le piccole imprese, la maggior parte delle attività stagionali e le istituzioni religiose sono legalmente esenti dalla maggior parte dei requisiti del Titolo III. Un negozio di sandwich a conduzione familiare non è legalmente obbligato a installare una rampa per sedie a rotelle e un negozio di hobby locale non può essere citato in giudizio per aver dimenticato di inserire un testo alternativo sulle foto dei prodotti del loro sito web. Anche così, ha senso che anche la più piccola azienda con una presenza online pensi alla conformità ADA.

Essere non conformi significa molto di più di un testo di difficile lettura e di una navigazione difficile. Quando mancano elementi essenziali come il testo alternativo sulle immagini e le istruzioni per completare i campi di input, i clienti potrebbero non essere in grado di completare un acquisto. Alcune funzionalità di progettazione precedenti potrebbero persino impedire a coloro che dispongono di tecnologia di lettura dello schermo assistita di vedere il tuo numero di telefono e indirizzo. Essere facilmente accessibile online ha senso per quasi tutti i piccoli negozi.