Documento senza titolo

Linee guida per l'accessibilità ai contenuti del Web

Linea guida 1. Fornire alternative equivalenti al contenuto audio e visivo.

1.1 Fornire un equivalente testuale per ogni elemento non di testo

Nella homepage del sito e nelle altre sezioni analizzate l'utilizzo dell'attributo "alt" avviene raramente. Le notizie in prima pagina che vengono modificate di giorno in giorno risultato sempre sprovviste di un'adeguata descrizione, ad esempio:

<img alt="" src="http://www.rai.it/SITITG/Static/immagine/11/CarabinieriTerrorismo.jpg" height="115" width="350"/>

Inoltre le sezioni "chi siamo" e "redazioni" presentano numerose immagini sprovviste di tale attributo:

<IMG src="http://www.rai.it/SITITG/Static/immagine/1/direttoretg3.gif">
<IMG src="http://www.rai.it/SITITG/Static/immagine/4/burzio.gif">
<IMG src="http://www.rai.it/SITITG/Static/immagine/34/prodiinternet.jpg">

Tali immagini sono provviste di un commento testuale a fianco, però essendo sprovviste dell'attributo "alt" non sono leggibili tramite un lettore di schermo.

Linea guida 2. Non fare affidamento sul solo colore

2.1 Assicurarsi che tutta l'informazione veicolata dal colore sia disponibile anche senza.

Nel caso in cui venga utilizzato un monitor in B&N tutte le informazioni vengono rappresentate in modo chiaro e leggibile.

2.2 Assicurarsi che le combinazioni fra colori dello sfondo e del primo piano forniscano un sufficiente contrasto.

La scelta di colori presenta sfondi con varie gradazioni di blu su scritte bianche o scritte nere su sfondo bianco, che garantiscono un buon contrasto rendendo le informazioni facilmente fruibili.

Linee guida 3. Usare marcatori e fogli di stile e farlo in modo appropriato.

3.1 Quando esiste un linguaggio di marcatori adatto, per veicolare informazione usare un marcatore piuttosto che le immagini.

Alcune scritte che rappresentano il titolo di una sezione vengono rappresentate tramite un'immagine invece di un testo con fogli di stile.
Analizzando tali pagine con un lettore di schermo non si può capire il contesto in cui ci si trova, vista inoltre la mancanza di una relativa descrizione dell'immagine. (v. punti 1.1).

3.2 Creare documenti che facciano riferimento a grammatiche formali pubblicate.

L'intestazione del documento fa correttamente riferimento a un DTD pubblicato con relativa lingua:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

3.3 Usare fogli di stile per controllare l'impaginazione e la presentazione.

In varie parti del codice viene utilizzato l'attributo FONT al posto di una migliore strutturazione tramite i fogli di stile:

<FONT size=2><EM>Guarda il video di test</EM></FONT>

3.4 Usare unità relative e non assolute nei valori degli attributi del linguaggio dei marcatori e i valori della proprietà del foglio di stile.

Sia nel codice delle pagine analizzate che nel CSS vengono utilizzate unità di misura assulute (px) invece di unità relative (em):

<td width="128" height="16"><a href="/SITOTG/TG3_pagina/0,8769,28,00.html" class="linkmenu">

#contbarra {background-image: url(/SITITG/r2003/sfondobarra.gif);
padding:0 0 0 2px;
width:760px;
border-collapse:collapse;
margin:0;

Tale uso delle unità assolute potrebbe causare un'impropria visualizzazione della pagina per utenti che utilizzino una risoluzione di schermo non adatto a questo tipo di misure. Le misure assolute possono essere usate solo quando il tipo di strumento di visualizzazione è compatibile con quest'ultime.

3.5 Usare elementi di intestazione per veicolare la struttura del documento e usarli in modo conforme alle specifiche.

Gli elementi di intestazione vanno usati in modo tale che siano in successione e senza delle interruzioni (es. h2 deve seguire h1, non posso passare da h1 ad h3)
Nel sito del TG3 in tutte le pagine analizzate h1 è stato saltato e vengono citati solo h2 ed h3, ciò non corrisponde alle specifiche.

3.6Marcare le liste ed elencare le voci della lista in modo appropriato.

Le liste <ul> vengono correttamente usate nel box relativo ai titoli delle notizie, come riportato in seguito:

