Relazione corso PSW

Simulazione Euristica Sito Regione Lombardia

Sei in: Indice relazioni > Simulazione Euristica Sito Regione Lombardia - Barriere riscontrate (3/3)

Barriere riscontrate

Indice delle barriere

Problemi critici

Immagini ricche senza testo alternativo

Gravità del problema: critico.

Tipo disabile: non vedente.

Tipo barriera: percezione.

Descrizione barriera: l'attributo alt nei tag img è poco esaustivo. Ad esempio nella barra di navigazione di ogni pagina è presente un'immagine con attributo alt="banner". All'utente non vedente il significato di questo testo alternativo non comunica assolutamente nessuna informazione. All'immagine è stato associato un link, per cercare di risolvere questo problema, che permette all'utente il caricamento immadiato della pagina o del sito collegato al banner.
La soluzione adottata dai progettisti del sito non ci sembra molto adatta, per due motivi molto importanti:

  1. la pagina di destinazione del banner può cambiare nel tempo (ad esempio durante il periodo di analisi la pagina di destionazione è stata cambiata da Borsa del Lavoro a Lombadia Notizie);
  2. l'utene deve spendere il suo tempo nel leggere delle informazioni che non soddisfano il suo compito.
il testo alternativo associato all'immagine del banner Lombardia Notizie

Suggerimenti: alcune semplici possibilità

[T] Inizio Pagina

Frame inacessibili

Gravità del problema: critico.

Tipo disabile: non vedente.

Tipo barriera: percezione.

Descrizione barriera: Alcune pagine del sito contengono dei frame che impedisce ad utenti, di vecchie versioni di lettori di schermo non compatibili, di accedere al loro contenuto.

Un esempio di una pagina in cui viene utilizzato un frame

Suggerimenti:

[T] Inizio Pagina

Immagini funzionali prive di testo

Gravità del problema: critico.

Tipo disabile: non vedente.

Tipo barriera: utilizzazione.

Descrizione barriera: Alcune pagine del sito contengono delle immagini funzionali (link cliccabili, immagini correlate al testo) prive di testo alternativo. Talvolta tali oggetti multimediali presentano del testo alternativo che non è del tutto adatto o poco informativo. L'utente non vedente fa fatica a capire qual è il ruolo dell'immagine, nel caso di un link il lettore di schermo si limiterà a leggere l'url. Ricordiamo che gli url delle pagine del sito sono poco comprensibili pechè sono delle abbreviazioni, anche difficili da memorizzare.
Riportiamo di seguito una porzione della pagina principale del sito in cui abbiamo due esempi di questo tipo:

Porzione di pagina in cui appaiono delle immagini funzionali prive di testo, evidenziate con riquadri rossi.

Suggerimenti:

[T] Inizio Pagina

Troppi link

Gravità del problema: critico.

Tipo disabile: non vedemti, ipovedenti, motorio.

Tipo barriera: comprensione, controllo da parte dell'utente.

Descrizione barriera: In alcune pagine il numero di link è molto alto. Ad esempio nella pagina delle tematiche ce ne sono molti. L'utente non vedente che utilizza un lettore di schermo è costretto ad un'analisi lunga e faticosa di ciascuno di essi. Il numero di link, nonostante l'organizzazione in gruppi, risulta molto alto. Può accadere che l'utente non vedente dopo aver ascoltato un certo numero di possibilità, proposte dal lettore di schermo, dimentichi alcuni di esse perchè sovraccaricato dalle troppe informazioni. Così è costretto a ritornare sui propri passi.
Anche per gli altri tipi di disabili l'elevato numero di link costinge ad un'analisi lunga e faticosa. In particolare un utente ipovedente, che utilizza un ingraditore di schermo, è costretto a far scorrere il ristretto campo visivo su tutti i link, nelle varie zone della pagina. Anche in questo caso l'utente ipovedente può venir sovraccaricato dalle informazioni e di conseguenza dimenticarsi alcuni dei link visti in precedenza.
Per quanto riguarda i disabili motori l'elevato numero di link potrebbe costringe ad uno scrolling verticale od orrizontale, forzando delle azioni che richiedono l'uso del mouse o della tastiera che sono difficili da compiere.
Questa barriera influenza molto la produttività, la soddisfazione e l'efficacia dell'utente, che rischia di confondersi e di commettere più errori.

