Accessibilità siti web fra teoria e pratica

Sul tema dell’accessibilità si fa ancora molta confusione anche tra chi si occupa di web design. C’è chi usa il termine in maniera impropria per indicare l’usabilità o la facilità di navigazione di un sito internet, chi la ritiene solo un obbligo di legge per la realizzazione di siti web istituzionali.

In molti casi, chi si confronta con l’accessibilità web si preoccupa principalmente di ottenere un esito positivo dalla verifica tecnica (validazione) dei requisiti previsti dallo standard di riferimento, perseguendo in tal modo l’accessibilità teorica del sito internet. A questa, però, deve necessariamente accompagnarsi la verifica dell’accessibilità reale, basata sui test con gli utenti beneficiari e sui risultati concreti ottenuti. Solo così il sito web può definirsi davvero accessibile.

Nella prima parte di questo articolo riassumo brevemente i concetti di accessibilità e usabilità e accenno alla normativa italiana per la realizzazione di siti web accessibili per la Pubblica Amministrazione. Nella seconda parte mostro alcuni esempi pratici di corretta applicazione delle linee guida per l’accessibilità.

Considerata la corposità del contenuto, fornisco i link per saltare direttamente alle diverse sezioni che lo compongono:

• Cos’è l’accessibilità
• Usabilità e accessibilità
• Accessibilità dei siti web per la Pubblica Amministrazione: la Legge Stanca
• Accessibilità teorica e accessibilità reale
• Alternative testuali
• Indipendenza dal colore
• Cambiamenti temporizzati dei contenuti
• Indipendenza dal dispositivo e scalabilità
• Aiuti alla navigazione
• Documenti chiari e semplici

Cos’è l’accessibilità

La definizione di accessibilità data dal World Wide Web Consortium (W3C) è la seguente:

Accessibilità web significa, dunque, rendere le risorse presenti in Internet fruibili e usabili da tutte le categorie di utenti – normodotati e diversamente abili – garantendo pieno accesso alle informazioni e ai servizi disponibili in rete.

I siti web accessibili sono navigabili da utenti ciechi, sordi, ipovedenti, disabili motori, persone con disturbi cognitivi e altri utenti affetti da disabilità di vario genere al pari degli utenti normodotati. Si presentano esteticamente come siti “normali” ma possiedono speciali caratteristiche che li rendono gestibili dalle diverse tecnologie assistive – browser testuali, display Braille, screen reader, ingranditori di schermo, ecc. – utilizzate dalle persone diversamente abili.

Per maggiori informazioni sulle linee guida per l’accessibilità dei contenuti web (WCAG 2.0) è possibile consultare il sito www.w3.org/Translations/WCAG20-it oppure la sezione del W3C che si occupa di accessibilità, la WAI (Web Accessibility Initiative).

Usabilità e accessibilità

La norma ISO 9241-210:2010 definisce l’usabilità come:

Riferita a Internet, l’usabilità è un approccio della progettazione per rendere i siti web facili da usare per l’utente finale, senza che sia richiesta una formazione specifica. Usabilità e accessibilità, pertanto, non sono sinonimi, piuttosto la prima è un prerequisito della seconda poiché un sito accessibile deve essere per forza anche usabile.

Accessibilità dei siti web per la Pubblica Amministrazione: la Legge Stanca

Per tutelare il diritto degli utenti con disabilità a fruire degli strumenti informatici, e in particolare di Internet, l’Italia si è dotata, fin dal 2004, di un apposito strumento legislativo, la Legge 9 gennaio 2004, n. 4, intitolata “Disposizioni per favorire l’accesso dei soggetti disabili agli strumenti informatici”, comunemente chiamata Legge Stanca, dal nome dell’allora ministro per l’Innovazione e le tecnologie Lucio Stanca.

