Le relazioni consultabili in questo sito riguardano i rapporti prodotti in seguito all'impiego di alcuni metodi di valutazione di accessibilità e usabilità di siti studiati durante il corso di Progettazione siti e Portali Web presso la facoltà di SS.MM.FF.NN. dell'Università degli Studi di Udine, anno accademico 2005/2006.
É possibile esaminare nell'apposita [sezione d'aiuto alla navigazione] le modalità previste per il supporto alla navigazione del presente sito.
Santelia Simone [simone.santa@hotmail.com] - Stocco Alessandro [stocco.alex@alice.it] - Vidoni Luca [lukes1582@hotmail.com]. Studenti del corso di Tecnologie Web e Multimediali presso la facoltà di SS.MM.FF.NN. di Udine
Per la valutazione sono stati utilizzati i browser Mozilla Firefox 1.5 ed Internet Explorer 6.0 su piattaforma Windows Xp e risoluzione dello schermo pari a 1024x768 punti.
Le valutazioni condotte si riferiscono all'analisi dei siti [regione Trentino Alto Adige] , [provincia di Udine] e [provincia di Trieste]
Oltre al classico menú visibile nella parte centrale della pagina sono stati implenentati alcuni access key :
Nelle pagine che contengono le varie relazioni possono apparire delle figure, questo è il loro significato:
La simulazione euristica effettuata sul sito della Provincia di Trieste si basa sull'utilizzo delle barriere proposte dal professor Giorgio Brajnik
Inizialmente abbiamo ipotizzato degli scenari d'uso, prendendo in esame alcuni ipotetici soggetti affetti da disabilità, come cechi, ipovedenti, daltonici, utenti con menomazioni fisiche e utenti utilizzatori di un browser testuale. Come secondo passo, abbiamo analizzato le possibili barriere che i diversi utenti presi i considerazione possono incontrare. Per ogni barriera incontrata sono stati assegnati dei livelli di gravità (visibili nella sezione sottostante) dipendenti dall'impatto che ha la barriera e dalla frequenza con cui questa si presenta.
Per l'analisi della simulazione euristica del sito della Regione Toscana sono state prese in considerazione le seguenti pagine, scegliendo tra quelle a nostro avviso più significative:
Nella determinazione del livello di gravità, occorre considerare l'impatto sull'utente e la frequenza con cui tale problema si manifesta. Qui di seguito proponiamo una possibile classificazione dei problemi che in seguito abbiamo impiegato nel rapporto.
Per determinare il livello di gravità di un difetto, come detto prima, è stato necessario considerare l'impatto sull'utente e la frequenza con cui il problema si manifesta. Per le due variabili, impatto e frequenza sono stati assegnati dei valori che oscillano da 1 a 3. Per quanto riguarda l'impatto, i valori verranno assegnati seguendo i seguenti criteri:
Per quanto riguarda la frequenza invece i valori possono essere:
Qua sotto viene evidenziato l'elenco dei rapporti sviluppati applicando le euristiche proposte dal prof. Giorgio Brajnik:
Marco è uno studente di lingue. Fin dalla nascita soffre di un problema grave agli occhi, più precisamente alle retine, che gli ha fatto parzialmente perdere la vista all'età di cinque anni. Marco per reperire i documenti e le informazioni a lui necessarie, per proseguire il suo percorso di studio, si serve di internet. Per navigare sul web Marco deve per forza di cose utilizzare un browser vocale come può essere Home Page Rader.
Franco ha 52 anni, è miope, lavora in un'azienda di Import/Export di Milano. Durante l'orario di lavoro si occupa principalmente di contattare via e-mail potenziali acquirenti ed effettuare una sorta di pubbliche relazioni in modalità telematica (quindi utilizzo di servizi di e-mail, Instant Messaging, ecc. ecc.). Nonostante le forti lenti che utilizza, il continuo sforzo di attenzione gli causa notevoli difficoltà nella lettura di informazioni sul monitor, di conseguenza si deve avvalere dell'aiuto di un ingranditore di schermo.
Alberto ha 32 anni e lavora come impiegato in uno studio legale. Un paio di giorni fa, un incidente in moto gli ha causato la frattura di tre dita, del polso e la lussazione della spalla, tutti e 3 dal lato destro. Ora ha molta difficoltà nel suo lavoro perchè il gesso applicatogli all'intero arto superiore non gli permette più di svolgere i suoi compiti davanti all'elaboratore in maniera efficiente, soprattutto quando deve fare largo uso di mouse e tastiera.
Massimo ha 28 anni, disoccupato, ha dovuto sostenere la visita medica per il conseguimento della patente di guida di tipo C, al fine di poter esercitare la professione di camionista. Il responso della visita però ha riscontrato in lui una forma piuttosto acuta di daltonismo. Non riesce a percepire i colori verde e rosso.
Un utente cieco di un lettore di schermo che non capisce cosa significa la frase "uguale uguale parentesi angolare destra" pronunciata da un lettore di schermo a fronte del testo ==> trovato sulla pagina.
Utente daltonico che è incapace di capire la differenza tra due elementi informativi che si differenziano solo dal colore (e.g. due righe di una tabella che riporta le quotazioni di azioni di borsa).
Utente ipovedente che non riesce a distinguere chiaramente le informazioni in primo piano dallo sfondo (perchè quest'ultimo è un'immagine o perchè il contrasto cromatico o luminoso tra i due componenti non è sufficiente).
L'utente non vedente che utilizza una vecchia versione del lettore di schermo (es. Jaws 3.5) non riesce ad accedere al contenuto dei frame (se presenti nella pagina).
Un utente non vedente di un lettore di schermo che non percepisce le informazioni presenti in un diagramma, istogramma, foto, organigramma. La causa è la mancanza di un'appropriato testo collegato all'immagine (alt, longdesc, D-link, testo adiacente all'immagine).
Utente ipovedente di un ingranditore di schermo che non vede l'immagine (diagramma, istogramma, foto, organigramma) perchè plausibilmente posizionata al di fuori del campo visivo. La causa è il cattivo posizionamento dell'immagine, senza nessun indizio che faccia capire la sua presenza.
Talvolta immagini vengono incluse nello sfondo della pagina mediante proprietà CSS. In tali casi non è possibile specificare testo alternativo, e lettori di schermo o browser vocali non permettono all'utente nemmeno di percepire la presenza di tale immagine.
Titoli lampeggianti o oggetti in movimento possono non essere percepiti da utenti con problemi visivi (diversi da ipovedenti).
Utente sordo che non percepisce la narrazione a voce in un file multimediale. La causa è l'assenza di sottotitoli, didascalie o di una trascrizione completa.
Utente sordo che non percepisce la narrazione a voce in un file multimediale mentre il video scorre. La causa in questo caso può essere anche data dalla mancanza di appropriata sincronizzazione tra audio-video e trascrizioni testuali (sottotitoli, didascalie).
Un utente cieco di un lettore di schermo che non comprende cosa significa la frase "bi e enne vi e enne u ti i" pronunciata dal lettore di schermo a fronte di un titolo nella pagina "B E N V E N U T I" formattato con spazi artificiali tra le lettere.
Contenuti che vengono aggiornati automaticamente e modificano ogni volta il focus del lettore di schermo; questo rende difficile la navigazione di un utente non vedente che non riesce a raggiungere il contenuto che gli interessa (in quanto è obbligato a sentire sempre le stesse informazioni).
Similmente per form che usano JavaScript per calcolare dei valori di campi nascosti (ad es. per comunicare determinate informazioni di servizio al server, o per pseudo-sicurezza).
Eventi JavaScript che si attivano solo tramite gestori di eventi dipendenti esclusivamente dal mouse. Un utente ipovedente di un ingranditore di schermo non potrà attivare dei menù a cascata: non appena scorre sul menù del primo livello e sceglie una voce che apre un menù di scondo livello, e deve scorrere verso destra lo schermo, il secondo menù scompare.
Similmente per un disabile motorio che non è in grado di controllare finemente i movimenti del mouse.
Finestre pop-up che fanno sí che un utente ipovedente di un ingranditore di schermo non riconosca che la scroll bar che vede sia quella della finestra nello sfondo. Quando ci clicca sopra (con l'intenzione di scorrere il contenuto della finestra pop-up in primo piano), ottiene come risultato lo scambio delle due finestre e quella di pop-up, che l'utente stava esaminando, passa dietro, senza permettergli di capire cosa sia successo.
Form strutturate su una vasta area dello schermo possono creare problemi a utenti ipovedenti che non riescono a comprendere la struttura nella sua interezza.
Form in cui alcuni dei campi/controlli sono automaticamente modificati da programma (via JavaScript). Ciò non permette ad un utente di un browser privo di interprete JavaScript di usare la form.
Controlli di una form privi di associazione con le loro etichette (i.e. mancanza di label/for), che fanno sí che un utente cieco di un lettore di schermo non capisca come usare alcuni dei controlli (e.g. perchè tutte le etichette vengono lette una dopo l'altra e poi segue la lettura di tutti i controlli, uno dopo l'altro -- nel caso di una form impaginata con una tabella il cui contenuto non si linearizza correttamente).
Immagini funzionali (e.g. pulsanti) prive di ALT che non permettono ad un utente cieco di un lettore di schermo di sapere che link attivare. Analogamente per pulsanti Flash.
Finestre pop-up che rallentano un utente con difficoltà motorie (perchè deve muovere il mouse sul pulsante, piccolo, di chiusura della finestra in alto a destra, nella barra del titolo). Ancora peggio se tali finestre si aprono ogni volta che si ritorna alla home page.
Link con diversa destinazione che hanno la stessa etichetta (e.g. ripetizioni di link "Buy" per vari prodotti) che non permettono ad un utente cieco di un lettore di schermo di selezionare il link corretto quando viene usata la funzione link list.
Link con etichette non informative (e.g. "clicca qui") che non permettono ad un utente cieco di un lettore di schermo di selezionare il link corretto quando viene usata la funzione link list.
Rollover che aggiungono menù alla pagina. Essi non permettono ad un utente ipovedente di un ingranditore di schermo di percepire la modifica al documento (perchè presumibilmente fuori dal suo campo visivo) e quindi di utilizzare i comandi del menù.
Finestre pop-up che fanno sí che un utente cieco di un lettore di schermo non capisca che il contesto è cambiato, modificando sia il contenuto che viene letto sia i possibili comandi immettibili.
Rollover che aggiungono menù alla pagina. Essi non permettono ad un utente di un browser privo di interprete JavaScript (e.g. perchè JavaScript è stato disabilitato per motivi di sicurezza, o perchè si tratta di un micro-browser di palmare) di vedere il menù e quindi di attivarne i comandi.
Form o comportamento del server tali per cui un utente che ci mette più tempo del previsto per svolgere una determinata azione (ad es. consultare una pagina e successivamente premere un pulsante "accetto") si trova nella situazione di non poter procedere perchè il sistema ha cambiato stato di propria iniziativa.
Form in cui i valori immessi vengono validati esclusivamente dal browser (via JavaScript). Ciò può causare molto più facilmente delle immissioni di dati errati da parte dell'utente di un browser privo di interprete JavaScript.
Talora è possibile vedere pagine web che usano immagini per presentare titoli di sezioni della pagina. Un utente di un lettore di schermo non potrà capire quel titolo a meno che l'immagine non sia corredata di testo alternativo nell'attributo ALT.
Utente ipovedente non potrà ingrandire il testo del titolo che è codificato come un'immagine (quindi rappresentato come dei pixel); egli dovrà per forza usare un ingranditore di schermo per poterla ingrandire, con la conseguenza di ridurre il suo campo visivo, e quindi l'efficacia e l'efficienza con cui usa il sito web.
In un sito privo dell'attributo lang, che specifica la lingua in cui il testo a scritto, un lettore di schermo utilizzato da utenti non vedenti non è in grado di risalire alla lingua a cui appartengono le parole incontrate, e quindi non sarà in grado di leggerle in modo corretto. Anche se il lettore è impostato per la lingua italiana, se incontra una parola straniera priva di attributi che ne specifichino la lingua, non la legge correttamente.
Tabelle dati (e.g. orari di autobus) non codificate appropriatamente (con TH, scope, headers) che non permettono ad un utente cieco di un lettore di schermo di navigare tra le celle delle tabelle in modo che gli venga ricordato il significato di ciascuna cella (leggendo anche le intestazioni della cella).
Tabelle di impaginazione (gabbie grafiche) le quali, una volta che vengano linearizzate (cioè sostituite dal loro contenuto, togliendo la struttura a tabella, e procedendo dall'alto verso il basso, e da sinistra verso destra -- per noi occidentali), producono un ordine degli elementi che non è quello logico, e che quindi confonde l'utente di un lettore di schermo.
Pagine prive di titolo (o con titolo non informativo, come "Untitled document"), che fanno sí che utenti ciechi di lettori di schermo non capiscano su che pagina sono arrivati.
Frame privi di un nome coerente con il loro contenuto fa sì che utenti non vedenti che utilizzano un lettore di schermo possano essere disorientati.
Pagine contenenti molto materiale, magari eterogeneo (come ad es. barre di navigazione, indici, news, ...) e prive di una loro suddivisione esplicita in gruppi usando i marcatori H2, fieldset, ... rendono complessa la loro consultazione. Un utente di un lettore di schermo potrebbe non rendersi conto di essere in una sezione non interessante. Questo è particolarmente grave quando l'utente esplora la pagina per cercare una determinata informazione.
Mancanza di tasti rapidi (access key) che fanno sí che disabili motori non possano attivare certi link in maniera rapida e sicura.
Le finestre che vengono aperte dal browser (non per iniziativa dell'utente) e che sono prive degli usuali controlli, come il tasto "indietro", "ricarica", "home", barra dell'URL, rende più difficile e faticosa la ricerca del link "indietro" da parte di un utente di ingranditore di schermo, il quale si trova costretto ad esplorare tutta la finestra per trovarlo.
Layout della pagina non ridimensionabile, che non permette ad un utente ipovedente di un ingranditore di schermo di incrementare la dimensione della finestra o del testo senza scompaginare l'impaginazione in maniera tale da comprometterne la comprensione.
Mancanza di skip links nascosti che fanno sí che utenti non vedenti di lettori di schermo non possano velocemente saltare il materiale preliminare di una pagina.
Troppi link nella pagina, che fanno sí che utenti ipovedenti di un ingranditore di schermo impieghino tanto tempo e fatica a trovare il link che cercano.
Testo che non è ridimensionabile, che non permette ad un utente ipovedente di usare la pagina anche senza ingranditore di schermo.
La versione testuale del sito non aggiornata e non contenente tutte le informazioni disponibili nella versione grafica può portare gli utenti che, per vari motivi hanno deciso di utilizzarla, a credere che il sito sia carente di contenuto.
Praticamente tutte le immagini contengono l’attributo Alt, ad eccezione di due che non possiedono tale attributo. Tali immagini sono visionabili alla pagina Consiglio Provinciale (immagine della giunta) e nella Home Page (La "P" che rappresenta i nuovi sportelli).
Nelle pagine analizzate abbiamo trovato frequentemente dei link generici. Ad esempio nella Home Page e nella pagina Scuole, è presente un link con etichetta segue ben poco esplicativo.
Nelle pagine analizzate abbiamo trovato tre link con la medesima etichetta nella pagina Bandi e Concorsi in scadenza. L'etichetta in questione è: bando integrale ed i link portano a documenti Pdf differenti.
Esiste un'unica finestra pop-up vera e propria che viene presentata solo nella Home Page. Tuttavia esistono dei link che, una volta cliccati, aprono in un'altra finestra la pagina web richiesta senza preavviso all'utente. La frequenza è maggiore dato che si ripresentano in ogni pagina analizzata. Nella Home Page inoltre, nel menù a destra, tutte le immagini presenti sono cliccabili e portano a pagine esterne.
Nei due form analizzati, i controlli delle form sono privi di etichette associate tramite tag label (accompagnato dall’attributo for). Tuttavia la lettura e l’utilizzo delle form risulta sufficientemente efficace anche per utenti utilizzatori di browser vocale.
Praticamente tutte le pagina analizzate fanno uso di tabelle di impaginazione. Una volta linearizzate un utente con il lettore di schermo non ha grossi problemi nella lettura dei contenuti in modo logico. Un leggero senso di confusione può essere riscontrato nella pagina Albo Pretorio leggendo la parte centrale che, tutto sommato risulta di non facile comprensione.
Tutte le pagine presentano come titolo Provincia Di Trieste. Questo è un errore, in quanto non vi è alcuna differenza tra le diverse pagine e l'utente che utilizza il lettore di schermo non capisce dove effettivamente si trova.
All'interno delle pagine analizzate ci sono pochissime parole che non sono in italiano. Quelle poche parole, come ad esempio news, copyright ecc.. sono di uso comune anche nella nostra lingua.
Le pagine analizzate non fanno uso di intestazioni per separare varie sezioni della pagina. Al posto delle intestazioni spesso vengono utilizzate regole css per variare dimensione, colore e sfondo delle parole usate come titoli di intestazioni (color pollution). Ciò non porta ad alcun beneficio ad un utente che utilizza un lettore di schermo il quale non è in grado di distinguere le varie parti della pagina.
Gli skip-links non vengono utilizzati all'interno delle pagine. Così facendo, un utente che ricerca delle informazioni è costretto a scorrere tutta la pagina per cercare i contenuti che gli servono.
All'interno delle pagine analizzate ci sono alcune immagini ricche, come nella pagina Comuni, dove le mappe geografiche, con l'utilizzo di un ingranditore di schermo come ZoomText 9, si trovano posizionate leggermente fuori campo principale. Tuttavia questo problema ha un impatto basso perchè è presente in solo una pagina.
Nella Home Page ci sono almeno 2 esempi di contrasto non sufficiente, in particolare nelle scritte rosa e verdi. Questo è un impatto di grado medio, ma lo ritroviamo solo nella pagina citata. Riportiamo qui sotto l'immagine dove secondo noi possiamo riscontrare il problema
Anche in questo caso ci sono due pagine che contengono due form, quella dell'Albo Pretorio e Comunicati Stampa. I form in questione sono banali, ma con un ingranditore di schermo purtroppo non si riescono a visualizzare nella loro totalità.
Le quasi tutte le pagine esaminate contengono troppi link ed un utente ipovedente è costretto a fare troppo scrolling verticale ed orizzontale impiegando così troppo tempo per cercare un link. In particolare lo si può notare nelle pagine Servizi, Regolamenti e Scuole.
Il testo all’interno delle pagine analizzate non può essere ridimensionato. Risulta quindi inutilizzabile da utenti ipovedenti. Utilizzando il browser Firefox il testo può essere ridimensionato tramite l'apposita funzione presente in esso, permettendo così il non utilizzo del lettore di schermo.
Esiste un'unica finestra pop-up vera e propria che viene presentata solo nella Home Page, ma non contiene nessuna informazione particolarmente importante. Tuttavia esistono dei link che, una volta cliccati, aprono in un'altra finestra la pagina web richiesta senza preavviso all'utente. La frequenza è maggiore dato che si ripresentano in ogni pagina analizzata. Nella Home Page inoltre, nel menù a destra, tutte le immagini presenti sono cliccabili e portano a pagine esterne.
In tutte le pagine prese in esame non vi sono gli access key, tasti che permettono di velocizzare la navigazione all'interno delle pagine web. La mancanza di questi strumenti rendono più lenta e difficoltosa la navigazione agli utenti con disabilità motorie.
Le pagine analizzate non creano molti problemi di visualizzazione ad utenti daltonici, infatti, quasi sempre è possibile fruire di tutte le informazioni. Solo all’interno della Home Page sono state riscontrate delle scritte scarsamente visibili ad utenti portatori di daltonismo. Nelle immagini qui sotto riportate si possono notare ad esempio le scritte in violetto e marroncino scarsamente visibili.
In questo sito abbiamo riscontrato una notevole quantità di infrazioni delle barriere dell'utilizzazione, della comprensione, e, anche se in minor quantità, anche di quelle della percezione e del controllo da parte degli utenti.
I problemi riscontrati più gravi sono i seguenti:
Concludendo, possiamo dire che il sito da noi analizzato presenta dei problemi notevoli e la simulazione euristica ha dato risultati in questo senso. Secondo quest'analisi gli utenti maggiormente svantaggiati nell'utilizzo di questo sito sono i non vedenti e gli ipovedenti. Per quelli portatori di handicap motori e daltonismo diciamo che è più semplice (se semplice possiamo definire) reperire informazioni su questo sito e più in generale navigare al suo interno.