<ul>
 <li><span class="evide">AFGHANISTAN, UCCISO DADULLAH</span><br/>UCCISO IL CAPO DEI TALEBANI DADULLAH...</li> 
 
 <li><span class="evide">"ASCOLTARE LA VOCE DELLE PIAZZE"</span><br/>DOPO LE MANIFESTAZIONI DI ROMA. CASINI..</li> 
 
 <li><span class="evide">LA GUERRA DEI RIFIUTI</span><br/>CONTINUANO I PRESIDI DEI CITTADINI A SERRE NEL SALERNITANO...</li> 
 
 <li><span class="evide">PUTIN RE DEL GAS</span><br/>MOSCA METTE A SEGNO UN ALTRO COLPO NELLA GUERRA DEL GAS</li> 
</ul>

Linea guida 4. Chiarire l'uso di linguaggi naturali.

4.1 Identificare con chiarezza i cambiamenti nel linguaggio naturale del testo di un documento.

Il sito è stato puramente realizzato per un'utenza italiana, quindi non necessita di specifiche sul cambio di linguaggio tramite l'attributo "lang".

Linea guida 5. Creare tabelle che si trasformino in maniera elegante.

5.3 Non usare tabelle per impaginazioni a meno che la tabella non sia comprensibile se letta in modo linearizzato.

Tutte le pagine del sito in questione utilizzano erroneamente delle tabelle per suddividere la pagina in varie sezioni, ossia come elemento strutturale piuttosto che tabella di dati. Come esempio si riporta la barra superiore:

<table cellspacing="0" cellpadding="0" id="barrasup" summary="menu di navigazione superiore">
<tr>

<td><a href="http://www.rai.it/tv">TV</a></td>
<td><a href="http://www.radio.rai.it">RADIO</a></td>
<td><a href="http://www.rai.it/news">NEWS</a></td>
<td><a href="http://www.community.rai.it">COMMUNITY</a></td>

<td><a href="http://www.junior.rai.it">JUNIOR</a></td>
<td><a href="http://www.teche.rai.it">TECHE</a></td>
<td><a href="http://www.rai.it/mappasiti">MAPPASITI</a></td>
<td><a href="http://www.rai.it/programmiaz">PROGRAMMI A-Z</a></td>
</tr>
</table>

Linea guida 6. Assicurarsi che le pagine che danno spazio a nuove tecnologie si trasformino in maniera elegante.

6.1 Organizzare i documenti in modo che possano essere letti senza i fogli di stile.

Togliendo i fogli di stile il sito risulta comunque leggibile e organizzato.

6.3 Assicurarsi che le pagine siano utilizzabili quando script, applet, o altri oggetti di programmazione sono disabilitati oppure non supportati.

In varie pagine vengono utilizzati degli script relativi a vari banner rappresentati con gif animate. Disabilitando gli script le pagine risultano ugualmente friubili. inoltre nel codice è presente anche l'elemento NOSCRIPT in modo da fornire un collegamento testuale nel caso in cui il javascript sia disabilitato o non supportato.

Linea guida 7. Assicurarsi che l'utente possa tenere sotto controllo i cambiamenti di contenuto nel corso del tempo.

7.3 Fino a quando gli interpreti non permetteranno agli utenti di bloccare il contenuto in movimento, evitare il movimento nelle pagine.

banner oasi

Le gif animate con testo ed immagini in movimento,presenti in quasi tutte le pagine, potrebbero causare problemi di lettura ad utenti disabili.
Inoltre tali immagini non sono leggibili tramite un lettore di schermo.

Linea guida 8. Assicurare l'accessibilità diretta delle interfacce utente incorporate.

8.1 Fare in modo che elementi di programmi come script e applet siano direttamente accessibili o compatibili con le tecnologie assistive.

video tg3

Dal sito è possibile consultare i video delle ultime edizioni del tg3, i quali presentano una propria interfaccia funzionale e accessibile.

Linea guida 9. Progettare per garantire l'indipendenza da dispositivo.

9.2 Assicurarsi che ogni elemento che possiede una sua specifica interfaccia possa essere gestito in una modalità indipendente da dispositivo.

Il sito è predisposto per una navigazione tramite tastiera e mouse, si può comunque accedere ai vari link anche senza l'utilizzo di quest'ultimo grazie alle freccie della tastiera per lo scorrimento della pagina e tramite il tasto TAB per la selezione del collegamento desiderato.

Linea guida 10. Usare soluzioni provvisorie.