esempio di pagina con molti link

Suggerimenti: Proproniamo alcune semplici possibilità.

[T] Inizio Pagina

Nuove finestre

Gravità del problema: critico.

Tipo disabile: non vedente, motorio.

Tipo barriera: utilizzazione.

Descrizione barriera: Alcune pagine del sito contengono dei link che aprono nuove finestre del browser quando l'utente li attiva. Questo comportamento viene applicato dal sito in due situazioni: la prima quando vengono presentati dei sotto-domini del sito e la seconda quando devono venir aperti dei documenti testuali brevi. Nel secondo caso viene data la possibilità all'utente di chiudere imadiatamente la finesta con un link ad inizio pagina.
Le nuove finestre, ovviamente, non permettono all'utente di tornare semplicemente alla pagina precedente, tramite il pulsante indietro.
Può accadere che l'utente non vedente non si accorga che la pagina è cambiata, anche perchè il titolo scelto per le pagine del sito è sempre lo stesso.
Per quanto riguarda, invece, il disabile motorio il problema può essere dovuto dal fatto l'utente, non interessato al contenuto della pagina, per chiuderla deve compiere un'azione molto faticosa con conseguente perdità della prodduttività. Un disabile motorio che non è abile nei movimenti deve spostare il cursore del mouse sul pulsante di chiusura della finesta, solitamente posizionato nella parte superiore destra dello schermo.

Suggerimenti:

[T] Inizio Pagina

Form senza LABEL

Gravità del problema: critico.

Tipo disabile: non vedenti, motorio.

Tipo barriera: utilizzazione.

Descrizione barriera: Le pagine che contengono form sono prive del tag label. Questa barriera causa problemi ai disabili non vedenti e motori. Per quanto riguarda i non vedenti, che utilizzano un lettore di schermo in modalità "controlli della form", non può permettersi di scorrere avanti ed indietro il focus dell'interazione.
Per i diasbili motori i problemi sono dovuti alle superfici cliccabili ridotte dei controlli, che richiedono all'utente uno sforzo notevole.

Esempio di form che utilizzano controlli con superfici ridotte

Suggerimenti:

[T] Inizio Pagina

Pagine senza titoli

Gravità del problema: critico.

Tipo disabile: non vedente.

Tipo barriera: comprensione.

Descrizione barriera: Tutte le pagine del sito presentano lo stesso titolo "Potrale Regione Lombardia". Per i disabili non vedenti questo tipo di problema è molto grave, perchè il titolo della pagina è la prima cosa che viene letta dal lettore di schermo. Quindi l'utente potrebbe non capire che la pagina è cambiata oppure non capire in quale stato del compito, che stava svolgento, si trova.

Suggerimenti:

[T] Inizio Pagina

Frame senza titolo

Gravità del problema: critico.

Tipo disabile: non vedente.

Tipo barriera: comprensione.

Descrizione barriera: I frame che compongono alcune parti del sito sono privi dell'attributo title e il contenuto dell'attributo name, se presente, è poco significativo. I disabili che utilizzano tecnologie assistive, quali lettori di schermo, sono costretti a visitare i frame uno per volta. L'uso non adeguato di questi attributi non permettono all'utente di capire nè quale sia lo scopo del frame nè quale sia il suo contenuto.

frammento di codice html che usa frame preso da una pagina del portale Regione Lombardia

Suggerimenti:

[T] Inizio Pagina

Suddivisione in sezioni

Gravità del problema: critico.

Tipo disabile: non vedente.

Tipo barriera: comprensione, controllo da parte dell'utente.

Descrizione barriera: In tutte le pagine del sito non sono presenti dei tag che permettono di organizzare il testo in sezioni (i tag h1, h2, .. h6). Questa mancanza causa grandi problemi durante la lettura della pagina ai disabili non vedenti che utilizzano un lettore di schermo. Il lettore di schermo, in genere, permette di listare tutti i titoli di sezione e di saltare da uno all'altro. Ciò permette una lettura più veloce della pagina, perchè l'utente può decidere di ignorare le sezioni che non gli interessano.
In questo caso l'utente, invece, viene obbligato a leggere tutto il contenuto della pagina, rischiando di perdere tanto tempo se la pagina non contiene le informazioni cercate.