Il Decreto Ministeriale dell’8 luglio 2005, intitolato “Requisiti tecnici e i diversi livelli per l’accessibilità agli strumenti informatici”, definisce i requisiti tecnici e i punti di controllo per l’implementazione e la verifica dell’accessibilità sulla base dei Principi, delle Linee guida e dei Criteri di successo contenuti nelle Web Content Accessibility Guidelines 2.0 (WCAG 2.0) del W3C. Il rispetto di tali requisiti è condizione necessaria perché un sito internet possa definirsi accessibile in aderenza alla legge 4/2004.

Sono tenuti a rispettare la Legge Stanca i seguenti soggetti:

• pubbliche amministrazioni;
• enti pubblici economici;
• aziende private concessionarie di servizi pubblici;
• enti di assistenza e di riabilitazione pubblici;
• aziende di trasporto e di telecomunicazione a prevalente partecipazione di capitale pubblico;
• aziende municipalizzate regionali;
• aziende appaltatrici di servizi informatici.
• chi usufruisce di contributi pubblici o agevolazioni per l’erogazione dei propri servizi tramite sistemi informativi o internet.

Accessibilità teorica e accessibilità reale

Molti siti web che vantano un certo grado di accessibilità sono realizzati tramite CMS per i quali sono disponibili in rete template accessibili progettati in modo che la struttura e l’organizzazione dei contenuti aderiscano alle norme del W3C o, nel caso dell’Italia, alla legge 4/2004. È il caso, ad esempio, della maggior parte dei siti web istituzionali. In situazioni simili, la verifica della conformità ai requisiti è affidata quasi sempre alla bontà del template o ai software di validazione automatica. Questo, però, non garantisce che le pagine siano realmente accessibili in quanto la sola verifica tecnica non è sufficiente, ma c’è bisogno anche della verifica soggettiva da parte di un esperto di accessibilità e, se possibile, di un gruppo di valutazione composto da utenti disabili.

L’accessibilità reale di un sito internet si ottiene soprattutto attraverso:

• la conoscenza delle diverse tipologie di disabilità (incluse quelle temporanee);
• lo studio delle tecnologie assistive presenti sul mercato;
• l’analisi dei contesti, degli scopi e dei modi di interazione dell’utente.

Vediamo adesso alcuni casi di buone pratiche nell’applicazione delle principali linee guida per l’accessibilità dei siti web.

Alternative testuali

Il testo è la sola forma di contenuto facilmente interpretabile da tutte le tecnologie assistive – browser testuali e sintetizzatori vocali in primis – per questo è necessario fornire alternative testuali per tutti i contenuti di natura non  testuale come immagini, audio, video e animazioni. I testi alternativi, però, devono rendere in parole solo i contenuti non testuali che abbiano un valore realmente informativo; in tutti gli altri casi vanno evitati per non generare inutile “rumore”.

Ad esempio, per le immagini decorative e di servizio è sbagliato valorizzare l’attributo alt: deve essere presente nel codice ma lasciato vuoto.

Un logo deve avere come descrizione alternativa (attributo alt) il nome dell’azienda, dell’ente o dell’organizzazione a cui appartiene. Può riportare la descrizione testuale di ciò che è e di ciò che vi è raffigurato solo se l’autore intende attirare espressamente l’attenzione su di esso. Se al logo è applicato un collegamento ipertestuale, va inserito come testo alternativo il nome associato al logo e/o la destinazione del link.

Se l’immagine è utilizzata per realizzare un pulsante grafico, il testo alternativo deve descrivere la funzione (ad esempio “Cerca nel sito”) e non cosa raffigura (ad esempio “Lente di ingrandimento”); è sbagliato in questo caso non inserire alcuna descrizione poiché chi naviga in maniera non visuale non capirebbe a cosa serve il pulsante.

Se il contenuto di un’immagine è già esplicitato nel testo della pagina che la contiene o nella didascalia a essa associata, è ridondante inserire un testo alternativo; meglio lasciare vuoto l’attributo alt.

