Salta al contenuto principale

Risultati in dettaglio




  1. Validità del codice

    Esito: NON SUPERATO

    Enunciato:

    "Realizzare le pagine e gli oggetti al loro interno utilizzando tecnologie definite da grammatiche formali pubblicate nelle versioni più recenti disponibili quando sono supportate dai programmi utente. Utilizzare elementi ed attributi in modo conforme alle specifiche, rispettandone l'aspetto semantico"

    Problemi riscontrati:

    • Homepage: in questa pagina non viene addirittura specificato il doctype. Il validatore prendendo di default il Transitional rileva 19 errori, e 3 warnings, la maggior parte dovuti ad errori su attributi non validi (perché di presentazione) o attributi alt mancanti (vedi fig.1).
    • Informazioni utili: in questa pagina viene specificato un DTD non valido nel doctype, HTML 3.2, secondo la normativa deve essere almeno 4.01 Transitional per siti già esistenti. Contiene comunque 19 errori e 10 warnings, anche questi dovuti ad attributi di presentazione non validi.
    • Calendario celebrazioni: in questa pagina il comportamento è uguale all'Homepage, ma con 28 errori ed 11 warnings.
    • Trasmissioni: nel doctype il Public Identifier specifica HTML 4.01 Transitional, ma il System Identifier è errato. Rilevati comunque 26 errori e 2 warnings.
    Soluzione:

    Copiare ed incollare il doctype corretto dal sito del w3c ed inserire lo stesso doctype in tutte le pagine, rivalidare il codice e correggere poi gli errori riscontrati, la maggior parte dovuti ad attributi non validi.

    Errori di validazione del codice

    Figura 1

    Torna all'inizio

  2. No frame

    Esito: SUPERATO

    Enunciato:

    "Non è consentito l'uso dei frame nella realizzazione di nuovi siti."

    Analisi:

    Nelle pagine analizzate non sono presenti frame.

    Torna all'inizio

  3. Alternative testuali

    Esito: NON SUPERATO

    Enunciato:

    "Fornire una alternativa testuale equivalente per ogni oggetto non di testo presente in una pagina e garantire che quando il contenuto non testuale di un oggetto cambia dinamicamente vengano aggiornati anche i relativi contenuti equivalenti predisposti; l'alternativa testuale equivalente di un oggetto non testuale deve essere commisurata alla funzione esercitata dall'oggetto originale nello specifico contesto."

    Problemi riscontrati:

    • Homepage: Utilizzando Wave e juicystudio/image è possibile notare che 6 immagini (per la precisione mappe immagine) non hanno un testo alternativo, e sono dei link importanti (vedi fig.2), inoltre disabilitando le immagini nel browser, si può notare come la home page del sito sia praticamente inutilizzabile (vedi fig.3).
    • Informazioni Utili: Anche in questa pagina ci sono delle immagini (2) in cui non è stato specificato l' attributo alt.
    • Calendario celebrazioni: Le immagini di questa pagina sono fornite di attributo alt, ma la descrizione della foto di Benedetto XVI poteva essere più curata.
    • Trasmissioni: il pallino cerchiato di rosso nella fig.4 utilizzato nella tabella per indicare il giorno di messa in onda di un programma è sprovvista di attributo alt, ed anche uno spacer ne è sprovvisto. Una soluzione consiste nel realizzare in maniera più opportuna la tabella della programmazione radio utilizzando i th per le intestazioni.
    Soluzione:

    Controllare che tutte le immagini abbiano l'attributo alt, specificando per le immagini funzionali una descrizione adeguata e per le immagini decorative, "spacer" o un alt vuoto.

    Mancanza di testo alternativo su alcune mappe immagine

    Figura 2

    Homepage inutilizzabile in assenza di immagini

    Figura 3

    Pallino senza testo alternativo, nella tabella

    Figura 4

    Torna all'inizio

  4. Colore

    Esito: SUPERATO

    Enunciato:

    "Garantire che tutti gli elementi informativi e tutte le funzionalità siano disponibili anche in assenza del particolare colore utilizzato per presentarli nella pagina."

    Analisi:

    Disattivando i colori, è possibile usufruire comunque dei contenuti delle pagine in esame, in particolare non sono presenti casi simili a "clicca sul link verde".

    Torna all'inizio

  5. Scritte lampeggianti

    Esito: SUPERATO

    Enunciato:

    "Evitare oggetti e scritte lampeggianti o in movimento le cui frequenze di intermittenza possano provocare disturbi da epilessia fotosensibile o disturbi della concentrazione, ovvero possano causare il malfunzionamento delle tecnologie assistive utilizzate; qualora esigenze informative richiedano comunque il loro utilizzo, avvertire l'utente del possibile rischio prima di presentarli e predisporre metodi che consentano di evitare tali elementi."

    Analisi:

    Nelle pagine analizzate non sono presenti oggetti e scritte lampeggianti.

    Torna all'inizio

  6. Contrasto

    Esito: NON SUPERATO

    Enunciato:

    "Garantire che siano sempre distinguibili il contenuto informativo (foreground) e lo sfondo (background), ricorrendo a un sufficiente contrasto (nel caso del testo) o a differenti livelli sonori (in caso di parlato con sottofondo musicale); evitare di presentare testi in forma di immagini".

    Problemi riscontrati:

    I colori utilizzati per le scritte sono #663300, #6B3506, #000000, per lo sfondo viene invece utilizzata un'immagine che contiene al suo interno i seguenti colori #fbd6a2, #e2c289, ed alcune tonalità intermedie.

    TABELLA
    RIASSUNTIVA
    Colore in Primo Piano
    #663300 #6B3506 #000000
    Colore di
    Sfondo
    #fbd6a2 Lum: 158.7 (OK) – Col: 474 (NO) Lum: 155.3 (OK) – Col: 461 (NO) Lum: 219.1 (OK) – Col: 627 (OK)
    #e2c289 Lum: 136.6 (OK) – Col: 404 (NO) Lum: 133.2 (OK) – Col: 391 (NO) Lum: 197.0 (OK) – Col: 557 (OK)

    Legenda tabella

    Lum: Differenza di Luminosità, Col: Differenza di Colore

    Conclusioni:

    La maggior parte del sito è costituita da tonalità di marrone nelle scritte sul sfondo (costituito dall'immagine), in questo caso vengono soddisfatti i requisiti di differenza di Luminosità ma non di differenza di Colore (in quanto <500), quando invece le scritte sono nere, il requisito è soddisfatto.

    Soluzione:

    Non utilizzare un immagine per lo sfondo, per di più con vari colori, ed utilizzare tonalità di colore che abbiano una maggior differenza di colore.

    Sfondo  del sito

    Sfondo del sito

    Torna all'inizio

  7. Mappe immagine (client)

    Esito: SUPERATO

    Enunciato:

    "Utilizzare mappe immagine sensibili di tipo lato client piuttosto che lato server, salvo il caso in cui le zone sensibili non possano essere definite con una delle forme geometriche predefinite indicate nella DTD adottata."

    Analisi:

    Delle pagine analizzate, solo la Homepage contiene mappe immagine, che sono di tipo client e non di tipo server, per questo il requisito viene ritenuto soddisfatto. Viene utilizzato il tag AREA per delimitare la zona, e l'attributo usemap. Riguardo alla mancanza di alcuni attributi alt, si rimanda invece al Requisito 1.

    Codice delle mappe immagine

    Figura 5

    Torna all'inizio

  8. Mappe immagine (server)

    Esito: NON APPLICABILE

    Enunciato:

    "In caso di utilizzo di mappe immagine lato server, fornire i collegamenti di testo alternativi necessari per ottenere tutte le informazioni o i servizi raggiungibili interagendo direttamente con la mappa."

    Problemi riscontrati:

    Le pagine analizzate non contengono mappe immagine di tipo server.

    Torna all'inizio

  9. Tabelle dati

    Esito: NON SUPERATO

    Enunciato:

    "Per le tabelle dati usare gli elementi (marcatori) e gli attributi previsti dalla DTD adottata per descrivere i contenuti e identificare le intestazioni di righe e colonne."

    Problemi riscontrati:

    Nella pagina delle trasmissioni on demand è presente una tabella dati, contenente la griglia della programmazione settimanale, analizzando il codice sorgente , e con la collaborazione del bookmarklet tablet inspector, si è constatato che la tabella non supera il requisito in quanto non utilizza i tag: summary e th per le intestazioni, e gli attributi scope e headers.

    Soluzione:

    Ristrutturare la tabella inserendo i tag e gli attributi sopra riportati.

    Torna all'inizio

  10. Tabelle dati

    Esito: NON SUPERATO

    Enunciato:

    "Per le tabelle dati usare gli elementi (marcatori) e gli attributi previsti nella DTD adottata per associare le celle di dati e le celle di intestazione che hanno due o più livelli logici di intestazione di righe o colonne."

    Problemi riscontrati:

    Vedi requisito 9

    Torna all'inizio

  11. Fogli di stile

    Esito: NON SUPERATO

    Enunciato:

    "Usare i fogli di stile per controllare la presentazione dei contenuti e organizzare le pagine in modo che possano essere lette anche quando i fogli di stile siano disabilitati o non supportati."

    Problemi riscontrati:

    Il sito non utilizza fogli di stile, ma in qualche pagina viene utilizzato il tag style per definire alcune (poche) regole (vedi fig.6). Non vengono separati i contenuti dalla presentazione, in quanto vengono utilizzati abbondantemente i tag font, i, b, ecc… direttamente nel contenuto (vedi fig.7). Per questi motivi il requisito non è soddisfatto.

    Soluzione:

    Utilizzare un foglio di stile esterno, rimuovere tutti i tag html di presentazione, e utilizzare le regole css.

    Codice senza foglio di stile CSS

    Figura 6

    Codice html con markup di presentazione

    Figura 7

    Torna all'inizio

  12. Layout liquido

    Esito: NON SUPERATO

    Enunciato:

    "La presentazione e i contenuti testuali di una pagina devono potersi adattare alle dimensioni della finestra del browser utilizzata dall'utente senza sovrapposizione degli oggetti presenti o perdita di informazioni tali da rendere incomprensibile il contenuto, anche in caso di ridimensionamento, ingrandimento o riduzione dell'area di visualizzazione o dei caratteri rispetto ai valori predefiniti di tali parametri."

    Problemi riscontrati:

    Nel sito vengono utilizzati valori assoluti e non relativi come % ed em. Inoltre facendo un test con la risoluzione 800x600 la pagina della Home non si adatta alla finestra ma compare la barra di scorrimento orizzontale (vedi fig.8).

    Soluzione:

    Utilizzare valori relativi per il layout , il testo e le tabelle.

    Homepage con barre di scorrimento orizzontale

    Figura 8

    Torna all'inizio

  13. Tabelle layout

    Esito: NON SUPERATO

    Enunciato:

    "In caso di utilizzo di tabelle a scopo di impaginazione, garantire che il contenuto della tabella sia comprensibile anche quando questa viene letta in modo linearizzato e utilizzare gli elementi e gli attributi di una tabella rispettandone il valore semantico definito nella specifica del linguaggio a marcatori utilizzato."

    Problemi riscontrati:

    Pressoché tutto il sito utilizza tabelle di layout, spesso però non in modo esatto. Sebbene non vengano giustamente utilizzati i tag summary, th ed headers, si può notare che linearizzando la pagina della home (vedi fig.9), si perde ogni ordine logico dato alle sequenze di link, trovandoci di fronte ad una serie di link "sparsi", senza poter comprendere la connessione logica che c'è tra il link attuale e quello precedente ed il successivo. Questo può creare confusione nell'utente. Stesso discorso per la pagina delle trasmissioni On Demand come si può notare dalla figura 10.

    Soluzione:

    Evitare l'uso di tabelle di layout privilegiando il css, in quanto rendono più lento il caricamento della pagina, e possono linearizzarsi male, come infatti è accaduto.

    Homepage mal linearizzata

    Figura 9

    Pagina Trasmissioni On Demand mal linearizzata

    Figura 10

    Torna all'inizio

  14. Form

    Esito: NON SUPERATO

    Enunciato:

    "Nei moduli (form), associare in maniera esplicita le etichette ai rispettivi controlli, posizionandole in modo che sia agevolata la compilazione dei campi da parte di chi utilizza le tecnologie assistive."

    Problemi riscontrati:

    Tra le pagine analizzate, l'unica form presente è nella Homepage (vedi fig.11). Non viene utilizzato il tag <label for> accompagnato da <id>, oltre a lasciare vuoto il campo title. In aggiunta, nel caso di campi di testo è consigliato mettere l'etichetta a sinistra (qui è a destra) rispetto al campo di testo. (viceversa per radio button e checkbox)

    Soluzione:

    Si consiglia di spostare l'etichetta a sinistra, di utilizzare il tag <label for> e <id>, compilare <title>

    Mancato utilizzo del tag <label> nella form di ricerca

    Figura 11

    Torna all'inizio

  15. Script

    Esito: NON SUPERATO

    Enunciato:

    "Garantire che le pagine siano utilizzabili quando script, applet, o altri oggetti di programmazione sono disabilitati oppure non supportati; ove ciò non sia possibile fornire una spiegazione testuale della funzionalità svolta e garantire una alternativa testuale equivalente, in modo analogo a quanto indicato nel requisito nº 3."

    Problemi riscontrati:

    Disabilitando il codice javascript nella Homepage, l'unico cambiamento riscontrato riguarda i link di forma circolare al centro della pagina, dove con il codice abilitato e passandoci sopra con il mouse, compariva il nome del link, mentre adesso passando sopra con il mouse rimane la figura e non compaiono le scritte. Tuttavia la pagina rimane comunque navigabile, verificando sia con jaws che con Wave (vedi fig.12) che le immagini "fornite" di javascript hanno un alternativa testuale sufficiente , come richiede il requisito. Nella pagina delle trasmissioni OnDemand invece, disabilitando javascript si può notare come scompaia quasi del tutto la tabella dei programmi, e non è stata fornita un alternativa testuale. Un altro problema riscontrato in questa pagina ed in quella del calendario è la scomparsa della Freccia SU posta in cima alla pagina (vedi fig.13).

    Soluzione:

    Non utilizzare javascript per creare la tabella, ed utilizzare i tag <noscript> </noscript> per inserire un alternativa testuale al codice javascript che sia ugualmente efficace.

    Nella homepage le immagini con Javascript hanno testo alternativo

    Figura 12

    Nella pagina On Demand non è fornita l'alternativa testuale

    Figura 13

    Torna all'inizio

  16. Eventi

    Esito: NON SUPERATO

    Enunciato:

    "Garantire che i gestori di eventi che attivano script, applet o altri oggetti di programmazione o che possiedono una propria specifica interfaccia, siano indipendenti da uno specifico dispositivo di input."

    Problemi riscontrati:

    Come si può notare dalla fig.14, i gestori di eventi ONMOUSEOVER e ONMOUSEOUT non sono associati ad ONFOCUS e ONBLUR rispettivamente. In questo modo i gestori di eventi non sono indipendenti da uno specifico dispositivo. Infatti navigando il sito con la tastiera, nei link a forma di cerchio non si attiva il javascript che fa comparire il nome del link.

    Soluzione:

    Associare i tag sopra elencati.

    Errato utilizzo dei gestori di eventi ONMOUSEOVER e ONMOUSEOUT

    Figura 14

    Torna all'inizio

  17. Script, applet, PDF, ...

    Esito: NON APPLICABILE

    Enunciato:

    "Garantire che le funzionalità e le informazioni veicolate per mezzo di oggetti di programmazione, oggetti che utilizzano tecnologie non definite da grammatiche formali pubblicate, script e applet siano direttamente accessibili."

    Problemi riscontrati:

    Non ci sono informazioni veicolate per mezzo di oggetti di programmazione. Per Javascript, vedere il punto precedente.

    Torna all'inizio

  18. Multimediale

    Esito: NON SUPERATO

    Enunciato:

    "Nel caso in cui un filmato o una presentazione multimediale siano indispensabili per la completezza dell'informazione fornita o del servizio erogato, predisporre una alternativa testuale equivalente, sincronizzata in forma di sotto-titolazione o di descrizione vocale, oppure fornire un riassunto o una semplice etichetta per ciascun elemento video o multimediale tenendo conto del livello di importanza e delle difficoltà di realizzazione nel caso di trasmissioni in tempo reale."

    Problemi riscontrati:

    Nella pagina Calendario, sono presenti dei link a dei video che vengono gestiti tramite un plugin del browser. Nessuno dei video ha un alternativa testuale, né in forma riassuntiva sul contenuto del video, né come didascalie (vedi fig.15). Nella pagina OnDemand, è possibile scaricare dei file .ram contenenti le registrazioni audio dei programmi radio, anche in questo caso non è presente la trascrizione testuale del contenuto. In entrambi i casi poi, non vengono date informazioni sul plugin che dovrà gestire i file multimediali (come ad esempio un link per scaricarlo).

    Soluzione:

    Assicurarsi di specificare un alternativa testuale per ogni contenuto multimediale

    Contenuti video senza testo alternativo

    Figura 15

    Torna all'inizio

  19. Link non ambigui

    Esito: NON SUPERATO

    Enunciato:

    "Rendere chiara la destinazione di ciascun collegamento ipertestuale (link) con testi significativi anche se letti indipendentemente dal proprio contesto oppure associare ai collegamenti testi alternativi che possiedano analoghe caratteristiche esplicative, nonché prevedere meccanismi che consentano di evitare la lettura ripetitiva di sequenze di collegamenti comuni a più pagine."

    Problemi riscontrati:

    Nella pagina Celebrazioni, si può notare la violazione di questo requisito (vedi fig.16), in quanto i link sulla colonna di sinistra come ad esempio "Video" se letti fuori dal contesto non si riescono a distinguere. Inoltre nessuno di quei link ha il tag title per specificare il contenuto della destinazione, si potrebbe specificare ad esempio che si aprirà un file PDF cliccando su un determinato link. In nessuna pagina è presente lo skip-link, anche se in realtà per come è strutturato il sito non è necessario, in quanto in ogni pagina non sono presenti liste di link che si ripetono, ma i link indietro (per tornare alla pagina precedente e su per tornare alla home).

    Soluzione:

    Rinominare correttamente tutti i link poco informativi (ad esempio: "Video" in "Video della Solennità dell'Epifania del Signore" ) ed utilizzare i tag title. Se si aprono file PDF (o casi simili) andrebbe specificato.

    Link ambigui nella pagina celebrazioni

    Figura 16

    Torna all'inizio

  20. Temporizzazioni

    Esito: NON APPLICABILE

    Enunciato:

    "Nel caso che per la fruizione del servizio erogato in una pagina è previsto un intervallo di tempo predefinito entro il quale eseguire determinate azioni, è necessario avvisare esplicitamente l'utente, indicando il tempo massimo consentito e le alternative per fruire del servizio stesso."

    Problemi riscontrati:

    Non sono previste temporizzazioni nelle pagine analizzate

    Torna all'inizio

  21. Link distanti

    Esito: SUPERATO

    Enunciato:

    "Rendere selezionabili e attivabili tramite comandi da tastiere o tecnologie in emulazione di tastiera o tramite sistemi di puntamento diversi dal mouse i collegamenti presenti in una pagina; per facilitare la selezione e l'attivazione dei collegamenti presenti in una pagina è necessario garantire che la distanza verticale di liste di link e la spaziatura orizzontale tra link consecutivi sia di almeno 0,5 em, le distanze orizzontale e verticale tra i pulsanti di un modulo sia di almeno 0,5 em e che le dimensioni dei pulsanti in un modulo siano tali da rendere chiaramente leggibile l'etichetta in essi contenuta."

    Analisi:

    I link delle pagine analizzate sono tutti abbastanza grandi e distanziati, per poter essere agevolmente cliccati, in particolare quelli della pagina Informazioni Utili.

    Torna all'inizio

  22. Pagine equivalenti

    Esito: NON SUPERATO

    Enunciato:

    "Per le pagine di siti esistenti che non possano rispettare i suelencati requisiti (pagine non accessibili), in sede di prima applicazione, fornire il collegamento a una pagina conforme a tali requisiti, recante informazioni e funzionalità equivalenti a quelle della pagina non accessibile ed aggiornata con la stessa frequenza, evitando la creazione di pagine di solo testo; il collegamento alla pagina conforme deve essere proposto in modo evidente all'inizio della pagina non accessibile."

    Problemi riscontrati:

    Il sito viola molti punti della legge stanca, e non prevede un link ad una versione accessibile dei contenuti.

    Soluzione:

    Applicando dei semplici accorgimenti (vedi soluzioni dei requisiti precedenti) si potrebbe rendere accessibile il sito esistente, senza dover fornire una versione accessibile parallela al sito attuale.

    Torna all'inizio