10.1 Fino a quando gli interpreti non permetterano agli utenti di bloccare la generazione di nuove finestre, non fare apparire finestre a cascata o di altro tipo e non cambiare la finestra attiva senza informare l'utente.

Il sito presenta numerose gif animate impostate tramite un javascript che, cliccandoci sopra, generano una nuova finetra relativa al link senza avvisare l'utente in alcun modo. Inoltre cliccando sul link "news" posto nella barra superiore, oltre ad aprire il collegamento richiesto, viene aperta una nuova finestra di pop-up pubblicitarià senza che l'utente lo abbia richiesto.

Linea guida 11. Usare le tecnologie e le raccomandazioni del W3C.

Le raccomandazioni del w3c sono seguite soltanto in parte e vari elementi e attributi non rispettano gli standard (come spiegato nelle altre linee guida). Anche disabilitando gli script o qualora questi non siano supportati dal browser l'accessibilità del sito rimane inalterata. Sono inoltre implementati del filmati visualizzabili solo disponendo del relativo real plug-in.

Linea guida 12. Fornire informazione per la contestualizzazione e l'orientamento.

12.2 Descrivere lo scopo dei frame e il modo in cui essi interagiscono se non è evidente dai titoli dei frame da soli.

I frames permettono di suddividere la finestra del browser in sezioni separate, ciascuna delle quali può essere aggiornata e contenere dati in modo autonomo rispetto alle altre, risultando perciò un'ottima soluzione per la strutturazione del sito. Il sito in questione invece è erroneamente strutturato tramite tabelle, come spiegato al punto 5.3

12.3 Dividere grandi blocchi di informazione in gruppi più maneggevoli quando è naturale ed appropriato.

In Html è possibile usare OPTGROUP per raggruppare gli elementi OPTION all'interno di un SELECT, oppure raggruppare i controlli dei moduli con FIELDSET e LEGEND. Tali elementi non vengono usati nel sito in questione.

12.4 Associare esplicitamente le etichette ai loro controlli.

Bisognava utilizzare dove opportuno l'elemento Label, il quale consente di associare logicamente un'etichetta ad un campo di input.
Per farlo è necessario che il valore dell'attributo "for" di label coincida con il valore dell'attributo "id" di input: in questo modo si stabilisce un legame logico tra i due elementi, e questo legame può essere sfruttato dai browser in fase di rendering.

<FORM NAME="ricerca" ACTION="http://ricerca.rai.it/RaiSearch.asp">
<fieldset>
...
<label for="ricerca">ricerca:</label>
<input type="text" id="ricerca" name="titolo" size="60"/>

Linea guida 13. Fornire chiari meccanismi di navigazione.

13.1 Identificare con chiarezza l'obiettivo di ogni collegamento.

Nel sito sono presenti numerose immagini con annesso un link ad un sito esterno, le quali però non presentano nessun attributo che dia una chiara spiegazione del collegamento associato.

13.2 Fornire metadata per aggiungere informazione di tipo semantico alle pagine e ai siti.

Viene utilizzato l'elemento Title però non è presente il metadata RDF per indicare l'autore del sito.

13.3 Fornire informazione sulla configurazione generale di un sito (per es., una mappa oppure un indice del sito).

Nella barra superiore sono presenti due link denominati "mappasiti" e "programmi a-z" che dovrebbero soddisfare tale linea guida, purtroppo nei giorni in cui sono state analizzate tali pagine, i link corrispondenti non erano presenti.

13.7 Se sono fornite funzionalità di ricerca, rendere possibili diversi tipi di ricerca per differenti livelli di abilità e per preferenze diverse.

Il sito è predisposto di un unico form per la ricerca dove è possibile limitare quest'ultima ad un'unico sito tra quelli elencati oppure eseguire una ricerca generale.

Linea guida 14. Assicurarsi che i documenti siano chiari e semplici.

14.1Usare il linguaggio più chiaro e semplice possibile che sia adatto al contenuto di un sito.

Il sito utilizza un linguaggio chiaro e facilmente comprensibile ,non sono necessarie conoscenze particolari.

Relazioni per il Corso di Progettazione siti web

[ Homepage | Simulazione euristica TG2 | Valutazione euristica TG2 ]

[ Valutazione conformità TGR | Valutazione conformità TG3 | User testing TG2 ]

Valutazione della conformità Tg3

Introduzione