Un caso particolare è rappresentato dai CAPTCHA che di solito riportano disegni ingarbugliati all’interno dei quali solo un utente umano può riuscire a riconoscere la serie di lettere e/o numeri. È chiaro che  inserire un attributo alt contenente esattamente la serie di caratteri rappresentati graficamente nel CAPTCHA non è praticabile perché sarebbe molto facile per i programmatori di robot leggerne il contenuto. Alcuni siti, quindi, mettono a disposizione un’alternativa audio che permette di ascoltare il contenuto del CAPTCHA con un sottofondo disturbato da rumore. Questa soluzione, tuttavia, non è perfettamente accessibile in quanto l’ascolto del file audio contenente il codice può interferire con l’ascolto della sintesi vocale; inoltre, continua a non essere valida per chi ha problemi d’udito, oltre che di vista. È possibile risolvere il problema realizzando opportuni CAPTCHA puramente testuali, basati per esempio su semplici calcoli numerici tipo: “Quanto fa 3 sommato a 2?”

Indipendenza dal colore

In un documento accessibile le informazioni devono essere leggibili e usabili anche in assenza del colore. Questo è fondamentale soprattutto per gli utenti non vedenti o affetti da cecità ai colori (incapacità di distinguere i colori).

Un caso tipico di dipendenza dal colore è rappresentato dalle spiegazioni che accompagnano alcuni tipi di grafici nei quali le diverse informazioni sono veicolate attraverso linee di colore diverso. Per risolvere il problema basta utilizzare una distinzione ottenuta per mezzo di linee variamente spezzate o di aree riempite con motivi differenti.

Un’altra situazione comune è l’uso del colore per segnalare gli errori nella compilazione dei moduli elettronici: in genere si evidenziano in rosso i nomi e/o i bordi dei campi che presentano errori e si mostra una frase tipo: “I campi marcati in rosso devono essere compilati”. Una soluzione accessibile è quella di mostrare avvisi che riportano il nome dei campi che presentano errori collegati tramite label ai rispettivi input utilizzando l’attributo for.

Lo stesso discorso vale per i link che devono essere segnalati in modo chiaro, senza fare affidamento solo su un colore diverso rispetto al testo normale, ad esempio utilizzando sottolineature o bordi.

Nel caso di immagini informative che prevedono la sovrapposizione di più elementi bisogna accertarsi che ci sia sufficiente contrasto (come previsto dall’algoritmo del W3C) tra le forme in primo piano e lo sfondo in modo che risultino comprensibili anche da chi ha una percezione alterata dei colori.

Cambiamenti temporizzati dei contenuti

In una pagina web accessibile gli oggetti che si muovono, lampeggiano, scorrono o si auto-aggiornano devono poter essere interrotti o bloccati. Gli oggetti in movimento sullo schermo e le funzioni temporizzate creano, infatti, numerosi tipi di problemi dal punto di vista dell’accessibilità per chi soffre di crisi epilettiche, problemi di messa a fuoco o di nistagmo, problemi di mobilità, disabilità cognitive.

Nel caso di contenuti intermittenti o che producono sfarfallamenti, se proprio non è possibile escluderli, è necessario evitare le frequenze tra 4 e 59 Hertz per non generare crisi di epilessia fotosensibile.

Per i contenuti scorrevoli, come ad esempio gli aggiornamenti delle news, i caroselli di immagini o le animazioni, bisognerebbe sempre inserire controlli per consentire all’utente l’arresto del movimento.

Indipendenza dal dispositivo e scalabilità

Un sito web accessibile deve garantire un accesso alle funzionalità indipendente dal dispositivo e compatibile con le tecnologie assistive. Per farlo si possono sfruttare i principi del potenziamento progressivo (progressive enhancement) che prevede la progettazione di un’unica applicazione di tipo piramidale nella quale è possibile, partendo dalla base, identificare quattro strati principali:

• contenuti: testi, immagini, suoni, animazioni, grafici, ecc.
• struttura: rappresentazione semantica dei contenuti mediante un linguaggio di marcatura strutturale (es. HTML);
• presentazione: formattazione dei contenuti tramite fogli di stile;
• comportamenti: funzioni dinamiche e interattive affidate agli script (es. JavaScript).

