autori: Criscuolo Barbara, Di Lenarda Enrico, Noselli Monica
Il sito della Regione Lombardia, contrariamente a quanto dichiarato, non raggiunge il livello di accessibilità A delle WCAG 1.0. I problemi più gravi riscontrati sono i seguenti:
A questi si può aggiungere il fatto che l'impaginazione dell'intero sito è affidata alle tabelle, cosa assolutamente sconsigliata dal W3C.
La verifica di conformità alle linee guida per l'accessibilità WCAG 1.0 del sito della Regione Lombardia è stata effettuata tra il 16 ed il 21 maggio 2005. Poiché il sito è di dimensioni molto vaste, è stato scelto un campione di pagine sul quale effettuare l'analisi: ogni pagina considerata è stata esaminata manualmente, e ad ogni punto di controllo è stato assegnato un grado di conformità alle linee guida attraverso i seguenti simboli:
Conforme
Parzialmente
conforme
Non conforme
Quasi tutte le immagini sono giustamente provviste dell'attributo "alt": le immagini considerate decorative hanno alt vuoto (alt=""), mentre le immagini significative (come quelle dei link della barra di navigazione in tutte le pagine) hanno alt descrittivo. Il banner animato presente in alto a destra in tutte le pagine è un link ad una newsletter, però il suo alt è etichettato "banner" , che non è assolutamente significativo. I titoli "Servizi/E-governement" e "Tematiche" presenti nella homepage del sito hanno alt vuoto: questo impedisce ad un utente che non può vedere le immagini di capire quale argomento si sta trattando. Nella pagina Ricerca avanzata, effettuando una ricerca senza esito viene visualizzata l'immagine di una freccia rossa: essa non ha l'attributo alt e viene letta da un browser testuale con il suo nome, ovvero "[freccia_dx_rossa]" (vedi Figura 1).
Figura 1: Un'immagine priva di attributo "alt" viene visualizzata in Lynx con il suo nome.
Non ci sono nel sito immagini sensibili lato Server.
Non sono presenti filmati nel sito.
Non esiste nel sito informazione che venga veicolata esclusivamente dal colore.
Nel sito non vengono identificati i cambiamenti di linguaggio naturale: le parole straniere come "Marketplace/e-procurement" presenti nella pagina "Servizi" dovrebbero essere segnalate attraverso il codice usando il tag "span" e l'attributo "lang" in questo modo:
<p>La soluzione di <span lang="en">Marketplace</span></p>
Questo permette ai lettori di schermo o ai browser vocali di pronunciare correttamente le parole.
Le tabelle di dati presenti nel sito, di cui abbiamo un esempio nella pagina raggiungibile seguendo i link Home>Navigazione Tematica>Agricoltura>Foreste, boschi e montagna> Piano d'Area Malpensa - contributi per ricerche e monitoraggi, sono prive di intestazioni di righe: si dovrebbe usare il tag "th" per identificare le intestazioni di righe e "td" per le celle di dati .
Nelle pagine analizzate non sono state riscontrate tabelle di dati con due o più livelli logici di intestazione.
Disabilitando i fogli di stile il layout delle pagine non cambia ed il sito rimane comunque comprensibile: questo è dovuto al fatto che vengono usate le tabelle per l'organizzazione del layout, anche se questa sarebbe una pratica da evitare.
Gli equivalenti del contenuto dinamico vengono aggiornati quando il contenuto cambia. Possiamo avere un esempio di questo nella pagina Home>Servizi>Orari mezzi di trasporto regionali : questa pagina è realizzata con i frame(anche se questo è sconsigliato), e in essi vengono incluse giustamente delle pagine html e non delle immagini: queste ultime non devono essere inserite direttamente in un frame, poiché il contenuto equivalente non verrebbe aggiornato se l'immagine cambia.
Le pagine analizzate sono utilizzabili anche quando gli script sono disabilitati o non supportati. Non sono presenti applet.
Non ci sono sfarfallii dello schermo.
Nelle pagine analizzate non sono presenti immagini sensibili.
La pagina raggiungibile seguendo i link Home>Servizi>Orari mezzi di trasporto regionali, presenta una struttura formata da frame, ma essi sono tutti privi del titolo di identificazione: un utente di browser testuale non riuscirà ad usare questa pagina perché non è chiaro il contenuto di ogni frame (vedi Figura 2 e Figura 3).
Figura 2 : Frame privi di titolo di identificazione visualizzati da Lynx.
Figura 3: Frame privi del titolo di identificazione visualizzati da Lynx
Per facilitare la navigazione e l'orientamento si deve usare l'attributo "title" con l'elemento "frame".
A volte il linguaggio del sito presenta alcuni termini che sono piuttosto tecnici per il target cui esso è rivolto, ovvero tutti le categorie di cittadini. Parole come "Call Center", "Pay online", "Marketplace", "E-procurement", dovrebbero essere sostituite dai loro equivalenti italiani.
Le combinazioni di colori utilizzate nelle pagine considerate forniscono un contrasto sufficiente se visualizzate in scala di grigi.
Tutti i link della barra di navigazione sono delle immagini: per rappresentare un testo è preferibile invece usare testo e fogli di stile.
Il testo fa correttamente riferimento ad una grammatica formale pubblicata, e precisamente al DTD HTML 4.01 Transitional.
Il sito usa i fogli di stile per controllare alcune proprietà di presentazione del contenuto. Invece l'impaginazione è effettuata completamente attraverso le tabelle, cosa che sarebbe invece da implementare tramite CSS. In molte pagine del sito viene usato l'elemento "font" per controllare gli stili dei caratteri (vedi ad esempio la pagina Servizi): questo tag è stato deprecato dal W3C e al suo posto dovrebbero essere usati i fogli di stile.
Nei fogli di stile che controllano la presentazione del contenuto vengono usate solamente unità di misura assolute, come possiamo vedere nel codice d'esempio seguente:
.ricerca th { background-color: #E7F5EF; border-top: 1px solid #188A63; color: #188A63; font-family: Verdana, sans-serif; font-size: 12px; font-weight: bold; height: 20px; text-align: left; }
Sarebbe preferibile usare unità di misura relative e non assolute, come "em" o misure di percentuale.
Nel sito non vengono usati gli elementi di intestazione per veicolare la struttura del documento: i titoli dei paragrafi e il contenuto, se visualizzati senza il supporto dei CSS, hanno la stessa dimensione e si differenziano spesso solo per il fatto che i titoli sono dei link e quindi sono sottolineati (vedi Figura 4).
Figura 4 : Titoli dei paragrafi e contenuto visti senza il supporto dei CSS.
Alcune pagine del sito presentano grandi quantità di link, come ad esempio la pagina raggiungibile seguendo i link Home>Tematiche (vedi Figura 5).
Figura 5: Link della pagina Tematiche visualizzati da Lynx.
Queste lunghe sequenze di collegamenti possono risultare frustranti per utenti non vedenti che non conoscono l'ampiezza della successione: sarebbe meglio organizzarli in liste ordinate usando in modo appropriato l'elemento "ol" e "li".
Le citazioni non vengono marcate, come possiamo vedere dall'esempio seguente, tratto dalla pagina delle news del 13 maggio 2005 dal titolo "Da Formigoni il presidente della Serbia, Tadic":
<br> Il colloquio, ampio e approfondito, ha confermato e sviluppato "l'interesse reciproco - come ha spiegato Formigoni -che Serbia e Lombardia hanno a rafforzare la propria collaborazione, in particolare sul piano economico e commerciale, ma anche su quello politico e culturale,visti anche i legami storici tra i nostri paesi".<br>
Le citazioni devono essere marcate con gli elementi "q" o "blockquote".
Tutto il sito è impaginato usando le tabelle: esse dovrebbero essere usate per marcare informazioni realmente "tabellari", cioè tabelle di dati. Comunque la visualizzazione del contenuto da parte di un browser testuale (Lynx) mantiene una certa coerenza, e quindi il sito rimane abbastanza fruibile.
Giustamente non vengono usati marcatori di struttura per la formattazione della resa visiva.
Nelle pagine considerate non vi sono script e applet i cui gestori di eventi siano dipendenti dal dispositivo.
La pagina raggiungibile seguendo i link Home>Servizi>Orari mezzi di trasporto regionali è formata da frame, ma non è presente un attributo "noframes" che permette ai browser che non li supportano di visualizzare delle informazioni alternative. Si dovrebbe usare "noframes" alla fine di ogni insieme di frame, come nell'esempio seguente:
<HEAD> <TITLE>Questo è top.html</TITLE> </HEAD> <FRAMESET cols="50%, 50%" title="Il nostro documento"> <FRAME src="main.html" title="Dove il contenuto è visualizzato"> <FRAME src="table_of_contents.html" title="Tavola dei contenuti"> <NOFRAMES> <A href="table_of_contents.html">Tavola dei contenuti.</A> </NOFRAMES> </FRAMESET>
Così facendo, se un un browser non supporta i frame, si può avere accesso tramite un link ad una versione non-frame della stessa informazione.
Il contenuto delle pagine considerate non presenta lampeggiamenti.
In tutte le pagine del sito è presente, in alto a destra, un banner animato che cambia la propria presentazione ad intervalli regolari. Fino a quando i browser non permetteranno agli utenti di bloccare il contenuto in movimento è preferibile evitare di far muovere il contenuto.
Tra quelle considerate non sono presenti pagine che si autoaggiornano automaticamente.
La pagina principale del sito, www.regione.lombardia.it, presenta un reindirizzamento automatico implementato attraverso marcatura, con il codice seguente:
<meta HTTP-EQUIV="refresh" CONTENT="0;
URL=http://www.regione.lombardia.it/rlcontent/linker/portal/homepage">
Finchè i browser non forniranno la capacità di bloccare l'autoindirizzamento, evitare di reindirizzare automaticamente le pagine.
Non sono presenti nelle pagine considerate degli oggetti che abbiano delle proprie interfacce.
Non vi sono elementi che possiedono una specifica interfaccia che siano gestiti in una modalità dipendente da dispositivo.
Non vi sono, nelle pagine analizzate, script che possiedono gestori di evento.
Nel sito in questione, seguendo alcuni collegamenti, si aprono nuove finestre senza che l'utente venga avvertito. Un esempio lo possiamo avere seguendo i link Home>Servizi>Lombardia Integrata. E' preferibile evitare di fare apparire nuove finestre senza informare l'utente, che potrebbe rimanere disorientato non trovando più attivo il pulsante "back".
Le etichette dei controlli dei moduli sono posizionate nel modo corretto, ovvero precedono il proprio controllo immediatamente sulla stessa riga. Un esempio lo possiamo trovare nel form della Ricerca avanzata.
Nel sito vengono usate le tecnologie HTML 4.01 e CSS, entrambe raccomandate dal W3C.
In molte pagine del sito viene usato l'elemento "font" dell'HTML, ad esempio nella pagina Servizi, come si può vedere dal frammento di codice seguente:
<font size="1" face="Verdana">Il sistema di agevolazioni...
L'uso di questo elemento è stato disapprovato dal W3C: è preferibile usare i fogli di stile per il controllo degli stili dei caratteri.
I frame che compongono la pagina Home>Servizi>Orari mezzi di trasporto regionali, oltre ad essere privi dei titoli (vedi punto di controllo 12.1), sono privi anche di ogni descrizione riguardo al loro scopo e al modo in cui interagiscono. Per ovviare a questa mancanza si dovrebbe usare l'attributo "longdesc", oppure un collegamento descrittivo.
Molte pagine del sito, come ad esempio la pagina Servizi, presentano lunghe liste di link posti uno dietro l'altro: un utente disabile può facilmente perdersi o rimanere disorientato. E' opportuno dividere i grandi blocchi di informazione in gruppi più maneggevoli.
In tutti i form presenti nelle pagine del sito mancano le associazioni esplicite delle etichette ai loro controlli. Usare l'elemento "label" ed il suo attributo "for" per implementare questa associazione etichetta-controllo.
In diverse pagine analizzate sono presenti alcuni link con etichetta "segue >>" che portano ad altre notizie o argomenti correlati: questa denominazione non è assolutamente significativa poichè non permette all'etichetta di mantenere un senso se letta fuori dal contesto.
Nelle pagine considerate non vengono usati metadata: questi elementi sono utili per fornire indicazioni come l'autore del documento, il tipo di contenuto, ecc...
E' giustamente presente una pagina che riassume la struttura del sito, raggiungibile dal link Mappa posto in alto a destra in tutte le pagine. Non vengono menzionate le caratteristiche di accessibilità disponibili.
I meccanismi di navigazione del sito sono usati in modo coerente: la barra di navigazione compare nello stesso punto in ogni pagina.
Nelle pagine analizzate non sono presenti immagini sensibili.
Nelle pagine prese in esame non vengono sciolti tutti gli acronimi e le abbreviazioni: abbiamo un esempio nella pagina Servizi:
<td class="normalenews">Il Progetto CRS-SISS: Il modo per migliorare il...
In HTML bisogna usare l'attributo "title" degli elementi "abbr" e "acronym" per sciogliere abbreviazioni ed acronimi, almeno dove compaiono per la prima volta.
In tutte le pagine viene giustamente identificato il linguaggio principale del documento tramite l'attributo "lang" del tag "html".
Per molte tabelle presenti nelle pagine considerate, ma non per tutte, sono giustamente presenti dei sommari (attributo "summary" dell'elemento "table") che descrivono il contenuto della tabella. Ad esempio, nella Homepage, abbiamo la tabella "Barra di navigazione", la tabella "Barra delle utility", ecc... Altre tabelle, come la tabella di dati presente nella pagina Home>Navigazione Tematica>Agricoltura>Foreste, boschi e montagna>Piano d'Area Malpensa - contributi per ricerche e monitoraggi, sono prive del sommario.
In tutte le pagine manca l'attributo "abbr" per l'elemento "th".
L'ordine di tabulazione fra i vari collegamenti nelle pagine presenta delle piccole differenze tra le varie pagine: mentre infatti, nella pagina Tematiche la tabulazione fra le varie tematiche avviene da sinistra a destra e dall'alto in basso, nella pagina Servizi avviene prima dall'alto in basso e poi da sinistra a destra. Per garantire un ordine logico e coerente di tabulazione fra i vari link si potrebbe far uso dell'attributo "tabindex".
Non vengono fornite scorciatoie da tastiera per i collegamenti più importanti e per i controlli dei moduli: queste scorciatoie permettono agli utenti con disabilità di selezionare un link in modo sicuro e veloce. Per specificare scorciatoie si deve usare l'attributo "accesskey".
Gli interpreti usati per la valutazione del sito gestiscono nel modo corretto il testo affiancato delle tabelle.
Mancano dei caratteri di default nelle caselle per l'inserimento di testo nei form.
Nelle pagine prese in esame mancano dei caratteri stampabili che separino i collegamenti adiacenti: se vediamo la barra di navigazione senza le immagini, notiamo che i collegamenti sono attaccati l'uno all'altro e sono difficili da distinguere (vedi Figura 6).
Figura 6 : Barra di navigazione con immagini disattivate.
Il sito è disponibile solo in lingua italiana: per i visitatori stranieri c'è una pagina raggiungibile seguendo il link Foreign Visitors dalla quale è possibile scaricare dei documenti pdf in varie lingue che presentano la regione Lombardia. Bisognerebbe fornire agli utenti stranieri la stessa informazione presente nel sito in lingua originale.
Il sito fornisce correttamente una barra di navigazione con i principali collegamenti.
Non viene fornita una modalità per saltare i gruppi di informazioni: per gli utenti di browser vocali può essere utile riuscire ad evitare i gruppi di collegamenti presenti in tutte le pagine, come ad esempio le barre di navigazione.
Nel sito preso in esame è disponibile una modalità di ricerca avanzata che rende possibile una interrogazione più dettagliata.
Le informazioni più significative vengono posizionate correttamente all'inizio dei paragrafi, delle intestazioni, ecc...
Nelle pagine considerate non sono presenti raccolte di documenti.
Nelle pagine considerate no è presente arte ASCII multilinea.
Non vi sono, tra quelle prese in esame, pagine il cui contenuto possa essere facilitato da presentazioni grafiche o uditive.
A volte lo stile di presentazione tra le varie pagine non è molto coerente: ad esempio la pagina Orari mezzi di trasporto regionali è stata realizzata usando i frame e sembra quasi non far parte del sito della regione Lombardia.