Suggerimenti:

[T] Inizio Pagina

Mancanza di tasti rapidi

Gravità del problema: critico.

Tipo disabile: non vedente, ipovedente, motorio.

Tipo barriera: controllo da parte dell'utente.

Descrizione barriera: Tutte le pagine contengono dei link e dei pulsanti che si ripetono, ai quali non viene applicato nessun tasto rapido. Ad esempio i link della barra di navigazione ed il pulsante che permette di esegure la ricerca avanzata. Ancora più risulta il fatto che le pagine non dispongono di link che permettono di saltare direttamene al contenuto della pagina.
Ad ogni tipo di disabile corrisponde un particolare fallimento.
Un disabile non vedente utilizza solo la tastiera per muoversi nella pagina da controllo a controllo, utilizzando il tasto TAB per uno spostametno di tipo sequenziale.
Un disabile ipovedente usa solitamente i tasti rapidi per spostare rapidamente e in maniera precisa il focus dell'interazione sulla parte della pagina di interesse.
Un disabile motorio preferisce di solito l'uso della tastiera, la presenza di tasti rapidi migliora l'usabilità.

Suggerimenti:

[T] Inizio Pagina

Skip link

Gravità del problema: critico.

Tipo disabile: non vedente, ipovedente.

Tipo barriera: controllo da parte dell'utente.

Descrizione barriera: La maggior pagine del sito non permettono di saltare direttamente al contenuto evitando il materiale preliminare. Le uniche pagine che permettono di saltare al contenuto sono quelle relative alle news.
Il problema principale, per i due tipi di disabili, è dato dal fatto che l'utente deve ogni volta leggersi o vedere la parte preliminare della pagina (la barra di navigazione, il logo e le briciole di pane).

Suggerimenti:

[T] Inizio Pagina

Mancanza di link interni

Gravità del problema: critico.

Tipo disabile: ipovedente, motorio

Tipo barriera: utilizzazione, controllo da parte dell'utente.

Descrizione barriera: Le pagine ricche di contenuto sono prive di link interni che permettono di saltare di sezione in sezione, o di ritornare in testa alla pagina.
Il disabile ipovedente, che usa un ingraditore di schermo, è costretto a muovere continuamente il campo visivo dalla parte inferiore della pagina alla barra di scorrimento e poi di nuovo all'inizio della finestra per poter leggere il titolo della sezione e la sua parte iniziale.
Il disabile motorioè costretto continuamente a muovere il puntatore della pagina alla barra di scorrimetno e viceversa. Il discorso è equivalente se tale utente utilizza la tastiera, viene richiesto un uso frequente di più tasti.

Suggerimetni:

[T] Inizio Pagina

Link troppo vicini

Gravità del problema: critico.

Tipo disabile: motorio.

Tipo barriera: utilizzazione.

Descrizione barriera: Molte pagine del sito contengono delle sequenze di link molto vicine tra loro, scritte con caratteri molto piccoli. Adirittura nella pagina delle tematiche, i link vengno disposti in sequenza separati da una virgola. Gli utenti disabili motori fanno fatica a il mouse su tali link, in certi casi colpisce il link sbagliato posto nelle immediate vicinanze.

Suggerimenti:

[T] Inizio Pagina

Finestre sovrapposte

Gravità del problema: critico.

Tipo disabile: ipovedente.

Tipo barriera: utilizzazione.

Descrizione barriera: Alcune pagine contengono dei link che aprono nuove finestre che si sovrappongono totalmente o quasi del tutto con la finestra usata fino a quel momento. L'utente ipovedente non risce a distinguere la nuova finestra da quella precedente, e si trova del tutto disorientato dal nuovo contesto che gli viene proposto.

Suggerimenti:

[T] Inizio Pagina

Immagini come titoli

Gravità del problema: critico.

Tipo disabile: ipovedente.

Tipo barriera: comprensione.

Descrizione barriera: Alcune pagine contengono dei titoli di categoria implementati tramite delle immagini prive di attributo alt. Come si può vedre nelle figure sottostanti, le immagini usate come titoletti "Lombardia Notizie" sono prive dell'attributo alt. In questo caso l'utente ipovedente non potrà usare solamente il browser per ingrandire il contenuto della pagina, dato che ciò non ingradirà tali titoli.