In questa struttura è fondamentale la totale separazione tra gli strati e in particolare deve essere rispettata la regola secondo cui gli elementi superiori non possono esistere senza quelli inferiori, ma quelli inferiori sono invece autosufficienti, cioè possono esistere e funzionare senza il livello o i livelli superiori. Questo approccio rende l’applicazione scalabile, ovvero per ogni tipo di contenuto complesso è direttamente disponibile un’alternativa di livello inferiore senza perdita di informazioni.

Aiuti alla navigazione

All’interno di un sito internet accessibile i link devono essere autodescrittivi, vale a dire che l’anchor text deve chiarire da solo la destinazione del collegamento, anche se letto fuori dal contesto. Questo è importante specialmente per i ciechi che navigano i siti web saltando da link a link e che non trovano alcuna utilità se incontrano un anchor text tipo “Clicca qui”. Se l’anchor text da solo non basta, è possibile utilizzare l’attributo title del link per specificare meglio la destinazione. Se un link apre un’altra finestra, è utile renderlo noto agli utenti perché, come nel caso dei non vedenti, si potrebbero ritrovare su un altro sito senza rendersene conto. Un modo per farlo è aggiungere nel title del collegamento un’ informazione tipo “Link esterno” o “Apre un’altra finestra”. Se invece si linkano dei file da scaricare, è utile indicare tipo di file e dimensione; questo si può fare direttamente nell’anchor text o nel title del link.

Bisogna fornire meccanismi per saltare gruppi di contenuti ripetitivi, come ad esempio i menu di navigazione e le informazioni nel footer che si ripetono in ogni pagina del sito. I contenuti ripetitivi, infatti, rallentano la scansione dei documenti da parte delle tecnologie assistive che sono costrette a leggere informazioni ridondanti di cui l’utente è già a conoscenza. Per saltare i contenuti che si ripetono la tecnica più utilizzata consiste nel farli precedere da un link di salto (nascosto tramite CSS) che manda a un’ancora posta appena dopo di essi.

Nell’implementazione dei form è necessario collegare esplicitamente le label con i rispettivi controlli (input, select, textarea, ecc.) utilizzando ad esempio l’associazione tra id e for. Se presente, il messaggio che avvisa della presenza di campi obbligatori (es. “I campi indicati con * sono obbligatori”) deve precedere e non seguire l’elenco dei campi, altrimenti chi naviga in maniera non visuale se ne renderà conto solo dopo aver letto il form.

Per le tabelle di dati è importante fornire sempre un sommario (attributo summary di table) che ne descriva il contenuto in modo tale che chi non può vederlo riesca a comprenderlo comunque.

Documenti chiari e semplici

I siti web accessibili devono usare la massima chiarezza e la massima semplicità di linguaggio, in relazione al tipo di contenuto, in modo che possano essere compresi più facilmente da tutte le categorie di utenti. Questo discorso vale specialmente per i siti delle pubbliche amministrazioni per i quali è stata emanata un’apposita direttiva sulla semplificazione del linguaggio.

Scrivere in modo accessibile vuol dire innanzitutto scrivere per farsi capire. Alcuni consigli:

• rendere chiari e accurati i titoli e le descrizioni dei collegamenti;
• specificare l’argomento della frase o del paragrafo al loro inizio;
• limitare ciascun paragrafo a una sola idea principale;
• evitare gerghi, linguaggi settoriali e accezioni specialistiche di parole familiari, a meno che non siano definite all’interno del documento;
• utilizzare di preferenza parole di uso comune;
• usare la forma attiva piuttosto che la forma passiva dei verbi;
• evitare strutture del periodo complesse.

L’accessibilità dei siti web rappresenta un importante fattore di innovazione tecnologica, nonché di crescita morale e culturale. Per questo non dovrebbe essere visto solo come un obbligo di legge per la pubblica amministrazione ma come un vero e proprio approccio nella realizzazione e nell’aggiornamento di qualsiasi sito internet.