Valutazione Linee guida
Valutazione percepibilità
Con percepibile, si intende che tutte le informazioni e i contenuti dell'interfaccia mostrata all'utente possano essere apprese senza eventuali discriminazioni nel caso di disabilità dell'utente;
Linea guida 1.1 Alternative Testuali
Linea guida 1.1.1
Il sito web deve fornire delle alternative testuali per ogni informazione non in formato testuale, facendo si che tale contenuto possa essere rilevato e trasmetto da tecnologie assistive (quali lettori di schermo, schermi Braille, ...)
Nel sito preso in considerazione tutte le pagine non seguono questa linea guida, tutte le immagini mostrate all'utente non sono fornite di descrizione (mancanza del campo alt nel codice):
Per risolvere questo problema basta fornire un'alternativa testuale per ogni immagine utilizzando il campo alt per ogni immagine, esempio:
Linea guida 1.2 Alternative di media temporizzati
Linea guida 1.2.1 Alternative ad audio e video
Il sito web deve fornire delle alternative ad audio preregistrato e delle alternative a video preregistrato.
Nel sito analizzato non vi sono contenuti di solo audio o solo video preregistrati
Linea guida 1.2.2 Utilizzo di captions
Deve essere fornita una descrizione audio dei contenuti di tipo time-based.
Nel sito web non è mai fornita una descrizione audio dei contenuti di tipo time-based.
Linea guida 1.2.4 Live captions (AA Level)
In eventuale contenuto trasmesso in diretta devono essere fornite delle captions in diretta.
Non è stato possibile verificarlo sul sito analizzato in quanto non vi sono video in diretta presenti. (o perlomeno non ne abbiamo trovati al momento dell analisi)
Linea guida 1.2.4 Descrizione audio di contenuto video preregistrato (AA Level)
Devono essere fornite delle descrizioni audio del contenuto video preregistrato.
Nei contenuti video presenti sul sito non vi sono descrizioni audio del contenuto.
Linea guida 1.3 Adattabile
Il contenuto mostrato all'utente deve poter essere mostrato in maniere diverse con possibili cambi di layout senza perdita di informazione o struttura.
Linea guida 1.1.1
Linee guida per un utilizzo corretto delle componenti del codice.
Il campo di ricerca non è struttrato nel modo corretto, non è stata fornita una label
Possibile soluzione:
Linea guida 1.3.2 Corrette sequenze
Nel caso in cui del contenuto possa assumere diversi significati in base alla sequenza di presentazione, questa deve essere correttamente utilizzata.
Nel sito il contenuto viene presentato correttamente, non vi sono line spacing che possano infastidire l'utente, il testo viene sempre visualizzato nel corretto ordine e il contenuto mostrato a schermo è allineato al codice sorgente.
Linea guida 1.3.3 Caratteristiche sensoriali
I contenuti non devono basarsi su una sola caratteristica sensoriale per far si che tutti gli utenti possano capire tale informazione
Nel sito analizzato l'icona di notifica utilizza solamente un'immagine di una campana, simbolo che non da tutti potrebbe essere percepito correttamente.
Una possibile soluzione potrebbe essere quella di aggiungere del testo all'icona, ad esempio aggiungere la scritta "Notifiche" alla campana.
Linea guida 1.4 Semplicità nella visualizzazione e nell'ascolto
Il contenuto mostrato all'utente deve essere presentato in modo semplice e di facile percezione.
Linea guida 1.4.1 Utilizzo del colore
Il colore non deve essere utilizzato come unico elemento di differenziazione fra diversi elementi dell'interfaccia, deve esserci un buon contrasto fra elementi di diverso colore sovrapposti.
Nel sito analizzato non vi sono problemi di questo tipo, in quanto gli elementi che utilizzano differenziazioni di colore risultano sempre ben visibili, senza problemi di contrasto o di significato.
Linea guida 1.4.2 Controlli audio
Eventuali audio in riproduzione automatica non devono durare più di 3 secondi o devono essere dotati di un sistema di pausa accessibile
Non è possibile verificare questa guida linea in quanto non sono presenti audio in riproduzione automatica.
Linea guida 1.4.3 Contrasto (AA)
La rappresentazione del testo e delle immagini deve avere un contrasto di almeno 4.5:1
La maggior parte dei colori utilizzati passa il test per un livello AA (esempio immagine a sinistra) tranne i testi grigi (esempio immagine a destra), di seguito le immagini con i risultati.
Immagine articoli con testo grigio:
Linea guida 1.4.4 Testo scalabile (AA)
I contenuti testuali devono poter essere scalati fino a una magnitudo del 200 percento senza perdita di informazione o di funzionalità.
Il sito in considerazione non supera tale test in quanto il testo non viene correttamente riposizionato e richiede uno scorrimento orizzontale della pagina. Inoltre molte icone e tasti del menu superiore scompaiono dopo una magnitudo di 150 percento:
Linea guida 1.4.5 Immagini di testo non utilizzate (AA)
Il testo viene sempre rappresentato come testo e non come un'immagine di testo.
Il sito analizzato rispetta quasi sempre questa guida linea tranne in alcuni rari casi, sia nelle pubblicità che però non sono state prese in considerazione in quanto non forniscono contenuto legato al sito utile all'utente, sia in sezioni indicanti articoli speciali, esempio:
Il titolo dell'articolo riportato nell'immagine non viene mai fornito in formato puramente testuale.
Valutazione operabilità
Con operabile, si intende che la navigazione del sito web può essere effettuata dagli utenti senza eventuali discriminazioni nel caso di disabilità dell'utente.
Linea guida 2.1
Linea guida 2.1.1 Keyboard Accessible
Tutte le funzionalità del sito web sono utlizzabili tramite l'utilizzo di una tastiera, senza richiedere sequenze di pressione a tempi limitati, a meno che non sia necessario a fine dell'operazione.
Il sito preso in analisi non soddisfa tali requisiti, in quanto varie funzioni della homepage non sono selezionabili tramite tastiera, ma richiedono l'utilizzo di un mouse. Come esempio si vedano i due bottoni in alto a destra per la ricerca e per il pannello delle notifiche, questi sono selezionabili solo tramite mouse:
Per poter risolvere tale problema:
Questo permette di rappresentare il tasto di notifiche come un elemento "Button", il quale permette la selezione tramite navigazione a tastiera.
Linea guida 2.1.2 No Keyboard Trap
Utilizzando la navigazione tramite tastiera, tutte le funzioni raggiunte devono poter essere deselezionate sempre tramite l'uso degli stessi tasti di selezione.
Il sito rispetta questa linea guida, il focus è sempre spostabile liberamente per la pagina. Non vi sono situazioni di blocco.
Linea guida 2.2.1 Timing Adjustable
Tutti gli eventi e le funzioni temporizzate devono fornire un tempo adeguato agli utenti per usufruire del loro contenuto.
E' stato notato che il sito web aggiorna la pagina principale una volta ogni 12 minuti, ciò genera molta confusione durante una navigazione, facendo perdere al'utente la posizione raggiunta nello scorrimento delle informazioni. Inoltre non viene fornita la possibilità di fermare tale auto aggiornamente e non viene fornito alcun feedback dell'azione.
Linea guida 2.2.2 Pause, Stop, Hide
Per tutte le informazioni formite che lampeggiano, scompaiono o si auto updatano deve essere fornita la possibilità di fermare questi comportamente e devono essere rispettati dei valori pre determinati.
Non vi sono informazioni del sito che si comportino come sopra indicato.
Linea guida 2.3 Seizures
Nessun contenuto della pagina deve poter causare convulsioni negli utenti.
Linea guida 2.3.1 Three Flashes or Below
Tutte le immagini che contengono dei flash non devono "flashare" per più di 3 volte al secondo.
Tutti i contenuti della pagina presa in analisi rispettano questa guida linea, sono state analizzate delle immagini che cambiano nel tempo e questi cambi rispettano le regole prestabilite
Linea guida 2.4
Linea guida 2.4.1 Bypass Blocks
Deve essere implementato un meccanismo che permetta di bypassare contenuto ripetuto in diverse pagine.
Le varie sezioni del sito non sono state etichettate adeguatamente, uno screen reader non sarebbe quindi in grado di indicare la sezione in cui si trova, quindi l'utente non potrebbe muoversi velocemente fra diverse sezioni del sito già visitate.
La soluzione più diretta a questo problema sarebbe di etichettare le varie sezioni adeguatamente:
Linea guida 2.4.2 Page Title
I titoli delle varie pagine del sito devono essere differenti e descrittivi del contenuto della pagina stessa.
I titoi sono presenti negli header di ogni pagina, rispettano la regola di descrittività e non sono mai presenti dei titoli uguali. Sono però troppo estesi e non sono leggibili in quanto, ad esempio, per le pagine degli articoli il Page Title risulta essere il titolo della notizia, quindi un testo troppo lungo e su più righe.
Esempio di codice utilizzato nel sito:
homepage:
pagina articolo:
Linea guida 2.4.3 Focus Order
Se i contenuti del sito possono essere navigati in modo sequenziale, l'ordine di navigazione tramite la funzione "TAB" della tastiera, deve presentare il contenuto correttamente e ordinatamente.
Questa linea guida viene violata in quanto navigando tramite la funzione "TAB" da tastiera, dopo una navigazione delle voci del menu superiore vengono selezionate delle voci nascoste, per poi scorrere del contenuto presentato in una colonna secondaria e solo in fine navigare il contenuto principale e di maggiore significato, ovvero gli articoli elencati nella homepage.
Per risolvere tale problema basterebbe utilizzare l'attributo tabindex per poter elencare in ordine i contenuti principali da essere navigati per primi, e solo poi i secondari, evitando anche i contenuti nascosti.
Linea guida 2.4.4 Link Purpose (in context)
La funzionalità di ogni link viene brevemente descritta dal testo del link stesso a meno che il contesto del link non renda l'utilizzo ambiguo.
Nel sito non vengono rispettate le seguenti norme:
- H30: link con testi diversi fanno capo alle stesse pagine
- H24: non è mai presente del testo ausiliario che descriva i link
- H33: nessun link possiede il tag title
Esempio di link utilizzati nel sito:
Linea guida 2.4.5 Multiple Ways (AA Level)
Una pagina può essere localizzata in più di una maniera.
Le pagine del sito possono essere raggiunte correttamente in metodi diversi. Ad esempio le notizie possono essere raggiunte tramite link o tramite l'apposita funzione di ricerca. Per poter migliorare questo punto sarebbe utile aggiungere una site map ed una tabella dei contenuti.
Linea guida 2.4.6 Headings and Labels (AA Level)
Gli headings e i labels descrivono correttamente il contenuto.
Gli headings utilizzati nel sito non sono descrittivi, in quanto non risultano principalmente vuoti e solitamente contengono altri tag.
Linea guida 2.4.7 Focus Visible (AA Level)
Quando utilizzato, il focus viene correttamente mostrato sulla selezione corrente.
Non sempre il focus viene correttamente visualizzato, scorrendo la pagina a volte il focus viene spostato in menu non visibili, altre volte viene visualizzato in posizioni non molto visibili a causa del cattivo contrasto con lo sfondo (specialmente nei paragrafi con sfondo in tonalità di grigio).
Valutazione comprensibilità
Con comprensibile, si intende che le informazioni e le operazioni dell'interfaccia utente sono comprensibili.
Linea guida 3.1
Linea guida 3.1.1 Language of Page
L'impostazione della lingua predefinita delle pagine del sito web può essere determinata in modo programmatico.
Il sito web utilizza soltanto la lingua italiana, questa viene correttamente indicata all'apertura del codice HTML con il seguente codice:
Linea guida 3.1.2 Language of Parts (AA Level)
L'impostazione della lingua predefinita dei contenuti della pagina può essere determinata programmaticamente.
Questa linea guida non viene rispettata, in quanto l'attributo lang viene correttamente utilizzato soltanto all'apertura del codice HTML. Nel resto del codice non viene mai definita la lingua utilizzata.
Linea guida 3.2
Linea guida 3.2.1 On Focus
Quando un componente della pagina web riceve un focus, questo non deve effettuare un cambio di contesto.
Questa linea guida viene correttamente rispettata.
Linea guida 3.2.2 On Input
Quando viene eseguito un input, questo non provoca nessuno cambio di contesto. Se un cambio di contesto è necessario l'utente deve essere avvisato prima di tale cambio.
Questa linea guida viene correttamente rispettata.
Linea guida 3.2.3 Consistent Navigation (AA Level)
Se alcuni meccanismi di navigazione appaiono in più pagine del sito web, devono apparire sempre nello stesso ordine e devono essere sermpre utilizzabili nello stesso modo. Se prevedono dei cambi di funzionamento questi devono essere effettuati solamente dall'utente stesso.
Questa linea guida viene correttamente rispettata.
Linea guida 3.2.4 Consistent Identification (AA Level)
Se alcuni maccanismi di navigazione appaiono in più pagine del sito web, questi sono idetificati in modo univoco
Questa linea guida viene correttamente rispettata.
Linea guida 3.3
Linea guida 3.3.1 Error Identification
Se durante l'utilizzo viene rilevato in modo automatico un errore di inserimento, l'oggetto in errore viene correttamente identificato, fornendo all'utente un testo che descriva tale errore.
Questa linea guida viene correttamente rispettata.
Linea guida 3.3.2 Labels or Instructions
Il sito web fornisce delle istruzioni o delle etichette quando il contenuto richiede azioni di input da parte dell'utente.
Nel sito web vi sono pochi elementi in cui l'utente possa generare dell'input, in ognuno di questi form non vengono utilizzate ne etichette ne istuzioni sull'utilizzo. Ad esempio nella barra di ricerca:
Linea guida 3.3.3 Error Suggestion (AA Level)
Se durante l'utilizzo del sito web viene identificato un errore di inserimento che può essere corretto, viene fornito un suggerimento all'utente per risolverlo, a meno che tale suggerimento non pregiudichi la sicurezza o la finalità del contenuto.
Questa linea guida viene correttamente rispettata.
Linea guida 3.3.4 Error Prevention (AA Level)
Se il sito web prevede l'utilizzo di dati di tipo giuridico o finanziario questi dati devono essere reversibili, controllabili e confermabili.
Questa linea guida non può essere verificata sul sito web in quanto non vengono mai trattati dati di tipo giuridico o finanziario.
Valutazione robustezza
Con robusto si intende che il contenuto della pagina web deve risultare abbastanza robusto per essere interpretato in maniera affidabile mediante una vasta gamma di programmi utente, comprese le tecnologie assistive.
Linea guida 4.1
Linea guida 4.1.1 Parsing
Nella pagina web i contenuti sono implementati con l'utilizzo di tag di apertura e di chiusura, con un corretto annidamento, senza presenza di attributi duplicati e con ID unici.
Per verificare questa linea guida ci siamo appoggiati ad un validatore online per verificare la scrittura del codice. Il validatore utilizzato è https://validator.w3.org/
Sono stati rilevati 455 Errori e 10 Errori.
Per poter rispettare la linea guida bisognerebbe risolvere ogni singolo errore, andando nel dettaglio a correggere la porzione di codice affetta dallo stesso.
Linea guida 4.1.2 Name, Role, Value
Tutti gli elementi dell'interfaccia utente devono essere determinati programmaticamente tramite l'utilizzo corretto dei valori di Name Role e Value, per permettere un riconoscimento corretto da parte delle tecnologie assistive.
Il sito web analizzato non rispetta tale guida linea, ad esempio il form della barra di ricerca non viene correttamente identificato da Name Role e Value: