Salta al contenuto [ s ]

Progetto Siti e Portali Web

Pagina attuale: Home page / Simulazione euristica di accessibilità - Risultati in dettaglio

Risultati in dettaglio sulla simulazione euristica di accessibilità

Barriere della percezione: impediscono o rallentano la percezione di ciò che si presenta nella pagina, sia sotto forma di scritte che di immagini.

Barriere dell'utilizzazione: rallentano o impediscono di utilizzare tutte le caratteristiche delle pagine.

Barriere della comprensione: limitano la comprensione dei dati presenti nella pagina che, pur venendo percepiti, non riescono ad essere interpretati correttamente.

Barriere al controllo da parte dell'utente: impediscono di gestire l'informazione presente nella pagina che, pur essendo correttamente percepita e compresa, viene presentata in un layout che complica la vita all'utente.

Riassunto dei risultati: Tabella che risassume i risultati della valutazione euristica.

Inizio argomento

BARRIERE DELLA PERCEZIONE:
Immagini ricche senza testo alternativo

Barriera: presente

Pagine:

Sono presenti molte immagini ricche di contenuto, come ad esempio il logo della regione e l’intestazione della pagina. Tali immagini risultano però prive del contenuto alternativo per mezzo dell’attributo "ALT"; cosa che non accade per le immagini della home page.

Esempio: logo della regione Sicilia

<img src="img/logosmal.jpg" height="94" width="132">

Esempio: titolo TGWEB

<img src="img/tgweb_banner.jpg" usemap="#Map" border="0" height="102" width="255">

Esempio: titolo La Giunta Regionale

<img src="work/giunta.jpg" height="70" width="550">

Esempio: cona

<img src="miscA89.gif" border="0" height="23" width="27">

Conseguenze:Senza l’attributo "ALT", l’utente anche se percepisce la presenza dell’immagine, non può fruire delle informazioni contenute al suo interno. Quindi l'efficacia è fortemente compromessa e anche la produttività rischia di essere ridotta.

Impatto: 1 Frequenza: 1 Gravità: minore

Possibili rimedi: Aggiungere un testo equivalente al contenuto dell'immagine, usando l'attributo ALT.
Se ancora non sufficiente, associare un link all'immagine, posto nelle immediate vicinanze, oppure rendere cliccabile l'immagine stessa, e predisporre una nuova pagina con le spiegazioni dell'immagine.
Oppure scrivere il testo equivalente accanto all'immagine, in modo che esso sia disponibile e visibile indistintamente per chi vede e per chi non vede l'immagine.

Esempio: logo della regione Sicilia

<img src="img/logosmal.jpg" height="94" width="132" alt="Logo della Regione Sicilia">

Esempio: titolo TGWEB

<img src="work/giunta.jpg" height="70" width="550" alt="Titolo pagina: TGWEB">

Esempio: titolo La Giunta Regionale

<img src="img/tgweb_banner.jpg" usemap="#Map" border="0" height="102" width="255" alt="Titolo pagina: la Giunta Regionale" >

Esempio: cona

<img src="miscA89.gif" border="0" height="23" width="27" alt="Scrivi una email">

Inizio argomento

BARRIERE DELLA PERCEZIONE:
Mancanza di didascalie nel video

Barriera: assente

Pagine:

Nella sezione "tgweb" sono presenti filmati. Tali file multimediali sono però privi di una descrizione testuale delle scene, infatti viene solamente fornita affianco agli ultimi notiziari disponibili una breve scaletta che elenca gli argomenti trattati all’interno del file multimediale che si andrà ad ascoltare. Data la tipologia di video tale barriera non risulta rilevante in quanto non è indispensabile che l’informazione sia veicolata dall’immagine.

Inizio argomento

BARRIERE DELLA PERCEZIONE:
Colore essenziale

Barriera: assente

Pagine:

Non viene riscontrata la presenza di materiale dove il colore viene usato come unico modo per distinguere due o più informazioni diverse.

Inizio argomento

BARRIERE DELLA PERCEZIONE:
Frame inaccessibili

Barriera: presente

Pagine:

Nelle pagine analizzate sono presenti dei frame che rendono la pagina inaccessibile.

<iframe height="20" width="100%" scrolling="no" frameborder="0" marginheight="0" marginwidth="0" align="middle" src="bilancio/ANSA_news/Notizie.asp" style="visibility:hidden;" onload="this.style.visibility = 'visible';">
</iframe>