porzione di pagina in cui vengono usate delle immagini come titoli porzione di pagina in cui vengono usate delle immagini come titoli, ma l'immagine viene rimpiazzata dal testo 
		alternativo

Suggerimenti:

[T] Inizio Pagina

Problemi seri

Materiale in movimento

Gravità del problema: serio.

Tipo disabile: non vedente, ipovedente.

Tipo barriera: percezione.

Descrizione barriera: Nel menu principale é presente un'immagine animata che viene utilizzata come banner. Gli utenti di lettori di schermo non possono percepire il cambiamento del testo, inoltre il testo dell'attributo alt é poco esplicativo in quanto riporta solo la scritta banner.
L'uso di immagini animate rende difficile la navigazione anche per utenti di ingranditori di schermo che possono non percepire il cambiamento dell'immagine in quanto fuori dal loro campo visivo.

Suggerimenti:

[T] Inizio Pagina

Tabelle di impaginazione

Gravità del problema: serio.

Tipo disabile: non vedente.

Tipo barriera: comprensione.

Descrizione barriera: Tutte le pagine del sito sono realizzate mediante l'utilizzo di gabbie grafiche. La linearizzazione del layout é buona ma gli utenti di lettori di schermo vengono rallentanti dalla pronuncia di frasi tipo "tabella 1 con 1 riga e 1 colonna". Nelle tabelle grafiche del sito viene utilizzato l'attributo summary previsto per le tabelle dati che peggiora la situazione, dato che il lettore di schermo pronuncia ancora piú parole inutili.

Pagina con gabbia grafica evidenziata e attributi usati.

Suggerimenti:

[T] Inizio Pagina

Immagini funzionali prive di testo

Gravità del problema: serio.

Tipo disabile: ipovedente.

Tipo barriera: utilizzazione.

Descrizione barriera: I link del menu principale sono realizzati utilizzando delle immagini, questo non permette, agli utenti privi di ingranditori di schermo, di ingrandire le immagini e quindi non saranno in grado di leggerne o distinguerne il contenuto. Inoltre alcune immagini cliccabili della homepage hanno testo alternativo vuoto.

Esempio di pagina ingrandita ma con immagini non ridimensionabili Pagina con immagini cliccabili e attributo alt vuoto

Suggerimenti:

[T] Inizio Pagina

Problemi minori

Link generici/ambigui

Gravità del problema: minore.

Tipo disabile: non vedente.

Tipo barriera: utilizzazione.

Descrizione Barriera: In alcune pagine viene utilizzato piú volte il link "segue". Questa etichetta é poco informativa e gli utenti di lettori di schermo non ha modo di selezionare il link quando questo viene proposto fuori dal contesto.

Esempio di pagina con link generici

Suggerimenti:

[T] Inizio Pagina

Immagini come titoli

Gravità del problema: minore.

Tipo disabile: non vedente.

Tipo barriera: comprensione.

Descrizione barriera: Nella homepage alcune notizie sono etichettate con l'immagine che riproduce la scritta "lombardia notizie" e questa ha l'attributo alt vuoto. Un utente di lettore di schermo non potrá sapere che quella news é catalogata come "lombardia notizie" in quanto il lettore di schermo non pronuncierá niente.
Nell'immagine sottostante é possibile vedere la differenza tra la sezione news con le immagini abilitate e la sezione news con le immagini sostituite dal valore del loro attributo alt. Si noti come il l'etichetta della news sparisce.

Esempio di barriera dove immagini sono usate come titoli

Suggerimenti:

[T] Inizio Pagina

ASCII Art

Gravità del problema: minore.

Tipo disabile: non vedente.

Tipo barriera: comprensione.

Descrizione barriera: nel sito salturariamente vengono usati simboli com ">>" come decorazione. Un utente di lettore di schermo sente pronunciare i caratteri usati e potrebbe non capire di cosa si tratta

Porzione di pagina dove vengono utilizzati ASCII Art

Suggerimenti:

[T] Inizio Pagina

Valid XHTML 1.0 Strict Valid CSS ©2006 Mirko Cappena, Mauro Santarossa