Sei in:

Relazione sulla simulazione euristica di www.provincia.gorizia.it

  1. Introduzione

    Relazione sulla simulazione euristica per la verifica dell'accessibilità del sito: www.provincia.gorizia.it , di Lorenzo Marussi (lorenzo@auroracomputers.it) e Vincenzo Villano (vincvil@libero.it). Il 3 Aprile 2006.

    Il metodo utilizzato in questa relazione è usato per verificare l'accessibilità di un determinato sito internet: si analizzano delle pagine scelte e si valuta quali ostacoli si frappongono nell'attività di un utente disabile.
    La tecnica utilizzata per tale scopo è quella di determinare una tipologia di soggetti e ipotizzare uno scenario d'uso, ovvero una situazione verosimile di utilizzo dello strumento web. Si individuano le possibili barriere che, in generale, tale utente disabile può incontrare e si valuta la presenza o meno di questo ostacolo nel sito analizzato. Per ognuna di essa vengono assegnati due valori numerici, dove la scala comune varia da 1 a 3: impatto e una frequenza. Il primo valore indica la gravità del problema: quanto viene pregiudicata la navigazione dell'utente diversamente abile (3 indica maggiore gravità) e la frequenza indica quante volte tale problema si presenta.
    La relazione dei due valori dà luogo ad un unico indice di gravità.


    Link all'inizio della pagina.

  2. Scenari d'uso ipotizzati

    Il primo scenario di utilizzo preso in considerazione è il seguente:
    Il soggetto è un utente non vedente che accede al sito della provincia di gorizia alla ricerca di concorsi pubblici per lavoro. Saltuariamente, per problemi logistici, accede al sito anche per cercare modulistica dal pc di casa. Utilizza un sistema operativo Windows XP, Internet Explorer 6.0 ed ha aquistato JAWS 7.0 per lettura dei caratteri a schermo. Nel tempo, ha sviluppato una media conoscenza dell'uso del pc: la prima cosa che fa quando accede ai siti di pubblica amministazione è quella di cercare una sezione più accessibile dedicata agli utenti svantaggiati.

    Il secondo soggetto lavora come dipendente pubblico nel comune in provincia di Gorizia di Gradisca d'Isonzo. E' non udente dalla nascita. E' particolarmente attivo nella vita politica della provincia e si connette regolarmente al sito per leggere le news e mantenersi aggiornato. Di solito usa nei momenti di pausa il suo portatile dotato si sistema operativo Windows XP e browser Internet Explorer 6.0, sia al lavoro che a casa.

    Le pagine analizzate in comune sono le seguenti:


    Link all'inizio della pagina.

  3. Descrizione delle barriere

    Primo utente non vedente:

    Utente non vedente
    1. Immagini ricche senza testo alternativo:
      Un immagine che nel sito è vettore di informazione importante per la sua comprensibilità, non ha una valido testo alternativo equivalente, perciò l'utente di JAWS perde il suo contenuto.

    2. Mancanza di didascalie del video:
      Un video o contenuto multimediale che nel sito è vettore di informazione importante per la sua comprensibilità, non ha una valido testo alternativo equivalente, perciò l'utente di JAWS perde il suo contenuto.

    3. Colore essenziale:
      Se nel sito il colore è usato per distinguere informazioni diverse, l'utente JAWS non può percepire questa differenza.

    4. Frame inaccessibili:
      Utenti di vecchie versioni di lettori di schermo (es. JAWS 3.5) non possono accedere ai singoli frame.

    5. Materiale in movimento:
      L'utente potrebbe non percepire (perché il lettore di schermo non glielo segnala) che l'immagine è cambiata o che il testo è cambiato da quando l'ha sentito l'ultima volta.

    6. Immagini funzionali in sfondo:
      L'utente non ha modo di percepire il contenuto associato all'immagine, specialmente se questa contiene del testo. Infatti non è possibile usare le normali tecniche per associare all'immagine del testo equivalente. L'unica associazione è data dalla sovrapposizione grafica.

    7. Immagini funzionali prive di testo:
      Se un link o un pulsante è contraddistinto unicamente da un immagine senza un testo alternativo valido, l'utente JAWS non riesce a utilizzare correttamente questa funzione importante.

    8. Link generici:
      Se il link è proposto con etichette poco informative, l'utente JAWS non comprende a pieno lo scopo del link e la destinazione.

    9. Link ambigui:
      Se più link vengono proposti con la stessa etichetta, o etichette simili, l'utente JAWS non riesce a comprendere la differenza tra essi.

    10. Menu dinamici in javascript:
      Se il menu compare solamente con il focus del mouse, alll'utente JAWS questo menu risulta inutilizzabile.

    11. Eventi mouse
      effetti (comparsa di menu, comparsa di nuovi elementi ,...) attivati da codice javascript solo su eventi del mouse vengono ignorati dall'utente JAWS. Se questi sono importanti per la comprensibilità del sito stesso, verranno persi.

    12. ASCII art
      simboli come "==>" oppure uno smiley ;-) o linee orizzontali come "-----------------" vengono letti come simboli singoli, e l'utente JAWS ne risulta disorientato.

    13. Titoli spaziati
      La pagina contiene delle parole o termini spaziati , e il lettore JAWS legge ogni singola lettera e spazio, ad es. "B E N V E N U T I" , e l'utente ne risulta disorientato, fa difficoltà a capirne il significato.

    14. Troppi link
      Se sono presenti tanti links, e non ragruppati, gli utenti devono ascoltare tutti i link prima di decidere se continuare e poter scegliere quello più rilevante per loro, rendendo difficile la memorizzazione degli stessi.

    15. Form con redirect
      se la pagina contiene delle form in cui alcuni controlli, una volta che vengono utilizzati, causano un submit al server il quale spedisce una nuova pagina al browser, l'utente JAWS viene interrrotto e il focus, dopo una interruzione, viene riproposto all'inizio della pagina, apparentemente senza motivo.

    16. Link non separati
      La pagina contiene delle sequenze di link non separati tra loro da caratteri pronunciabili, e l'utente JAWS ha delle difficoltà nel capire dove uno finisce e l'altro inizia.

    17. Nuove finestre
      Se la pagina contiene codice che causa l'apertura di nuove finestre, l'utente può non accorgersi che, cambiando il contesto di interazione, è cambiato sia il contenuto anche l'insieme di comandi possibili.

    18. Form senza label
      Se la form è impaginata in maniera complessa, allora il lettore di schermo non legge proprio il testo dell'etichetta prima di presentare all'utente la possibilità di agire sul controllo.

    19. Temporizzazioni troppo brevi
      Se Il comportamento del server è di causare un refresh della pagina, e l'utente JAWS impiega troppo tempo per la visualizzazione dell'intero contenuto, una parte della pagina non potrà mai essere letta
    20. Tabelle dati
      Se le tabelle presenti non sono formattate correttamente, allora l'utente non può navigare tra le celle della tabella in modo che gli venga ricordato il significato di ciascuna cella.

    21. Tabelle di impaginazione
      Se la pagina viene impaginata con tabelle di layout che si linearizzano male , l'utente non capisce come le informazioni o i link sono disposti nella pagina.

    22. Pagine senza titoli
      I titoli, essendo la prima cosa letta da un utente JAWS, sono importanti per la comprensione del contesto. Se essi sono ambigui, o ancor peggio fuorvianti, l'utente può essere confuso.

    23. Frame senza titolo
      Se la pagina è basata su frame, e mancano alcuni attributi, L'utente potrà accedere alla pagina solamente un frame alla volta, e sarà costretto a scegliere quale frame visitare.

    24. Marcatura della lingua
      se non viene specificata la lingua corretta, il lettore JAWS interpreterà le parole in maniera scorretta, utilizzando sempre la lingua preselezionata.

    25. Suddivisione in sezioni
      Se la pagina è correttamente suddivisa in sezioni, allora l'utente otteniene velocemente una panoramica del contenuto della pagina e di poter scegliere la parte da esaminare con attenzione.

    26. Immagini come titoli
      se vengono utilizzate immagini come titoli, senza un corrispettivo testo alternativo esauriente, l'utente JAWS non riesce ad apprezzare la suddivisione in categorie.

    27. Mancanza di tasti rapidi
      L'utente, che usa solo la tastiera, non può muoversi velocemente nella pagina da controllo a controllo. Deve sempre usare il tasto TAB e muoversi sequenzialmente.

    28. Skip links
      Se La pagina non permette di saltare direttamente al contenuto , 'utente è costretto, nella navigazione all'interno del sito, a sentirsi leggere più e più volte il materiale preliminare, prima di arrivare al nocciolo della pagina.

    29. Pagina solo testo
      L'utente si rifiuta di usare la pagina solo testo impoverita rispetto a quella normale; la vede come un modo per dire ai disabili "entrate dal garage perché siete diversi dagli altri".

    30. Controlli del browser disabilitati
      Se La pagina è stata aperta in una nuova finestra del browser dove i controlli tipici del browser non ci sono (back, next, refresh, ecc), 'utente è costretto a percorrere in lungo e in largo la pagina per trovare un link che gli/le permetta di tornare indietro o di rileggere l'URL della pagina.

    Secondo soggetto non udente:

    Utente non udente
    1. Mancanza di didascalie del videoUn video o contenuto multimediale che nel sito è vettore di informazione importante per la sua comprensibilità, non ha una valido testo alternativo equivalente, perciò l'utente di JAWS perde il suo contenuto.

    2. Manca sincronizzazioneUn file multimediale, sia video che audio, non contiene né è associato a testo equivalente sincronizzato alle scene video.


    Link all'inizio della pagina.

  4. Analisi dettagliata

    Si proceda all'analisi delle barriere:

    1. Immagini ricche senza testo alternativo: barriera superata.

      E' presente un unica immagine che è veicolo di informazione oltre ad avere anche uno scopo decorativo. Questa è sostuita da un testo esauriente quando viene usato un browser che utilizza il testo alternativo (attributo ALT) invece di renderizzare l'immagine a video.

      Visualizza il testo alternativo utilizzato nell'immagine presente nell'home page

      Si noti nell'immagine che il testo alternativo è esauriente.
      Il concetto viene ripreso nuovamente nella colonna centrale.


      Link all'inizio della pagina.

    2. Mancanza di didascalie del video: barriera superata.

      Nel sito internet non è presente alcun video.


      Link all'inizio della pagina.

    3. Colore essenziale: barriera superata.

      Il colore non porta mai significato a se stante, i concetti vengono espressi univocamente con delle scritte.


      Link all'inizio della pagina.

    4. Frame inacessibili: barriera superata.

      Nel sito non sono presenti frame, tutte le sottosezioni sono state create mediante tags <div>.


      Link all'inizio della pagina.

    5. Materiale in movimento: barriera superata.

      Nel sito non sono presenti contenuti che variano nel tempo.


      Link all'inizio della pagina.

    6. Immagini funzionali in sfondo: barriera superata.

      Non ci sono immagini di sfondo. Sono presenti solamente alcuni colori di sfondo, ma che non assumono in nessun modo alcun ruolo funzionale.


      Link all'inizio della pagina.

    7. Immagini funzionali prive di testo: barriera non superata.

      Istituzione, territorio, comunicazioni, aree tematiche non hanno un attributo "alt", per cui con jaws viene letto tutto il percorso dell'immagine.

      Visualizza l'attributo errato della sezione siti tematici

      Alcuni attributi sono errati: come si nota nell'immagine soprastante l'attributo di “siti tematici” è “territorio”,

      Visualizza l'attributo del logo della provincia di gorizia

      e in quest'altra immagine si nota che il testo alternativo del logo della provincia di gorizia è davvero lungo e poco significativo.
      Altri attributi errati si notano nel logo della provincia di gorizia dell'home page accessibile: è l'unico modo di ritornare alla home ed ha un attributo alt pari a “logo società”.

      Visualizza l'attributo mancante per l'immagine scaduto

      Si nota che l'immagine “scaduto” è funzionale: infatti è l'unico modo per comprendere che il concorso a cui fa riferimento è scaduto, ma non possiede alcun attributo alt.
      Ancora si può notare che l'attrubuto "alt" delle cartelle è “+”, mentre quello dell'immagine del documento è “doc”. Queste due immagini non sono funzionali, però in questo modo sono ambigue, possono trarre in inganno: usualmente il “+” porta un significato, e in questo caso non centra nulla.

      Correzione proposta

      La soluzione è quella di procedere sistematicamente all'analisi di ogni immagine del sito e visualizzarne il testo alternativo. Se esso non è chiaro o mancante deve essere corretto.


      Link all'inizio della pagina.

    8. Link generici: barriera non superata.

      Visualizza il link generico vai nell'home page accessibile

      Il link "vai", che compare nell'intero sito, non è particolarmente esplicativo della funzione di ricerca.

      Visualizza il link generico vai e ok nell'home page

      Oltre al già citato link "vai", anche il link "ok" che compare in fondo pagina può trarre in inganno: il suo compito è quello di confermare e di avvisare di un invio dati.

      Correzione proposta

      La soluzione è quella di sostituire "vai" con "cerca" e "ok" con "conferma invio dati"


      Link all'inizio della pagina.

    9. Link ambigui: barriera non superata.

      Di seguito vengono proposte delle immagini che descrivono la presenza nel sito internet in esame di alcuni link ambigui, che presi al di fuori dal loro contesto perdono il loro significato.

      Visualizza il link ambiguo leggi

      Il link ambiguo "leggi>" si ripete numerose volte.

      Visualizza il link ambiguo leggi la notizia

      Il link ambiguo "leggi la notizia>" si ripete numerose volte.

      Visualizza il link ambiguo leggi

      Il link ambiguo "leggi>" si ripete numerose volte.

      Correzione proposta

      E' consigliabile inserire accanto a "leggi" anche un riferimento alla notizia in questione. In questo modo i link saranno significativi anche al di fuori dal loro contesto originale e non ci saranno link uguali nella stessa pagina.


      Link all'inizio della pagina.

    10. Menu in javascript: barriera superata.

      Nel sito non sono presenti menu che fanno uso di tecnologia Javascript


      Link all'inizio della pagina.

    11. Eventi mouse: barriera non superata.

      Nell home page del sito, con Javascript attivo, selezionando una voce nel menu a tendina "scrivi a:" viene aperta una finestra di Outlook con l'indirizzo mail scelto, mentre disattivando Javascript tale azione non si verifica, rendendo impossibile l'utilizzo di tale funzione. Discorso analogo con il bottone "cerca": risulta che solamente con Javascript attivo si possono eseguire delle ricerche all'interno del sito.

      Correzione proposta

      Predisporre delle alternative quando i browser degli utenti non hanno Javascript abilitato. Inoltre si può notare che in queste due casi presi in considerazione si potrebbe facilmente fare a meno di Javascript.


      Link all'inizio della pagina.

    12. ASCII art: barriera non superata.

      Visualizza l'ascii art nei link leggi

      Visualizza l'ascii art nei link leggi

      Nelle due immagini proposte si nota l'utilizzo di ASCII art nei link "leggi la notizia" e simili. L'ASCII art viene usato pesantemente in tutte queste situazioni.

      Correzione proposta

      Si possono eliminare mantenendo comunque intatto il messaggio originale.


      Link all'inizio della pagina.

    13. Titoli spaziati: barriera superata.

      Nel sito non sono presenti titoli spaziati.


      Link all'inizio della pagina.

    14. Troppi link: barriera non superata.

      Visualizza i link eccessivi

      Nell'immagine che fa riferimento al menu laterale sinistro della sezione accessibile del sito della provincia, si può notare la presenza di numerosi links non raggruppati. L'utente JAWS è costretto all'ascolto di numerosi links rendendo la navigazione poco piacevole.

      Correzione proposta

      Raggruppare diversi link per temi in sezioni eliminerebbe il problema.


      Link all'inizio della pagina.

    15. Form con redirect: barriera non superata.

      Visualizza form con redirect

      Nell'immagine viene proposto il form con redirect per la selezione della lingua. Questo form è attualmente inutile, visto che esiste un unica scelta possibile.

      Visualizza form con redirect nell'home page

      Selezionando una voce in "Scrivi a" viene aperta una finestra di Outlook, visto che si fa riferimento ad un indirizzo email. Questa scelta comunque si può considerare accettabile, avviene in maniera istantanea ed è un evento aspettato.

      Correzione proposta

      Il form che causa il problema può attualmente essere eliminato, visto che non ha utilità.


      Link all'inizio della pagina.

    16. Link non separati: barriera superata.

      Nelle prove effettuate con il software Jaws versione 7.0 i link vengono tutti pronunciati separatamente.


      Link all'inizio della pagina.

    17. Nuove finestre: barriera non superata.

      Nell'home page selezionando "versione accessibile" si apre una nuova pagina.

      Visualizza form con redirect nell'home page

      Selezionando una voce in "Scrivi a" viene aperta una finestra di Outlook, visto che si fa riferimento ad un indirizzo email. Questa scelta comunque si può considerare accetabile, avviene in maniera istantanea ed è un evento aspettato.

      Correzione proposta

      Togliere l'attributo target="_blank" nel link dell'home page preso in esame. Ciò evita l'apertura della pagina in una nuova finestra del browser.


      Link all'inizio della pagina.

    18. Form senza label: barriera non superata.

      Nela home page in "cerca" non c'è l'attributo label, mentre nella Home page accessibile, sempre in "cerca" c'è il tag label

      Correzione proposta

      Inserire il tag corretto nel link preso in esame dell'home page.


      Link all'inizio della pagina.

    19. Temporizzazioni troppo brevi: barriera superata.

      Non è presente alcuna temporizzazione.


      Link all'inizio della pagina.

    20. Tabella dati: barriera superata.

      Non sono presenti tabelle dati.


      Link all'inizio della pagina.

    21. Tabella di ipaginazione: barriera superata.

      Non sono presenti tabelle di impaginazione.


      Link all'inizio della pagina.

    22. Pagine senza titoli: barriera non superata.

      Tutte le pagine del sito hanno dei titoli, ma questi raramente hanno significato e inoltre presentano delle decorazioni ASCII inutili che rendono maggiormente difficoltosa la lettura con software come JAWS.

      Correzione proposta

      Procedere sistematicamente alla modifica dei titoli di tutte le pagine.


      Link all'inizio della pagina.

    23. Frame senza titolo: barriera superata.

      Non sono presenti frame.


      Link all'inizio della pagina.

    24. Marcatura della lingua: barriera non superata.

      Mancano le indicazioni sulla lingua utilizzata, tutte le parole straniere vengono lette come lettere separate. Esempio sono la parola "link", "admin" o "servizi on-line" che vengono letti "l-i-n-k", "a-d-m-i-n" o "servizi online"

      Correzione proposta

      Marcare con adeguati tag le parole straniere. In questo modo il lettore può utilizzare il dizionario appropriato per queste.


      Link all'inizio della pagina.

    25. Suddivisione in sezioni: barriera non superata.

      In tutte le pagine mancano i tag H1-...-H6, non c'è una corretta suddivisione.

      Correzione proposta

      Per ogni tipo di contenuto aggiungere un tag H1-H6, rispettando l'ordine.


      Link all'inizio della pagina.

    26. Immagini come titoli: barriera non superata.

      Visualizza le sezioni dell'home page

      Si nota che "isituzione", "territorio", "comunicazioni", "aree tematiche" sono titoli di sezione senza testo alternativo, "siti tematici" è sbagliato, ha "territorio" come attributo "alt". L'unico corretto è "serivizi online" e i titoli in alto alla pagina

      Correzione proposta

      Si devono aggiungere dei attributi "alt" alle immagini, oppure sostituire le immagini con un testo equivalente.


      Link all'inizio della pagina.

    27. Mancanza di tasti rapidi: barriera non superata.

      Non esiste nessun attributo "acceskey" ne nell'home page ne nella sezione accessibile.

      Correzione proposta

      Per i link,pulsanti e controlli che sono ricorrenti nelle pagine del sito e per le parti funzionali aggiungere l'attributo @ACCESSKEY, e allestire una pagina di aiuto dove questi comandi vengono riassunti.


      Link all'inizio della pagina.

    28. Skip links: barriera non superata.

      COn il software da noi utilizzato (JAWS 7.0) viene letta prima tutta l'intestazione, poi tutto il lungo menu e alla fine il vero e proprio contenuto della pagina. Questa situazione è comune in tutte le pagine del sito.

      Correzione proposta

      Aggiungere, subito dopo il logo, un link che permetta di saltare al corpo della pagina.


      Link all'inizio della pagina.

    29. Pagina solo testo: barriera superata.

      Visualizza link alla sezione accessibile

      Nella home page c'è un chiaro collegamento alla "sezione accessibile" del sito, che contiene gli stessi contenuti con solo testo.


      Link all'inizio della pagina.

    30. Controlli del browser disabilitati: barriera superata.

      Tutti i controlli standard del browser sono sempre disponibili.


      Link all'inizio della pagina.

    31. Mancanza di sincronizzazione del video: barriera superata.

      Nel sito internet non è presente alcun video.


      Link all'inizio della pagina.

  5. Conclusioni

    Tabella delle barriere riscontrate per l'utente non vedente:

    Num. Nome Impatto Frequenza Gravità
    7Immagini funzionali prive di testo33Critico
    8Link generici21Serio
    9Link ambigui23Critico
    11Eventi mouse32Critico
    12ASCII art13Serio
    14Troppi link23Critico
    15Form con redirect11Minore
    17Nuove finestre11Minore
    18Form senza label21Serio
    22Pagine senza titoli23Serio
    24Marcatura della lingua12Minore
    25Suddivisione in sezioni13Serio
    26Immagini come titoli22Serio
    27Mancanza di tasti rapidi13Serio
    28Skip links23Critico

    Per l'utente non udente non sono state riscontate barriere nell'utilizzo del sito.

    Il sito è stato sviluppato tenendo presente le esigenze delle persone generalmente disabili: infatti presenta un link nella home page che porta ad una sezione accessibile in cui i contenuti sono espressi unicamente con il testo, con la possibilità di ingrandire i caratteri, di aumentare il contrasto e di disabilitare i fogli di stile mantenendo intatte le funzionalità proposte.
    Ciò nonostante l'esame effettuato riporta errori, anche gravi, nell'implementazione. La lettura del sito con il software JAWS 7.0 è risultata non particolarmente scorrevole e gradevole; ciò è dovuto principalmente al lungo menù che ripetutamente viene proposto prima di arrivare al corpo della pagina, al nocciolo dell'argomento.
    Pare evidente, quindi, che lo scopo iniziale che gli autori si erano presubilmente posti era quello di rendere completamente accessibile il sito, però alcuni errori hanno pregiudicato il risultato finale.
    Anche se le funzionalità sono generalmente rispettate, la scorrevolezza e l'imediatezza sono due qualità che possono essere usufruite unicamente da utenti non disabili.


    Link all'inizio della pagina.

Indice generale
Sommario della relazione simulazione euristica.
  1. Introduzione
  2. Scenari d'uso ipotizzati
  3. Descrizione delle barriere
  4. Analisi dettagliata
    1. Immagini ricche senza testo alternativo
    2. Mancanza di didascalie del video
    3. Colore essenziale
    4. Frame inaccessibili
    5. Materiale in movimento
    6. Immagini funzionali in sfondo
    7. Immagini funzionali prive di testo
    8. Link generici
    9. Link ambigui
    10. Menu dinamici in javascript
    11. Eventi mouse
    12. ASCII art
    13. Titoli spaziati
    14. Troppi link
    15. Form con redirect
    16. Link non separati
    17. Nuove finestre
    18. Form senza label
    19. Temporizzazioni troppo brevi
    20. Tabelle dati
    21. Tabelle di impaginazione
    22. Pagine senza titoli
    23. Frame senza titolo
    24. Marcatura della lingua
    25. Suddivisione in sezioni
    26. Immagini come titoli
    27. Mancanza di tasti rapidi
    28. Skip links
    29. Pagina solo testo
    30. Controlli del browser disabilitati
    31. Manca sincronizzazione
  5. Conclusioni