<frameset rows="100%,*" cols="*" framespacing="0"" frameborder="NO" border="0">
<frame src="http://66.71.180.135/tgweb_regionesicilia/tgweb.htm" name="topFrame" frameborder="no" >
<frame src="bottom.htm" name="mainFrame" frameborder="no" scrolling="no" noresize>
</frameset><noframes>

Conseguenze:Utenti che utilizzano vecchi lettori di schermo non riescono ad accedere ai singoli frame, compromettendo così l’efficacia di navigazione all’interno delle pagine web.

Impatto: 3 Frequenza: 2 Gravità: critico

Possibili rimedi:Ristrutturare le pagine del sito, sostituendo i frame con opportune regole CSS .

Inizio argomento

BARRIERE DELLA PERCEZIONE:
Materiale in muovimento

Barriera: presente

Pagine:

Nelle pagine sono presenti informazioni in movimento (testo scorrevole), che potrebbero non essere percepite in modo corretto dall’utente che utilizza un lettore di schermo.

Conseguenze:L'utente potrebbe non percepire il costante cambiamento di testo, in quanto non viene segnalato dal lettore di schermo, provocando una perdita di informazioni per l’utente.

Impatto: 1 Frequenza: 1 Gravità: minore

Possibili rimedi: Non presentare le informazioni in movimento all’interno delle pagine web, ma dare la possibilità agli utenti di avanzare liberamente nella lettura delle informazioni.

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Immagini funzionali in sfondo

Barriera: assente

Pagine:

Le pagine non contengono nello sfondo delle immagini che assumono un ruolo funzionale nella pagina visualizzata.

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Immagini funzionali prive di testo

Barriera: presente

Ad eccezione della home page nelle altre pagine del sito, sono presenti immagini funzionali prive di testo; è il caso ad esempio della "homepage" e "mappa del sito"

Conseguenze: L'utente è impossibilitato a capire il ruolo dell'immagine (infatti il lettore di schermo si limita a leggere l'URL del link) e quindi a scegliere oculatamente il link o il pulsante da attivare. Questo provoca una riduzione, anche totale, dell'efficacia.

Esempio: immagini funzionali prive di testo

Impatto: 3 Frequenza: 3 Gravità: critico

Possibili rimedi: Includere nelle immagini l'attributo "ALT", in modo che il testo sia informativo e che quindi permetta di capire l'effetto dell'attivazione del link.

Esempio: Pulsante home

<img src="http://66.71.180.135/tgweb_regionesicilia/img/home0000.gif" name="home" border="0" height="29" width="96" alt=”Homepage”>

Esempio: Pulsante mappa

<img src="http://66.71.180.135/tgweb_regionesicilia/img/map.gif" name="map" border="0" height="29" width="123" alt=”Mappa del sito>

Esempio: cona

<img src="miscA89.gif" border="0" height="23" width="27" alt="Scrivi una email">

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Link generici

Barriera: presente

Pagine:

All’interno del form della pagina analizzata è presente un link per la registrazione al sito che non soddisfa il requisito, in quanto la sua etichetta non è informativa.

Esempio form

Conseguenze: L'utente del lettore di schermo non ha modo di selezionare il link quando esso viene proposto fuori dal contesto, provocando una drastica riduzione dell'efficacia.

Impatto: 3 Frequenza: 2 Gravità: critico

Rimedio: Evitare di utilizzare "qui" per indicare dove cliccare per registrarsi. Una buona alternativa è quella di riformulare la frase.

"Per accedere all’area riservata devi registrarti.

Esempio form

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Link ambigui

Barriera: assente

Pagine:

Le pagine non contengono dei link con etichette ambigue.

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Menu dinamici in JavaScript

Barriera: presente

Pagine:

Il menu della home page è un menù dinamico in JavaScript. Appena l'utente posiziona il focus dell'interazione su un elemento, viene selezionata una voce o eventualmente aperto un sottomenù.

Esempio: menu dinamico

Conseguenze: Il lettore di schermo potrebbe non accorgersi della modifica alla pagina dove appare il menu, col risultato che il menu risulta totalmente inutilizzabile all'utente.

Impatto: 3 Frequenza: 2 Gravità: critico

Possibili rimedi: Rendere tutte le opzioni di navigazione e i comandi operativi attivabili anche disattivando JavaScript, offrendo eventualmente link o pulsanti ridondanti in una sezione separata della pagina.

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Eventi mouse

Barriera: assente

Pagine:

Il menu dell’home page è un menù dinamico in JavaScript. Appena l'utente posiziona il focus dell'interazione su un elemento, viene selezionata una voce o eventualmente aperto un sottomenù.

IO: non sono presenti eventi mouse

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Form con redirect

Barriera: assente

Pagine:

Non sono presenti form con redirect

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Link non separati

Barriera: assente

Pagine:

La pagina non contiene delle sequenze di link non separati tra loro da caratteri pronunciabili

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Nuove finestre

Barriera: presente

Pagine:

Il menu della home page è un menù dinamico in JavaScript. Appena l'utente posiziona il focus dell'interazione su un elemento, viene selezionata una voce o eventualmente aperto un sottomenù.

Esempio: Nuove finestre

<a href="http://www.cartosicilia.it" target="_blank">Urbanistica:la cartografia Siciliana</a>

Conseguenze: Il lettore di schermo potrebbe non avvisare l’utente che il contesto di interazione è cambiato, e che quindi è cambiato sia il contenuto che i comandi possibili. Anche il pulsante "BACK" del browser non permette di tornare alla pagina precedente, e questo toglie un'ancora di salvezza all'utente.

Impatto: 3 Frequenza: 3 Gravità: critico

Possibili rimedi: Evitare l’apertura dei link in nuove finestre. Se è necessario, fare in modo che l’apertura della nuova finestra venga segnalata dal lettore di schermo, per esempio facendo uso dell'attributo "title", e dare l'opportunità di chiuderla.

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Form senza label

Barriera: presente

Pagine:

La pagina contiene una form i cui controlli sono privi del corretto markup; non vengono utizzati il tag "label" con attributo for.

Esempio: Visualizzazione form

<tr><td width="29%">User-name</td><td width="71%"><input name="user" size="20" type="text"></td></tr>

Conseguenze:L'utente che usa il lettore di schermo in modalità "controlli della form" non è in grado di leggere il testo associato all'etichetta del controllo.

Impatto: 3 Frequenza: 1 Gravità: critico

Possibili rimedi: Usare il tag label con attributo for attorno alle etichette di ciascun controllo.

Inizio argomento

BARRIERE DELL’UTILIZZAZIONE:
Temporizzazioni troppo brevi

Barriera: assente

Pagine:

Nelle pagine analizzate non sono presenti temporizzazioni troppo brevi.

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
ASCII art

Barriera: presente

Pagine:

La pagina contiene ASCII art (es. il link " » siti tematici").

Esempio: ASCII art

Conseguenze: Anche se ormai l’uso del carattere ">" è diventato di uso abituale, comporta comunque una barriera di comprensione per chi utilizza i lettori di schermo in quanto potrebbe non comprendere la frase pronunciata da un lettore di schermo ("parentesi angolare destra parentesi angolare destra siti tematici").

Impatto: 1 Frequenza: 1 Gravità: minore

Possibili rimedi: Nella costruzione della pagina web non inserire caratteri ASCII art per decorare il testo. Eventualmente è possibile sostituire con immagini dotate di ALT="…".

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Titoli spaziati

Barriera: assente

Pagine:

Le pagine analizzate non contengono delle parole o termini spaziati in maniera artificiosa.

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Troppi link

Barriera: presente

Pagine:

Nelle pagine sono presenti molti link non organizzati in gruppi.

Conseguenze: Il numero elevato di link costringe l'utente ad un'analisi lunga e faticosa per navigare in modo corretto all’interno del sito. Gli utenti devono ascoltare tutti i link prima di decidere se continuare e poter scegliere quello più rilevante per loro. Durante questo ascolto devono memorizzare i link sentiti in modo da poterci ritornare con il focus per attivarli.

Impatto: 2 Frequenza: 3 Gravità: critico

Possibili rimedi: Riorganizzare i link suddividendoli in sezioni/categorie, introducendo dei titoli di categoria (con degli H2-H3). Deve essere possibile per l'utente esaminare sinteticamente un blocco di link e decidere solo dal titolo di categoria se i link che esso contiene sono rilevanti o meno.

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Tabella dati

Barriera: presente

Pagine:

La pagina contiene delle tabelle dati non codificate appropriatamente, in particolare le celle d’intestazione non sono codificate con il tag "th".

Riportiamo qui un esempio:

Esempio: tabella

Conseguenze: Il lettore di schermo non è in grado d’informare l’utente sulla tipologia di contenuto delle celle, che vengono lette una alla volta, riga per riga. L’utente è costretto a ricordarsi la disposizione delle colonne e delle righe e delle loro intestazioni.

Impatto: 2 Frequenza: 3 Gravità: critico

Possibili rimedi: Usare i tag "th" per distinguere le celle intestazione da quelle dei dati, e degli attributi "id" o "scope" associati al tag th e "headers" associato al tag td, per legare le celle di dati a quelle d'intestazione.

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Tabelle di impaginazione

Barriera: presente

Pagine:

HomePage (www.regione.sicilia.it)

La pagina viene impaginata con tabelle di layout che si linearizzano male (generazione del loro contenuto letto dall'alto verso il basso e da sinistra a destra, come se la tabella non ci fosse).

Conseguenze: Le tabelle linearizzate male, permettono ad un utente non vedente di comprendere come le informazioni sono disposte all’interno della pagina, anche se rallentano la sua azione.

Impatto: 1 Frequenza: 3 Gravità: serio

Possibili rimedi: Eliminare, se non è possibile ridurre, tutte le tabelle layout sostituendole con opportune regole CSS

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Pagine senza titoli

Barriera: assente

Pagine:

Le pagine presentano il tag title, di conseguenza ogni pagina ha un titolo univoco.

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Frame senza titolo

Barriera: presente

Pagine:

La pagina contiene il tag frameset privo dell’attributo title.

<frameset rows="100%,*" cols="*" framespacing="0"" frameborder="NO" border="0">
<frame src="http://66.71.180.135/tgweb_regionesicilia/tgweb.htm" name="topFrame" frameborder="no" >
<frame src="bottom.htm" name="mainFrame" frameborder="no" scrolling="no" noresize></frameset>

Conseguenze: Una pagina basata sui frame, privi dell’attributo "title", costringe l’utente a visitare un frame per volta. Nella pagina analizzata è presente solo un frame. Tuttavia consideriamo questa barriera di gravità minore, non escludendo che la gravità possa aumentare se in futuro la pagina venisse basata su più frame senza l’attributo "title".

Impatto: 1 Frequenza: 1 Gravità: minore

Possibili rimedi: La soluzione migliore è quella di evitare l’uso di frame, sostituendoli con opportune regole CSS. In questo caso ogni frame deve avere l'attributo "title" con valore comprensibile e informativo.

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Marcatura della lingua

Barriera: presente

Pagine:

Nelle pagine manca l’attributo "lang" sia nel tag iniziale HTML, sia ogni volta che ci sono parole di una lingua diversa da quella della pagina.

Conseguenze:Il lettore di schermo non è in grado di risalire alla lingua a cui appartengono le parole da pronunciare, quindi se la pagina contiene parole in italiano e il lettore incontra delle parole straniere prive di attributi che ne specifichino la lingua, non le legge correttamente.

Impatto: 2 Frequenza: 3 Gravità: critico

Possibili rimedi: Aggiungere l'attributo "lang" al tag HTML con valori come "it", "en", "de", "fr", ecc. Inoltre ogni qualvolta si riscontra la presenza di una parola con una lingua diversa, usare del markup come ad esempio. "<span xml:lang="de">DANUTA HÜBNER<span/>".

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Suddivisione in sezioni

Barriera: presente

Pagine:

La pagina non contiene tag tipo H1,H2... per suddividere in sezioni il suo contenuto.

Conseguenze:Non essendoci una suddivisione in sezioni del contenuto delle pagine, il lettore di schermo non permette all’utente di listare tutti i titoli delle sezioni e di passare da uno all’altro in qualsiasi punto della pagina. In particolare nel caso di visita di pagine errate, l’utilizzo dei tag tipo "H1, H2, … nella pagina permette all’utente di capire subito che si trova in una pagina che non gli interessa, risparmiando tempo e fatica.

Impatto: 1 Frequenza: 3 Gravità: serio

Possibili rimedi: Per ogni tipo di contenuto aggiungere un tag "H1-H6" rispettando l’ordine.

Inizio argomento

BARRIERE DELLA COMPRENSIONE:
Immagini come titoli

Barriera: presente

Pagine:

Le pagine analizzate contengono titoli di categoria implementati mediante immagini prive dell’attributo alt.

Conseguenze:Il lettore di schermo non potrà pronunciare alcun testo eccetto l'URL del file dell'immagine. L'utente perderà anche quel poco d’orientamento che il titolo avrebbe potuto fornire.

Esempio: Immagine come titolo

<img src="img/tgweb_banner.jpg" usemap="#Map" border="0" height="102" width="255">

Esempio: Immagine come titolo

<img src="work/giunta.jpg" height="70" width="550">

Impatto: 1 Frequenza: 3 Gravità: serio

Possibili rimedi:Evitare di usare immagini per i titoletti di categorie, usando invece le regole del CSS per ottenere l’effetto grafico desiderato. Se ciò non fosse possibile, aggiungere l'attributo alt a ciascuna immagine con un valore che corrisponde all'immagine.

Inizio argomento

BARRIERE DI CONTROLLO DA PARTE DELL'UTENTE:
Mancanza di tasti rapidi

Barriera: presente

Pagine:

Le pagine contengono dei link che sono ricorrenti nelle pagine del sito e che non hanno alcun tasto rapido associato con l’attributo "accesskey".

Conseguenze: L'utente che usa solo la tastiera, non può muoversi velocemente nella pagina da controllo a controllo. Inoltre deve sempre usare il tasto "TAB" e muoversi sequenzialmente.

Impatto: 2 Frequenza: 3 Gravità: critico

Possibili rimedi: Aggiungere l'attributo "accesskey" nei link, pulsanti e controlli ricorrenti nelle pagine del sito, evitando di usare i caratteri usati nell'elenco dei nomi di menu del browser o le cifre. Infine descrivere i tasti rapidi in una pagina d’aiuto, mantenendo le stesse chiavi per uno stesso controllo che si ripete.

Inizio argomento

BARRIERE DI CONTROLLO DA PARTE DELL'UTENTE:
Skip links

Barriera: presente

Pagine:

Le pagine non permettono di saltare direttamente al contenuto, evitando il materiale preliminare delle pagine.

Conseguenze: Durante la navigazione all'interno del sito, ogni volta che viene ricaricata la pagina, l'utente è costretto a sentirsi leggere ripetutamente il materiale preliminare prima di arrivare all’argomento d’interesse.

Impatto: 2 Frequenza: 3 Gravità: critico

Possibili rimedi: Aggiungere, all’inizio della pagina, un link che permetta di saltare direttamente al suo contenuto. Nell’ipotesi non fosse possibile creare un link visibile a tutti, implementando lo skip links mediante un link nascosto con display:none o con uno spaziatore trasparente dotato di alt="salta al contenuto".

Inizio argomento

BARRIERE DI CONTROLLO DA PARTE DELL'UTENTE:
Pagina solo testo

Barriera: assente

Pagine:

Il sito della regione Sicilia non mette a disposizione dell’utente pagine di solo testo.

Inizio argomento

BARRIERE DI CONTROLLO DA PARTE DELL'UTENTE:
Controlli del browser disabilitati

Barriera: presente

Pagine:

Numerose sono le pagine che una volta cliccate vengono aperte in nuove finestre del browser, dove i controlli tipici del browser "back e next" sono disabilitati.

Esempio: Finestra con controlli disabilitati

Conseguenze: L'utente è costretto a percorrere in lungo e in largo la pagina per trovare un link che gli permetta di tornare indietro o di rileggere l'URL della pagina, provocando una riduzione dell’efficacia.

Impatto: 3 Frequenza: 2 Gravità: critico

Possibili rimedi: Non disabilitare mai i controlli tipici del browser "back, next, refresh".

Inizio argomento

TABELLA RIASSUNTIVA

Di seguito vengono riassunte in una tabella tutte le violazioni riscontrate, corredata di impatto, frequenza e severità ordinata per valori decrescenti di gravità:

TABELLA RIASSUNTIVA
Barriera Impatto Frequenza Gravità
Immagini funzionali prive di testo 3 3 critico
Nuove finestre 3 3 critico
Frame inaccessibili 3 2 critico
Link generici 3 2 critico
Menu dinamici in JavaScript 3 2 critico
Troppi link 2 3 critico
Tabelle dati 2 3 critico
Marcatura della lingua 2 3 critico
Mancanza di tasti rapidi 2 3 critico
Skip links 2 3 critico
Controlli del browser disabilitati 2 3 critico
Form senza LABEL 3 1 critico
Tabelle di impaginazione 1 3 serio
Suddivisione in sezioni 1 3 serio
Immagini come titoli 1 3 serio
Immagini ricche senza testo alternativo 1 1 minore
Materiale in movimento 1 1 minore
ASCII art 1 1 minore
Frame senza titolo 1 1 minore

Inizio argomento

Inizio documento [ i ]

Valid XHTML 1.0 Strict

Sito realizzato da: Caiazzo Anna, Infurna Giulia e Russo Alberto.