Simulazione euristica guidata da barriere per la verifica dell'accessibilità

Un metodo, alternativo alla verifica di conformità e per certi versi più efficace, per verificare lo stato di accessibilità di un sito.

Indice sinottico

  1. Introduzione
  2. Categorie di utenti
  3. Le possibili barriere
  4. Come procedere
  5. Assegnazione di livelli di gravità ai problemi
  6. Rapporto da produrre
  7. Bibliografia
  8. Tabelle di supporto per l'analisi

Lo scopo di questo documento è di descrivere un metodo per svolgere indagini di accessibilità. Il metodo è stato finora usato solo dall'autore e dai suoi studenti. A breve verrà pubblicato uno studio relativo all'efficacia del metodo.

È possibile vedere una descrizione ancora più aggiornata in inglese.

Introduzione

Questo metodo, a mio avviso, colma una lacuna nei metodi di valutazione. Da una parte c'è la valutazione della conformità rispetto ad uno standard, semplice da svolgere ma che produce risultati limitati. Dall'altro lato abbiamo la valutazione euristica e il test con utenti. Entrambe le tecniche permettono di produrre risultati molto più ricchi, ma la prima risulta di difficile applicazione data la generalità dei principi su cui si può basare. La seconda non permette di produrre solo risultati attinenti all'accessibilità, e mescola problemi di accessibilità con problemi di usabilità, come si può notare osservando i rapporti, peraltro utilissimi, prodotti dall'UIC (2005).

Infine le valutazioni informali (chiamate subjective assessments non sono molto efficaci, in quanto producono solamente opinioni degli utenti. Si noti che gli altri metodi producono anche opinioni dei valutatori ed eventualmente osservazioni dei comportamenti effettivi degli utenti.

Per maggiori dettagli si rinvia alla bibliografia di riferimento, che include (Nielsen Norman Group, 2001; Nielsen, 2002; Gray and Salzman, 1998; Dumas and Redish, 1999; Preece et al., 2002; Nielsen, 1993; Rubin, 1994; UsabilityNet, 2003; Nielsen, 1994; DRC, 2004; ITTATC, 2004).

Il metodo che qui descrivo deriva dall'adattamento della simulazione euristica dove i principi adottati vengono sostituiti da un elenco di barriere di accessibilità. Sulla loro base i valutatori esaminano le singole pagine e cercano di identificare tutte quelle che la pagina potrebbe erigere nei confronti dell'attività dell'utente disabile.

Per barriera di accessibilità si intende una qualsiasi condizione che rende difficile o impossibile il progredire verso l'ottenimento di un obiettivo da parte di una persona disabile (o disabilitata) che usa il sito mediante un qualche tipo di tecnologia (assistiva o altro). Una barriera viene descritta in termini di:

  • il tipo di utente e di disabilità
  • il tipo di tecnologia assistiva
  • il fallimento, ovvero l'attività che viene ostacolata dalla barriera, e
  • le caratteristiche della/e pagina/e che erigono lo barriera.

Le barriere elencate derivano da un'interpretazione delle linee guida e dei principi di accessibilità (ad es. WCAG 2.0) in cui si considerino anche scenari d'uso generici. Uno scenario d'uso (Rosson e Carrol, 2002; pag. 16) è una narrazione di persone e delle loro attività mentre utilizzano un sistema; esso può includere: la situazione operativa; gli attori, e le loro caratteristiche fisiche e mentali; i loro scopi e motivazioni; le loro possibili azioni e modelli mentali che suggerirebbero determinate interpretazioni; azioni e compiti (azioni che hanno un inizio e una fine osservabili); eventi esterni.

Categorie di utenti

Le categorie di utenti da considerare nell'elencare le barriere devono includere i seguenti casi, leggermente estesi da quelli di W3C/WAI (2004, p. 6); DRC (2004):

Utenti non vedenti

Utenti di lettori di schermo o di browser parlanti; utenti di barre Braille; tipicamente ciechi, talvolta ipovedenti.

Questa categoria potrebbe includere anche utenti vedenti ma costretti ad usare qualche tecnologia disabilitante: browser che non visualizzano immagini, portali vocali.

Utenti ipovedenti

Utenti ipovedenti di ingranditori di schermo; talvolta utenti degli strumenti di accessibilità offerti direttamente dal sistema operativo.

Questa categoria potrebbe includere anche utenti disabilitati da tecnologie quali cellulari e PDA con schermi ridotti, con una ridotta possibilità di interagire.

Utenti non udenti

Persone non udenti o con gravi difetti di udito.

La categoria potrebbe includere anche utenti costretti ad usare il sito in situazioni in cui l'audio non può essere sentito (ad es. in una sala lettura, durante una conferenza).

Utenti daltonici

Persone daltoniche (che non usano alcuna tecnologia assistiva).

La categoria potrebbe includere anche utenti che usano dispositivi dotati di schermi a bassa qualità, o monocromatici.

Utenti disabili motori

Persone con menomazioni fisiche per le quali l'uso del web può essere influenzato dalla mancanza di controllo muscolare o nervoso delle braccia e mani, da tremore o dalla mancanza di agilità delle dita e delle mani.

La categoria potrebbe includere persone solo temporaneamente disabili (ad es. con il braccio in gesso), oppure persone che usano il sito in posizioni inusuali (ad es. durante una presentazione in pubblico, sul podio in piedi).

Utenti disabili cognitivi

Persone con abilità limitata di elaborare e ricordare informazioni, prendere decisioni o apprendere; includono disabili nell'apprendere (dislessici o disgrafici), con disturbi nell'attenzione, con disabilità nella crescita (es. autismo, Down) o con disturbi neurologici (es. Alzheimer).

Questa categoria potrebbe includere anche persone che usano il sito sotto stress (ad es. con fretta in un ambiente rumoroso e pieno di distrazioni, o durante la guida di un'automobile).

Inoltre la categoria può includere anche visitatori del sito di una lingua straniera.

Utenti di browser senza JavaScript

Utenti di browser o sistemi che non sono in grado di elaborare istruzioni JavaScript. Ad es. microbrowser a bordo di telefonini o PDA; ad es. utenti di sistemi proxy, gateway o transcoder.

Anche agenti artificiali, come gli spider dei motori di ricerca, o i sistemi di test automatizzati, si trovano nella situazione di non poter elaborare istruzioni JavaScript.

Ovviamente altre categorie di utenti possono essere considerate, come ad es. utenti di palmari. Inoltre, per analisi più fini, è necessario anche considerare il livello di esperienza nell'uso del PC e di internet, e il livello di esperienza nel dominio in cui si colloca il sito.

La seguente lista di barriere (ispirata dai principi e scenari descritti da Pilgrim (2002); W3C/WAI (2004); DRC (2004)) è un esempio di barriere che si possono considerare in questo metodo. La lista è rappresentativa delle barriere più frequentemente incontrate da utenti disabili, ma potrebbe non essere esaustiva rispetto alle caratteristiche del sito analizzato.

Le possibili barriere

Lista di barriere per Utenti non vedenti

Categoria di utenti: Utenti di lettori di schermo o di browser parlanti; utenti di barre Braille; tipicamente ciechi, talvolta ipovedenti.Questa categoria potrebbe includere anche utenti vedenti ma costretti ad usare qualche tecnologia disabilitante: browser che non visualizzano immagini, portali vocali.

  1. Immagini ricche senza testo alternativo
  2. Mancanza di didascalie del video
  3. Colore essenziale
  4. Frame inaccessibili
  5. Materiale in movimento
  6. Immagini funzionali in sfondo
  7. Immagini funzionali prive di testo
  8. Link generici
  9. Link ambigui
  10. Menu dinamici in JavaScript
  11. Eventi mouse
  12. ASCII art
  13. Titoli spaziati
  14. Troppi link
  15. Form con redirect
  16. Link non separati
  17. Nuove finestre
  18. Form senza LABEL
  19. Temporizzazioni troppo brevi
  20. Tabelle dati
  21. Tabelle di impaginazione
  22. Pagine senza titoli
  23. Frame senza titolo
  24. Marcatura della lingua
  25. Suddivisione in sezioni
  26. Immagini come titoli
  27. Mancanza di tasti rapidi
  28. Skip links
  29. Pagina solo testo
  30. Controlli del browser disabilitati

Immagini ricche senza testo alternativo

Categoria:

Percezione

Causa:

Assenza di testo equivalente associato ad un'immagine che è latrice di informazione (es. diagramma, istogramma, foto, disegno, organigramma, grafico di una funzione, grafo).

Tipo di fallimento:

L'utente, anche se percepisce che c'è un'immagine, non ha modo di sentirne l'informazione contenuta. E inoltre rischia di perdere del tempo a cercare nel resto della pagina tale materiale.

Effetto:

L'utente non può fruire delle informazioni contenute nell'immagine. Quindi l'efficacia è fortemente compromessa. E anche la produttività rischia di essere ridotta.

Rimedio:

E' necessario aggiungere del testo equivalente al contenuto dell'immagine: usando l'attributo ALT di IMG, e se non sufficiente, usando il tag OBJECT e nel suo contenuto scrivere il testo equivalente; se ancora non sufficiente associando un link all'immagine (cioè posto nelle immediate vicinanze - o rendendo cliccabile l'immagine stessa) e predisponendo una nuova pagina con le spiegazioni dell'immagine. Un'altra strategia è di scrivere il testo equivalente a lato, o subito prima o dopo, l'immagine in modo che esso sia disponibile e visibile comunque, anche a chi vede l'immagine.

Mancanza di didascalie del video

Categoria:

Percezione

Causa:

Un file multimediale con un video o un'animazione è privo di descrizione testuale delle scene.

Tipo di fallimento:

L'utente non ha modo di percepire, tranne che per l'audio, il contenuto delle scene video.

Effetto:

Riduzione dell'efficiacia.

Rimedio:

Arricchire il materiale multimediale con descrizioni testuali sincronizzate con le scene video. Procedere ad una titolazione del filmato, arricchendo scena per scena con didascalie (descrizione testuale di eventi nella scena che sono rilevanti: ad es. la ripresa dei piedi silenziosi dell'assassino che si avvicina alle spalle della vittima). Linguaggi come SMIL devono essere usati in modo da rendere esplicita alla tecnologia assistiva la presenza di tali testi e permettono di realizzare una sincronizzazione sofisticata tra i vari canali, incluso quello testuale.

Alternativamente, o in aggiunta, predisporre del materiale audio, sempre sincronizzato al video e compatibile con le altre tracce audio eventualmente presenti, che fornisca le descrizioni mancanti (ad es. con una voce di sfondo).

Colore essenziale

Categoria:

Percezione

Causa:

La presenza di materiale (testo, immagini, sfondi, filmati) dove il colore viene usato come unico modo per distinguere due o più informazioni diverse. Ad es. righe in una tabella con dati di bilancio dove i valori positivi sono in nero e quelli negativi in rosso (senza il segno "-").

Un esempio comune è l'uso del solo colore per distinguere i link già percorsi.

Tipo di fallimento:

Ovviamente l'utente non avrà alcun modo di percepire la differenza di colori, e quindi la presenza di due informazioni differenti, che non potranno essere sfruttate in nessun modo.

Effetto:

Riduzione, anche totale, dell'efficacia.

Rimedio:

Usare, oltre al colore, anche altri mezzi per distinguere le due informazioni. Devono essere però accorgimenti che abbiano, oltre ad una manifestazione grafica non basata sul colore, anche una manifestazione uditiva; ad es. aggiungendo qualche parola, qualche carattere pronunciabile, qualche simbolo.

Frame inaccessibili

Categoria:

Percezione

Causa:

La pagina è basata su frame.

Tipo di fallimento:

Utenti di vecchie versioni di lettori di schermo (es. JAWS 3.5) non possono accedere ai singoli frame.

Effetto:

Azzeramento totale dell'efficacia.

Rimedio:

Fare in modo di togliere i frame, usando eventualmente dei DIV accoppiati ad opportune regole CSS per simularne gli effetti positivi.

Materiale in movimento

Categoria:

Percezione

Causa:

Immagini o testo in movimento (ad es. testo scorrevole, immagine animata).

Tipo di fallimento:

L'utente potrebbe non percepire (perché il lettore di schermo non glielo segnala) che l'immagine è cambiata o che il testo è cambiato da quando l'ha sentito l'ultima volta.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Evitare di usare materiale in movimento, e dare sempre all'utente la libertà di avanzare nella fruizione del materiale.

Immagini funzionali in sfondo

Categoria:

Utilizzazione

Causa:

La pagina contiene nello sfondo (ev. anche mediante regole CSS) delle immagini che nella pagina visualizzata assumono un ruolo funzionale. Ad es. corrispondono ad immagini cliccabili, a pulsanti, a etichette di controlli di form o a etichette di categorie di contenuti.

Tipo di fallimento:

L'utente non ha modo di percepire il contenuto associato all'immagine, specialmente se questa contiene del testo. Infatti non è possibile usare le normali tecniche per associare all'immagine del testo equivalente. L'unica associazione è data dalla sovrapposizione grafica.

Effetto:

Riduzione marcata dell'efficacia, dato che l'utente è costretto a cercare provando per tentativi le pagine necessarie.

Rimedio:

Rimuovere le immagini funzionali dallo sfondo e includere le informazioni importanti direttamente nell'HTML. Agire poi con il CSS per ottenere l'effetto grafico desiderato.

Immagini funzionali prive di testo

Categoria:

Utilizzazione

Causa:

La pagina contiene delle immagini funzionali (link cliccabili, pulsanti di invio per form, mappe immagine) prive di testo alternativo. Analogamente per pulsanti in Flash.

Tipo di fallimento:

L'utente è impossibilitato a capire il ruolo dell'immagine (ad es. il lettore di schermo si limita a leggere l'URL del link) e quindi a scegliere oculatamente il link o il pulsante da attivare.

Effetto:

Riduzione, anche totale, dell'efficacia.

Rimedio:

Includere nelle immagini l'attributo ALT (IMG/@ALT, AREA/@ALT) o un contenuto anche testuale per OBJECT. Fare in modo che il testo sia informativo e che quindi permetta di capire l'effetto dell'attivazione del link.

Fare questo anche per i banner pubblicitari.

Evitare l'uso di ALT="" per un'immagine cliccabile (dentro un A) dato che comunque l'elemento è raggiungibile con la tastiera.

Link generici

Categoria:

Utilizzazione

Causa:

La pagina contiene dei link con etichette poco informative (ad es. "clicca qui", "dettagli", "di più").

Tipo di fallimento:

L'utente del lettore di schermo non ha modo di selezionare il link quando esso viene proposto fuori dal contesto, in una finestra di dialogo che contiene tutti e soli i link. Ciò avviene perché il link ha un'etichetta assolutamente non informativa.

Effetto:

Riduzione drastica dell'efficacia.

Rimedio:

Modificare le etichette dei link in modo da renderle informative. Non usare "clicca qui", ma piuttosto "dettagli sul prodotto XYZ".

Link ambigui

Categoria:

Utilizzazione

Causa:

La pagina contiene dei link con etichette ambigue (ad es. "clicca qui", "dettagli", "di più" ripetuti più volte).

Tipo di fallimento:

L'utente del lettore di schermo non ha modo di selezionare il link quando esso viene proposto fuori dal contesto, in una finestra di dialogo che contiene tutti e soli i link. Ciò avviene perché tanti link hanno la stessa etichetta ed essa non permette di distinguerli.

L'utente è costretto ad esplorare ciascuno dei link (attivandolo e tornando indietro) per trovare la pagina desiderata.

Effetto:

Riduzione drastica dell'efficacia e della produttività.

Rimedio:

Modificare le etichette dei link in modo da renderle informative. Non usare "clicca qui", ma piuttosto "dettagli sul prodotto XYZ".

Se proprio ciò non fosse possibile, almenu usare l'attributo A/@TITLE per differenziare i link.

Menu dinamici in JavaScript

Categoria:

Utilizzazione

Causa:

La pagina contiene del codice JavaScript che, non appena l'utente posiziona il focus dell'interazione su un elemento, viene aperto un menu in una determinata zona della pagina.

Tipo di fallimento:

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.

Effetto:

Riduzione anche drastica dell'efficacia.

Rimedio:

Fare in modo che tutte le opzioni di navigazione e i comandi operativi (ad es. i comandi da menu) siano attivabili anche disattivando JavaScript. Magari offrendo in una sezione separata della pagina dei link o pulsanti ridondanti. Far in modo che tale pagina sia raggiungibile dalla pagina originale anche se javaScript è disabilitato.

Eventi mouse

Categoria:

Utilizzazione

Causa:

La pagina si basa su codice JavaScript per ottenere determinati effetti. Le routine vengono invocate mediante gestori di eventi legati al mouse (es. "onclick", "onmouseover", "onmouseout", ...).

Tipo di fallimento:

L'utente che usa solo la tastiera non ha modo di attivare quegli eventi, e quindi di interagire con la pagina.

Effetto:

Riduzione, anche totale, dell'efficacia.

Rimedio:

Usare anche i gestori di eventi logici ("onfocus", "onkeypress", ...).

Meglio ancora se le funzionalità fossero rese disponibili anche senza JavaScript.

ASCII art

Categoria:

Comprensione

Causa:

La pagina contiene del testo che invece di rappresentare parole, rappresenta decorazioni. Ad es. simboli come "==>" oppure uno smiley ;-) o linee orizzontali come "-----------------".

Tipo di fallimento:

L'utente si sente pronunciare i caratteri usati nel simbolo o decorazione e potrebbe non capire di cosa si tratta. Ad es. un utente non capisce cosa significa la frase "uguale uguale parentesi angolare destra" pronunciata da un lettore di schermo a fronte del testo ==>.

Certi usi di caratteri alfanumerici per scopi decorativi sono però entrati ormai nella consuetudine, e quindi sono più tollerabili. Ad es. l'uso del carattere ">" come separatore in una sequenza di link all'interno delle briciole di pane.

Effetto:

Riduzione della produttività e/o della soddisfazione.

Rimedio:

Rimuovere i simboli o le decorazioni realizzate con del testo. Eventualmente rimpiazzarle con delle immagini dotate di ALT="".

Titoli spaziati

Categoria:

Comprensione

Causa:

La pagina contiene delle parole o termini spaziati in maniera artificiosa, ad es. "B E N V E N U T I" formattato con spazi artificiali tra le lettere.

Tipo di fallimento:

Il lettore di schermo pronuncia la parola così: "bi e enne vi e enne u ti i", rendendola inintelleggibile.

Effetto:

Riduzione della produttività, soddisfazione e anche dell'efficacia (nella misura in cui le parole scritte in questo modo sono importanti per capire dove si è o cosa si sta ascoltando).

Rimedio:

Usare le regole del CSS per ottenere lo stesso effetto tipografico.

Troppi link

Categoria:

Comprensione, Controllo da parte dell'utente

Causa:

Troppi link nella pagina, talvolta non bene organizzati in gruppi.

Tipo di fallimento:

Il numero elevato di link costringe l'utente ad un'analisi lunga e faticosa di ciascuno di essi.

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 onde attivarli. Soprattutto nel caso di incertezza sulla adeguatezza della pagina rispetto all'obiettivo dell'utente, quest'ultimo è costretto a uno sforzo elevato per navigare nel sito. Il problema è acuito se i link sono male organizzati, non raggruppati in categorie, con delle etichette poco informative e/o ambigue.

Effetto:

Il problema influenza ovviamente la produttività e la soddisfazione; ma anche l'efficacia ne viene compromessa soprattutto se il problema si ripete dato che l'utente si stanca e rischia di confondersi e quindi commette più errori e la sua motivazione nell'usare il sito si riduce.

Rimedio:

Occorre riorganizzare i link suddividendoli in sezioni/categorie. Nella stessa pagina introducendo delle liste (UL) o DIV separate, introducendo dei titoli di categoria (con degli H2-H3). Eventualmente aggiungendo dei link intra-pagina (A/@href che punta ad un A/@name), eventualmente nascosti, per poter passare da un gruppo al successivo o al precedente. In pagine diverse rendendo più profondo il sito con delle pagine intermedie. Deve essere possibile per l'utente esaminare sinteticamente un blocco di link e decidere solo dal titolo del blocco se i link che esso contiene sono rilevanti o meno.

Inoltre bisogna supportare un layout liquido in modo che l'utente possa ingrandire il testo a piacimento, accorciando le righe di testo (utile per gli utenti di ingranditori di schermo) senza richiedere scrolling orizzontale.

Form con redirect

Categoria:

Utilizzazione

Causa:

La pagina contiene delle form in cui alcuni controlli (campi o menu a tendina implementati con SELECT), una volta che vengono utilizzati, causano un submit al server il quale spedisce una nuova pagina al browser. Questo comportamento è basato su gestori di eventi JavaScript.

Tipo di fallimento:

Il problema è che per l'utente, una volta scelta una voce dal menu (ad es.) il browser attende qualche secondo e poi propone la nuova pagina riposizionando il focus all'inizio. L'utente deve quindi prima capire che il browser mostra una nuova pagina quasi uguale alla precedente, e poi muovere il focus sino al punto del menu scelto in precedenza e solo dopo può continuare nella compilazione della form.

Effetto:

Riduzione anche marcata dell'efficacia e dell'efficienza. Le conseguenze si complicano se la pagina non è ben organizzata dal punto della navigazione interna (uso di H1-H2, uso di skip-links, uso di ACCESSKEY).

Rimedio:

Se possibile fare a meno dell'invio intermedio dei dati al server. Ove ciò non fosse possibile, adottare tutti gli accorgimenti necessari per limitare le conseguenze negative: usare i tag H1-H6 e DIV per suddividere in sezioni il contenuto della pagina, usare gli skip-links per permettere all'utente di saltare oltre barre di navigazione e materiale preliminare, fornire i controlli della form di ACCESSKEY per poter spostare direttamente il focus su di essi, includere le etichette dei controlli nel tag LABEL.

Link non separati

Categoria:

Utilizzazione

Causa:

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

Tipo di fallimento:

L'utente si sente pronunciare un elenco di link senza alcuna separazione o pausa tra uno e l'altro, ed avrà difficoltà nel capire dove uno finisce e l'altro inizia. Non potrà quindi facilmente capire che ci sono vari link, e dovrà faticare per attivare quello prescelto (una volta che sia stato individuato).

Effetto:

Riduzione, anche marcata, dell'efficacia.

Rimedio:

Separare i link da un carattere pronunciabile (ad es. "|", "-") o un'immagine (dotata di ALT pronunciabile). In questo modo il lettore di schermo può segnalare il passaggio da un link al successivo.

Alternativamente usare i tag UL con opportune regole CSS in modo da visualizzarli su una sola riga e senza separatori grafici.

Nuove finestre

Categoria:

Utilizzazione

Causa:

La pagina contiene del codice (HTML o JavaScript) che apre nuove finestre quando l'utente attiva dei link o pulsanti.

Tipo di fallimento:

L'utente non si accorge che il contesto di interazione è cambiato, e che quindi è cambiato sia il contenuto che i comandi possibili.

Questo è tanto più grave quanto inaspettate sono le nuove finestre (ad es. finestre pop-up che c'entrano poco con il compito dell'utente).

Anche il pulsante BACK del browser non funziona più, e questo toglie un'"ancora di salvezza" all'utente.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Evitare di aprire nuove finestre in generale.

Se lo si deve proprio fare, fare in modo che sin dall'inizio della nuova pagina sia chiaro all'utente che si tratta di una nuova finestra e dargli/le modo di chiuderla.

Form senza LABEL

Categoria:

Utilizzazione

Causa:

La pagina contiene delle form i cui controlli sono privi del corretto markup LABEL/@FOR oppure è impaginata in maniera complessa (ad es. perché impaginata con una tabella il cui contenuto non si linearizza correttamente).

Tipo di fallimento:

L'utente che usa il lettore di schermo in modalità "controlli della form" non può permettersi di scorrere avanti e indietro il focus dell'interazione perché il lettore di schermo non gli/le legge il testo associato all'etichetta del controllo focalizzato.

Se la form è impaginata in maniera complessa, allora il lettore di schermo non legge proprio il testo dell'etichetta prima di presentare all'utente la possibilità di agire sul controllo.

Ad es. tutte le etichette vengono lette una dopo l'altra e poi segue la lettura di tutti i controlli, uno dopo l'altro.

Effetto:

Riduzione marcata dell'efficacia.

Rimedio:

Aggiungere sempre il tag LABEL/@FOR attorno alle etichette di ciascun controllo. Nei casi in cui questo non è possibile usare l'attributo TITLE.

In questo modo anche il testo dell'etichetta risulta cliccabile, per controlli come radiobutton e checkbox.

Temporizzazioni troppo brevi

Categoria:

Utilizzazione

Causa:

Il comportamento del server è di causrae un refresh della pagina, magari con modifica del contenuto, senza che ci sia stato un qualche evento causato dall'utente per attivare tale comportamento.

Tipo di fallimento:

L'utente che ci mette più tempo del previsto per svolgere una determinata azione (ad es. consultare una pagina e successivamente premere un pulsante "accetto") si trova nella situazione di non poter procedere perché il sistema ha cambiato stato di propria iniziativa.

Effetto:

Riduzione anche totale dell'efficacia.

Rimedio:

Evitare le temporizzazioni automatiche che cambiano stato alla pagina senza che l'utente le abbia richieste esplicitamente.

Tabelle dati

Categoria:

Comprensione

Causa:

La pagina contiene delle tabelle dati (es. orari di autobus, calendari, elenchi, statistiche) non codificate appropriatamente (con TH/@SCOPE,@HEADERS).

Tipo di fallimento:

L'utente non può navigare tra le celle della tabella in modo che gli venga ricordato il significato di ciascuna cella (leggendo anche le intestazioni della cella).

Effetto:

Riduzione anche totale dell'efficacia.

Rimedio:

Usare i tag TH per distinguere le celle intestazione da quelle dati (TD). Usre gli attributi TH/@SCOPE o TH/@ID e TD/@HEADERS per legare in HTML le celle dati alle correspondenti celle intestazione.

Aggiungere l'attributo SUMMARY ed usare il tag CAPTION.

Tabelle di impaginazione

Categoria:

Comprensione

Causa:

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

In certi casi la tabella di layout contiene anche tag e attributi previsti solo per le tabelle dati (TH, HEADERS, SUMMARY).

Tipo di fallimento:

L'utente non capisce come le informazioni o i link sono disposti nella pagina, dato che l'ordine con cui vengono letti dal lettore di schermo differisce da quello previsto dalla gabbia grafica implementata con la tabella.

Inoltre il lettore di schermo pronuncia, per ciascuna tabella incontrata, delle frasi tipo "tabella 4 con 5 righe e 4 colonne", ..., "fine della tabella 4" che ovviamente disturbano e rallentano l'utente.

L'uso di markup previsto per le tabelle dati peggiora la situazione, dato che il lettore di schermo pronuncia ancora più parole inutili.

Effetto:

Riduzione anche marcata dell'efficacia. Riduzione lieve della produttività.

Rimedio:

Ridurre, o meglio ancora eliminare, tutte le tabelle di layout e sostituirle con corrispondenti regole CSS. Usare anche il posizionamento previsto dal CSS2.

Pagine senza titoli

Categoria:

Comprensione

Causa:

La pagina è priva di tag TITLE, o esso contiene ad es. "Untitled document", oppure ce l'ha, ma il suo valore è lo stesso per tutte le pagine.

Tipo di fallimento:

Ogni volta che l'utente cambia pagina il titolo (che appare nella barra della finestra del browser) è la prima cosa che viene letta dal lettore di schermo. Il fatto che esso non cambi ha come conseguenza che l'utente potrebbe non capire che la pagina è cambiata.

Effetto:

Riduzione della produttività.

Rimedio:

Fare in modo che il titolo di ciascuna pagina sia unico (diverso dai titoli delle altre) e informativo.

Frame senza titolo

Categoria:

Comprensione

Causa:

La pagina è basata su frame e qualcuno dei tag FRAME (dentro FRAMESET) non contiene l'attributo TITLE; oppure il suo valore coincide con il valore di NAME.

Tipo di fallimento:

L'utente potrà accedere alla pagina solamente un frame alla volta, e sarà costretto a scegliere quale frame visitare. Se l'attributo NAME del frame contiene dei valori come "asx1" o "alto_sinistra_1" questi non permettono all'utente di capire quale sia lo scopo del frame e tantomeno quale che sia il suo contenuto.

Similmente per l'attributo TITLE con dei valori poco chiari e poco informativi.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Aggiungere sempre l'attributo TITLE a ciascuno dei frame ed assicurarsi che il suo valore sia comprensibile e informativo, rispetto alla scelta del frame da visitare.

Meglio ancora sarebbe non usare proprio i frame ed ottenere gli stessi effetti grafici (es. clipping) mediante regole CSS.

Marcatura della lingua

Categoria:

Comprensione

Causa:

La pagina manca di attributo LANG sia nel tag iniziale HTML, sia ogniqualvolta ci sono parole di una lingua diversa da quella della pagina.

Tipo di fallimento:

Il lettore di schermo pronuncierà le parole con i fonemi della lingua preselezionata. Quindi se la pagina, parte di un sito in italiano, contiene la versione in tedesco della pagina, il lettore di schermo continuerà a pronunciare le parole in italiano, fintantoché l'utente non cambia il settaggio.

Inoltre se la pagina (in italiano) contiene un'espressione tipo "Check in", tale espressione verrà pronunciata "kekin".

Effetto:

Riduzione dell'efficacia.

Rimedio:

Aggiungere l'attributo HTML/@LANG 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 es. "<span lang="en">Check in<span/>".

Suddivisione in sezioni

Categoria:

Comprensione, controllo da parte dell'utente

Causa:

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

Tipo di fallimento:

Il lettore di schermo permette all'utente di listare tutti i titoli di sezione (da H1 a H6) e di saltare da uno all'altro, in qualsiasi punto della pagina. Ciò permette all'utente di ottenere velocemente una panoramica del contenuto della pagina e di poter scegliere la parte da esaminare con attenzione.

Soprattutto in caso di visita di pagine errate, questa caratteristica della pagina risulta molto utile perché permette di risparmiare tempo e fatica.

Inoltre anche nel caso di visita di pagine molto simili (ad es. una catena di form in cascata con una parte preliminare delle pagine in comune) l'utente avrebbe modo di saltare direttamente dove serve.

Effetto:

Riduzione della produttività e in parte dell'efficacia.

Rimedio:

Per ogni tipo di contenuto (ad es. barra globale, briciole di pane, gruppo di link, sequenza di paragrafi) aggiungere un tag H1-H6.

Rispettare l'ordine: non mettere un H3 dopo un H1.

Immagini come titoli

Categoria:

Comprensione

Causa:

La pagina contiene dei titoli di categoria (ad es. di un gruppo di link tra loro correlati, o di un gruppo di news) implementati mediante delle immagini che sono prive di attributo ALT.

Tipo di fallimento:

Il lettore di schermo non potrà pronunciare alcun testo intelliggibile (eccetto l'URL del file dell'immagine), e quindi l'utente perderà anche quel poco di contestualizzazione e orientamento che il titoletto avrebbe potuto fornire.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Evitare di usare immagini per i titoletti di categorie. Usare invece le regole del CSS per ottenere il desiderato effetto grafico.

Se ciò non fosse proprio possibile, aggiungere l'attributo ALT a ciascuna immagine con un valore che corrisponde al testo dipinto in pixel nell'immagine.

Mancanza di tasti rapidi

Categoria:

Controllo da parte dell'utente

Causa:

La pagina contiene dei link o pulsanti o controlli di form che sono ricorrenti nelle pagine del sito e che non hanno alcun tasto rapido associato (con @ACCESSKEY).

Tipo di fallimento:

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

Il problema è ancora più grave se la pagina manca di link per saltare al contenuto e di link per muoversi di sezione in sezione.

Effetto:

Riduzione della flessibilità, e quindi della produttività e soddisfazione.

Rimedio:

Per i link/pulsanti/controlli che sono ricorrenti nelle pagine del sito (cioè dove valga la pena che l'utente impari e ricordi che ci sono dei tasti rapidi associati) aggiungere l'attributo @ACCESSKEY ad A, INPUT, BUTTON. Ricordarsi di evitare di usare i caratteri che vengono usati nell'elenco dei nomi di menu del browser o le cifre (quest'ultime vengono usate da Firefox per saltare ad una determinata linguetta tra quelle aperte).

Ricordarsi di fare in modo che i tasti rapidi vengano descritti in qualche pagina di aiuto e che siano sempre gli stessi per un determinato link/pulsante/controllo.

Skip links

Categoria:

Controllo da parte dell'utente

Causa:

La pagina non permette di saltare direttamente al contenuto, evitando il materiale preliminare e ripetuto nelle pagine (logo, briciole di pane, pulsantiera globale).

Tipo di fallimento:

L'utente è costretto, nella navigazione all'interno del sito, a sentirsi leggere più e più volte il materiale preliminare, prima di arrivare al nocciolo della pagina.

Questo è particolarmente grave nel caso di un'applicazione web, con dei refresh della pagina che la fanno cambiare e che spostano il focus dell'interazione all'inizio.

Effetto:

Riduzione anche marcata della produttività.

Rimedio:

Aggiungere, subito dopo il logo, un link che permetta di saltare al nocciolo della pagina.

Preferire un link visibile a tutti; se ciò non fosse possibile implementare lo skip-links mediante un link nascosto (con display:none o con uno spaziatore trasparente dotato di ALT="salta al contenuto").

Pagina solo testo

Categoria:

Controllo da part dell'utente

Causa:

La pagina contiene un link che porta ad una pagina solo del contenuto testuale. Talvolta c'è modo di cambiare i colori e la dimensione del testo.

Spesso però la pagina solo testo contiene meno materiale, meno link e minori possibilità di accedere ai contenuti del sito di quanto permetta la pagina grafica.

Tipo di fallimento:

L'utente si rifiuta di usare la pagina solo testo impoverita rispetto a quella normale; la vede come un modo per dire ai disabili "entrate dal garage perché siete diversi dagli altri".

Effetto:

Riduzione dell'efficacia e drastica riduzione della soddisfazione.

Rimedio:

Realizzare la pagina solo testo in maniera corretta: che abbia gli stessi contenuti (in veste testuale evidentemente) e le stesse possibilità di accedere al contenuto del sito della pagina originale. Mantenerla altrettanto aggiornata.

La pagina solo testo è un'altra interfaccia che l'utente può usare per accedere al sito, ed essa risulta essere molto più veloce e flessibile.

Controlli del browser disabilitati

Categoria:

Controllo da parte dell'utente

Causa:

La pagina è stata aperta in una nuova finestra del browser dove i controlli tipici del browser non ci sono (back, next, refresh, ecc).

Tipo di fallimento:

L'utente è costretto a percorrere in lungo e in largo la pagina per trovare un link che gli/le permetta di tornare indietro o di rileggere l'URL della pagina.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Non disabilitare mai tali controlli.

Solamente nel caso di finestre temporanee, dove il primo link/pulsante permetta di chiuderle, è ragionevole pensare che i controlli normali vengano disabilitati.

Lista di barriere per Utenti ipovedenti

Categoria di utenti: Utenti ipovedenti di ingranditori di schermo; talvolta utenti degli strumenti di accessibilità offerti direttamente dal sistema operativo. Questa categoria potrebbe includere anche utenti disabilitati da tecnologie quali cellulari e PDA con schermi ridotti, con una ridotta possibilità di interagire.

  1. Immagini ricche malposizionate
  2. Immagini ricche incluse nello sfondo
  3. Contrasto visivo insufficiente
  4. Materiale in movimento
  5. Immagini funzionali in sfondo
  6. Immagini funzionali prive di testo
  7. Menu dinamici in JavaScript
  8. Mancanza di link interni
  9. Righe di testo lunghe
  10. Troppi link
  11. Form con redirect
  12. Form ampie
  13. Finestre sovrapposte
  14. Temporizzazioni troppo brevi
  15. Immagini come titoli
  16. Mancanza di tasti rapidi
  17. Testo non ridimensionabile
  18. Layout non ridimensionabile
  19. Skip links
  20. Controlli del browser disabilitati

Immagini ricche malposizionate

Categoria:

Percezione

Causa:

Layout della pagina subottimale perché la grafica non fa capire la presenza dell'immagine, che è portatrice di informazioni.

Tipo di fallimento:

L'utente potrebbe non capire che c'è l'immagine se essa è posizionata al di fuori del suo campo visivo e in posizioni estreme della pagina (es. in basso o alto a dx). Questo può succedere soprattutto se la pagina si basa su un impianto grafico che fornisce delle indicazioni visuali sbagliate su dove la pagina termina (ad es. con delle linee o decorazioni verticali che possono essere interpretate come margine destro, oltre al quale non si trova nulla). La conseguenza è che l'immagine non verrebbe proprio vista, e quindi le sue informazioni non fruite.

Effetto:

Riduzione di efficacia.

Rimedio:

Cambiare l'impostazione grafica, facendo in modo tale che la grafica non induca ad immaginare la fine della pagina (a destra o in basso) prima del tempo.

Immagini ricche incluse nello sfondo

Categoria:

Percezione

Causa:

Immagini latrici di informazioni incluse nello sfondo della pagina (tramite CSS) per le quali non è possibile specificare testo alternativo equivalente.

Tipo di fallimento:

Tali immagini sarebbero totalmente non percepibili da parte degli utenti dato che i lettori di schermo o i browser parlanti non segnalerebbero neppure la presenza dell'immagine, tantomeno del testo ad esse associato.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Fare in modo di includere le immagini con del codice HTML (usando IMG oppure OBJECT), specificando un valore per l'attributo ALT di IMG (o del contenuto per OBJECT) ed eventualmente associando all'immagine un link che porta ad una pagina di spiegazioni dettagliate dell'immagine.

Contrasto visivo insufficiente

Categoria:

Percezione

Causa:

La pagina contiene materiale in primo piano su qualche tipo di sfondo e i colori usati per dipingere gli uni e l'altro sono troppo poco contrastati. Lo sfondo in questione può essere un riquadro colorato con tinta uniforme, a gradiente, con qualche trama, con un'immagine. E il materiale di primo piano può consistere in testo o in immagini.

Il livello di contrasto troppo basso può essere dovuto ad insufficiente differenza di luminosità, o a cattiva scelta delle diverse tonalità di colore.

Talvolta il problema sorge solo quando il contenuto della pagina viene riposizionato (ad es. perché si è cambiata la dimensione del testo, o la geometria della finestra).

Tipo di fallimento:

La persona farà molta fatica a distinguere le due cose, e in certi casi non riuscirà a decifrare proprio il materiale di primo piano.

Effetto:

Riduzione, anche totale, dell'efficacia.

Rimedio:

Il rimedio consiste nella rimozione completa delle immagini di sfondo, o nella loro modifica in modo tale che mai possano interferire con la lettura/percezione del materiale di primo piano.

In aggiunta, una scelta oculata di colori ben contrastati a livello di luminosità (da verificare visualizzando la pagina in una scala di grigi) e ben contrastati a livello di tonalità sicuramente risolve questo tipo di problema.

Materiale in movimento

Categoria:

Percezione

Causa:

Immagini o testo in movimento (ad es. testo scorrevole, immagine animata).

Tipo di fallimento:

Il materiale in movimento potrebbe essere posto in un luogo al di fuori del campo visivo dell'utente, con la conseguenza che il cambiamento non viene affatto notato.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Evitare di usare materiale in movimento, e dare sempre all'utente la libertà di avanzare nella fruizione del materiale.

Immagini funzionali in sfondo

Categoria:

Utilizzazione

Causa:

La pagina contiene nello sfondo (ev. anche mediante regole CSS) delle immagini che nella pagina visualizzata assumono un ruolo funzionale. Ad es. corrispondono ad immagini cliccabili, a pulsanti, a etichette di controlli di form o a etichette di categorie di contenuti.

Tipo di fallimento:

L'utente che prova ad ingrandire la dimensione dei caratteri, e a modificare la forma e dimensione della finestra rischia di spostare i contenuti e disallineare la struttura dello sfondo con quella del materiale di primo piano. La conseguenza è che le immagini non sono più visualizzate nel contesto desiderato.

Inoltre l'utente potrebbe voler disabilitare i figli di stile della pagina ed usare il proprio stile. In questo caso non riuscirebbe a percepire proprio il materiale incluso con il CSS.

Rimedio:

Rimuovere le immagini funzionali dallo sfondo e includere le informazioni importanti direttamente nell'HTML. Agire poi con il CSS per ottenere l'effetto grafico desiderato.

Immagini funzionali prive di testo

Categoria:

Utilizzazione

Causa:

La pagina contiene delle immagini funzionali (link cliccabili, pulsanti di invio per form, mappe immagine) prive di testo alternativo. Analogamente per pulsanti in Flash.

Tipo di fallimento:

L'utente non potrà ingrandire le immagini (nel caso in cui non usi l'ingranditore di schermo) e quindi potrebbe non essere in grado di leggerne o distinguerne il contenuto. Analogamente, nel caso debba cambiare i colori della pagina con il proprio foglio di stile, non potrà modificare nulla dell'immagine.

Rimedio:

Includere nelle immagini l'attributo ALT (IMG/@ALT, AREA/@ALT) o un contenuto anche testuale per OBJECT. Fare in modo che il testo sia informativo e che quindi permetta di capire l'effetto dell'attivazione del link.

Fare questo anche per i banner pubblicitari.

Evitare l'uso di ALT="" per un'immagine cliccabile (dentro un A) dato che comunque l'elemento è raggiungibile con la tastiera.

Menu dinamici in JavaScript

Categoria:

Utilizzazione

Causa:

La pagina contiene del codice JavaScript che, non appena l'utente posiziona il focus dell'interazione su un elemento, viene aperto un menu in una determinata zona della pagina.

Tipo di fallimento:

L'utente dell'ingranditore di schermo potrebbe guardare una sezione della pagina che è lontana dalla parte della pagina che contiene il menu appena aperto, il quale quindi risulta esterno al campo visivo dell'utente, che non può fruirne.

Effetto:

Riduzione, anche drastica, dell'efficacia.

Rimedio:

Fare in modo che tutte le opzioni di navigazione e i comandi operativi (ad es. i comandi da menu) siano attivabili anche disattivando JavaScript. Magari offrendo in una sezione separata della pagina dei link o pulsanti ridondanti. Far in modo che tale pagina sia raggiungibile dalla pagina originale anche se javaScript è disabilitato.

Mancanza di link interni

Categoria:

Utilizzazione, controllo da parte dell'utente

Causa:

La pagina, relativamente complessa e ricca di contenuto che spesso non viene tutto visualizzato insieme, manca di link interni alla pagina che permettano all'utente di saltare di sezione in sezione, o di ritornare in testa alla pagina.

Tipo di fallimento:

L'utente sarà costretto a muovere il campo visivo dalla parte inferiore della pagina alla barra di scorrimento (per spostare il contenuto della finestra) e poi di nuovo all'inizio della finestra per poter leggere il titolo della sezione e la sua parte iniziale.

Questo potrebbe essere ancora più grave nel caso di form complesse, nelle quali l'utente potrebbe non accorgersi della presenza di elementi importanti.

Effetto:

Una riduzione della produttività, e in misura minore dell'efficacia (dato che potranno essere compiuti errori ed omissioni).

Rimedio:

Alla fine di ciascuna sezione della pagina includere dei link per poter saltare alla fine della successiva sezione, all'inizio della sezione appena vista, in testa o alla fine della pagina.

Righe di testo lunghe

Categoria:

Controllo da parte dell'utente

Causa:

La pagina contiene righe di testo troppo lunghe rispetto al campo visivo.

Tipo di fallimento:

Le righe più lunghe del campo visivo forzano l'utente a continuamente far scorrere il campo visivo da sx a dx per poter leggere il testo della riga, e poi di nuovo da dx a sx per andare all'inizio della riga successiva. Il problema è acuito dall'eventuale dover fare scrolling orizzontale della pagina, nel qual caso l'utente deve spostare il campo visivo anche in basso per localizzare ed "agganciare" la barra di scorrimento.

Effetto:

Il problema influenza la produttività e la soddisfazione; alla lunga influenza anche l'efficacia dato che l'utente si stanca e rischia di confondersi e quindi commette più errori e la sua motivazione nell'usare il sito si riduce.

Rimedio:

Il modo migliore di risolvere il problema è di supportare un layout liquido. In questo modo l'utente potrà modificare la larghezza della finestra e la dimensione dei caratteri senza che ciò causi la presenza della barra di scorrimento orizzontale. E comunque l'utente potrà settare la larghezza delle righe di testo in modo da ridurre gli scorrimenti del campo visivo.

Troppi link

Categoria:

Comprensione, Controllo da parte dell'utente

Causa:

Troppi link nella pagina, talvolta non bene organizzati in gruppi.

Tipo di fallimento:

Il numero elevato di link costringe l'utente ad un'analisi lunga e faticosa di ciascuno di essi.

Gli utenti devono far scorrere il loro ristretto campo visivo su tutti i link, nelle varie zone della pagina, memorizzandoseli, prima di poter decidere se continuare la navigazione e quindi quale attivare. L'esame della pagina procede una sezione alla volta, con il rischio di dimenticarsi alcuni link visti in precedenza o la loro posizione. Il problema è acuito se la pagina richiede scrolling verticale od orizzontale.

Effetto:

Il problema influenza ovviamente la produttività e la soddisfazione; ma anche l'efficacia ne viene compromessa soprattutto se il problema si ripete dato che l'utente si stanca e rischia di confondersi e quindi commette più errori e la sua motivazione nell'usare il sito si riduce.

Rimedio:

Occorre riorganizzare i link suddividendoli in sezioni/categorie. Nella stessa pagina introducendo delle liste (UL) o DIV separate, introducendo dei titoli di categoria (con degli H2-H3). Eventualmente aggiungendo dei link intra-pagina (A/@href che punta ad un A/@name), eventualmente nascosti, per poter passare da un gruppo al successivo o al precedente. In pagine diverse rendendo più profondo il sito con delle pagine intermedie. Deve essere possibile per l'utente esaminare sinteticamente un blocco di link e decidere solo dal titolo del blocco se i link che esso contiene sono rilevanti o meno.

Inoltre bisogna supportare un layout liquido in modo che l'utente possa ingrandire il testo a piacimento, accorciando le righe di testo (utile per gli utenti di ingranditori di schermo) senza richiedere scrolling orizzontale.

Form con redirect

Categoria:

Utilizzazione

Causa:

La pagina contiene delle form in cui alcuni controlli (campi o menu a tendina implementati con SELECT), una volta che vengono utilizzati, causano un submit al server il quale spedisce una nuova pagina al browser. Questo comportamento è basato su gestori di eventi JavaScript.

Tipo di fallimento:

Il problema è che per l'utente, una volta scelta una voce dal menu (ad es.) il browser attende qualche secondo e poi propone la nuova pagina riposizionando il focus all'inizio. L'utente deve quindi capire che il browser mostra una nuova pagina quasi uguale alla precedente, e poi muovere il focus sino al punto del menu scelto in precedenza e solo dopo può continuare nella compilazione della form.

Effetto:

Riduzione anche marcata dell'efficacia e dell'efficienza. Le conseguenze si complicano se la pagina non è ben organizzata dal punto della navigazione interna (uso di H1-H2, uso di skip-links, uso di ACCESSKEY).

Rimedio:

Se possibile fare a meno dell'invio intermedio dei dati al server. Ove ciò non fosse possibile, adottare tutti gli accorgimenti necessari per limitare le conseguenze negative: usare i tag H1-H6 e DIV per suddividere in sezioni il contenuto della pagina, usare gli skip-links per permettere all'utente di saltare oltre barre di navigazione e materiale preliminare, fornire i controlli della form di ACCESSKEY per poter spostare direttamente il focus su di essi, includere le etichette dei controlli nel tag LABEL.

Form ampie

Categoria:

Utilizzazione

Causa:

La pagina contiene una form i cui controlli sono sparsi in un'ampia area della pagina e disposti su più di una colonna.

Tipo di fallimento:

L'utente potrebbe non accorgersi della presenza di controlli in zone estreme della pagina (in alto o basso a dx), e quindi potrebbe cercare di inviare i dati senza aver compilato completamente la form.

Effetto:

Riduzione dell'efficacia e della produttività.

Rimedio:

Impaginare la form in maniera che visualmente sia chiaro dove essa termina (a dx e in basso). Preferire una disposizione su una sola colonna dei controlli.

Finestre sovrapposte

Categoria:

Utilizzazione.

Causa:

La pagina contiene codice (HTML o JavaScript) che apre nuove finestre che si sovrappongono totalmente o quasi del tutto con la finestra usata sino a quel momento.

Tipo di fallimento:

L'utente non distingue la nuova finestra dalla precedente, e quindi si trova del tutto disorientato dal nuovo contesto di interazione.

Può ad es. capitare che l'utente non riconosca che la scroll bar che vede sia quella della finestra nello sfondo. Quando ci clicca sopra (con l'intenzione di scorrere il contenuto della finestra in primo piano), ottiene come risultato lo scambio delle due finestre e quella di primo piano, che l'utente stava esaminando, passa dietro, senza permettergli di capire cosa sia successo.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Evitare di aprire nuove finestre; se lo si deve proprio fare, fare in modo che sin dall'inizio della nuova pagina sia chiaro all'utente che si tratta di una nuova finestra e dargli/le modo di chiuderla. Evitare di sovrapporle complementamente o quasi con la finestra principale.

Temporizzazioni troppo brevi

Categoria:

Utilizzazione

Causa:

Il comportamento del server è di causrae un refresh della pagina, magari con modifica del contenuto, senza che ci sia stato un qualche evento causato dall'utente per attivare tale comportamento.

Tipo di fallimento:

L'utente che ci mette più tempo del previsto per svolgere una determinata azione (ad es. consultare una pagina e successivamente premere un pulsante "accetto") si trova nella situazione di non poter procedere perché il sistema ha cambiato stato di propria iniziativa.

Effetto:

Riduzione anche totale dell'efficacia.

Rimedio:

Evitare le temporizzazioni automatiche che cambiano stato alla pagina senza che l'utente le abbia richieste esplicitamente.

Immagini come titoli

Categoria:

Comprensione

Causa:

La pagina contiene dei titoli di categoria (ad es. di un gruppo di link tra loro correlati, o di un gruppo di news) implementati mediante delle immagini che sono prive di attributo ALT.

Tipo di fallimento:

L'utente non potrà usare solamente il browser per ingrandire il contenuto della pagina, dato che ciò non produrrà l'effetto di ingrandire i titoli.

Egli dovrà per forza usare un ingranditore di schermo per poter fruire appieno della pagina, con la conseguenza di ridurre ulteriormente il proprio campo visivo.

Effetto:

Riduzione efficacia.

Rimedio:

Evitare di usare immagini per i titoletti di categorie. Usare invece le regole del CSS per ottenere il desiderato effetto grafico.

Mancanza di tasti rapidi

Categoria:

Controllo da parte dell'utente

Causa:

La pagina contiene dei link o pulsanti o controlli di form che sono ricorrenti nelle pagine del sito e che non hanno alcun tasto rapido associato (con @ACCESSKEY).

Tipo di fallimento:

L'utente potrebbe usare i tasti rapidi per spostare velocemente e in maniera precisa il focus dell'interazione sulla parte della pagina che interessa, senza dover usare barre di scorrimento e senza dover spostare a mano il campo visivo.

Effetto:

Riduzione della flessibilità, e quindi della produttività e soddisfazione.

Effetto:

Riduzione anche marcata della produttività.

Rimedio:

Per i link/pulsanti/controlli che sono ricorrenti nelle pagine del sito (cioè dove valga la pena che l'utente impari e ricordi che ci sono dei tasti rapidi associati) aggiungere l'attributo @ACCESSKEY ad A, INPUT, BUTTON. Ricordarsi di evitare di usare i caratteri che vengono usati nell'elenco dei nomi di menu del browser o le cifre (quest'ultime vengono usate da Firefox per saltare ad una determinata linguetta tra quelle aperte).

Ricordarsi di fare in modo che i tasti rapidi vengano descritti in qualche pagina di aiuto e che siano sempre gli stessi per un determinato link/pulsante/controllo.

Testo non ridimensionabile

Categoria:

Controllo da parte dell'utente.

Causa:

La pagina contiene del testo per il quale sono state usate delle modalità di presentazione tali per cui non può essere ridimensionato. Ad es. unità di misura assolute del CSS (px, pt, cm) o tag deprecati come FONT/@SIZE.

Tipo di fallimento:

L'utente potrebbe (a seconda del browser usato) non riuscire ad ingrandire la dimensione del testo. Con la conseguenza di dover utilizzare un ingranditore di schermo.

Effetto:

Riduzione anche marcata dell'efficacia.

Rimedio:

Usare sempre unità di misura CSS di tipo relativo, come em e %.

Non usare mai FONT/@SIZE né immagini con il testo dipinto in pixel.

Layout non ridimensionabile

Categoria:

Controllo da parte dell'utente

Causa:

La pagina ha una struttura di impaginazione non fluida, che non permette di modificare le dimensioni della finestra o quelle del testo senza compromettere la comprensibilità e fruibilità del contenuto.

Talvolta la pagina lascia inutilizzata una grossa proporzione dello schermo.

Tipo di fallimento:

L'utente non potrà massimizzare la finestra, né aumentare la dimensione del carattere. Sarà pertanto costretto ad usare un ingranditore di schermo.

Il problema è ancora più grave se il testo all'interno della pagina non fuisce correttamente, pregiudicandone la comprensione.

Effetto:

Riduzione anche marcata dell'efficacia.

Rimedio:

Usare il CSS per posizionare gli elementi della pagina ed usare sempre (eccetto per margini e bordi) delle unità di misura relative. Non usare tabelle di impaginazione che siano dimensionate mediante delle immagini spaziatrici estese usando delle unità di misura assolute (ad es. 145px).

Skip links

Categoria:

Controllo da parte dell'utente

Causa:

La pagina non permette di saltare direttamente al contenuto, evitando il materiale preliminare e ripetuto nelle pagine (logo, briciole di pane, pulsantiera globale).

Tipo di fallimento:

L'utente non ha modo di posizionare direttamente il focus dell'interazione, e quindi il suo campo visivo, sul nocciolo della pagina.

Effetto:

Riduzione della produttività.

Rimedio:

Aggiungere, subito dopo il logo, un link che permetta di saltare al nocciolo della pagina.

Preferire un link visibile a tutti; se ciò non fosse possibile implementare lo skip-links mediante un link nascosto (con display:none o con uno spaziatore trasparente dotato di ALT="salta al contenuto").

Controlli del browser disabilitati

Categoria:

Controllo da parte dell'utente

Causa:

La pagina è stata aperta in una nuova finestra del browser dove i controlli tipici del browser non ci sono (back, next, refresh, ecc).

Tipo di fallimento:

L'utente è costretto a percorrere in lungo e in largo la pagina per trovare un link che gli/le permetta di tornare indietro o di rileggere l'URL della pagina.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Non disabilitare mai tali controlli.

Solamente nel caso di finestre temporanee, dove il primo link/pulsante permetta di chiuderle, è ragionevole pensare che i controlli normali vengano disabilitati.

Lista di barriere per Utenti daltonici

Categoria di utenti: Persone daltoniche (che non usano alcuna tecnologia assistiva).La categoria potrebbe includere anche utenti che usano dispositivi dotati di schermi a bassa qualità, o monocromatici.

  1. Colore essenziale
  2. Contrasto visivo insufficiente

Colore essenziale

Categoria:

Percezione

Causa:

La presenza di materiale (testo, immagini, sfondi, filmati) dove il colore viene usato come unico modo per distinguere due o più informazioni diverse. Ad es. righe in una tabella con dati di bilancio dove i valori positivi sono in nero e quelli negativi in rosso (senza il segno "-").

Un esempio comune è l'uso del solo colore per distinguere i link già percorsi.

Tipo di fallimento:

Gli utenti potrebbero trovarsi nella situazione di non poter distinguere le due informazioni, ad es. se venissero scelti colori che per un daltonico sono troppo poco differenziabili (es. verde e rosso).

Effetto:

Riduzione, anche totale, dell'efficacia.

Rimedio:

Usare, oltre al colore, anche altri mezzi per distinguere le due informazioni. Devono essere però accorgimenti che abbiano, oltre ad una manifestazione grafica non basata sul colore, anche una manifestazione uditiva; ad es. aggiungendo qualche parola, qualche carattere pronunciabile, qualche simbolo.

Contrasto visivo insufficiente

Categoria:

Percezione

Causa:

La pagina contiene materiale in primo piano su qualche tipo di sfondo e i colori usati per dipingere gli uni e l'altro sono troppo poco contrastati. Lo sfondo in questione può essere un riquadro colorato con tinta uniforme, a gradiente, con qualche trama, con un'immagine. E il materiale di primo piano può consistere in testo o in immagini.

Il livello di contrasto troppo basso può essere dovuto ad insufficiente differenza di luminosità, o a cattiva scelta delle diverse tonalità di colore.

Talvolta il problema sorge solo quando il contenuto della pagina viene riposizionato (ad es. perché si è cambiata la dimensione del testo, o la geometria della finestra).

Tipo di fallimento:

La persona potrebbe non essere in grado di percepire chiaramente la presenza del materiale di primo piano.

Effetto:

Riduzione, anche totale, dell'efficacia.

Rimedio:

Il rimedio consiste nella rimozione completa delle immagini di sfondo, o nella loro modifica in modo tale che mai possano interferire con la lettura/percezione del materiale di primo piano.

In aggiunta, una scelta oculata di colori ben contrastati a livello di luminosità (da verificare visualizzando la pagina in una scala di grigi) e ben contrastati a livello di tonalità sicuramente risolve questo tipo di problema.

Lista di barriere per Utenti disabili motori

Categoria di utenti: Persone con menomazioni fisiche per le quali l'uso del web può essere influenzato dalla mancanza di controllo muscolare o nervoso delle braccia e mani, da tremore o dalla mancanza di agilità delle dita e delle mani.La categoria potrebbe includere persone solo temporaneamente disabili (ad es. con il braccio in gesso), oppure persone che usano il sito in posizioni inusuali (ad es. durante una presentazione in pubblico, sul podio in piedi).

  1. Menu a cascata
  2. Eventi mouse
  3. Mancanza di link interni
  4. Troppi link
  5. Link troppo vicini
  6. Nuove finestre
  7. Form senza LABEL
  8. Temporizzazioni troppo brevi
  9. Mancanza di tasti rapidi
  10. Controlli del browser disabilitati

Menu a cascata

Categoria:

Utilizzazione

Causa:

La pagina contiene dei menu a cascata (implementati con delle SELECT annidate o mediante codice JavaScript).

Tipo di fallimento:

L'utente ha difficoltà nel posizionare il puntatore nelle voci giuste, e soprattutto per fare in modo che i menu secondari si aprano e rimangano aperti quando si scorrono le loro voci.

Effetto:

Riduzione dell'efficacia e della soddisfazione.

Rimedio:

Evitare i menu in cascata; eventualmente realizzare dei menu separati, meglio ancora se appiattiti (barre di navigazione con le voci esplicite) o basati su radiobutton.

Eventi mouse

Categoria:

Utilizzazione

Causa:

La pagina si basa su codice JavaScript per ottenere determinati effetti. Le routine vengono invocate mediante gestori di eventi legati al mouse (es. "onclick", "onmouseover", "onmouseout", ...).

Tipo di fallimento:

L'utente, che potrebbe preferire l'uso della tastiera al mouse per determinate azioni, si trova nella situazione in cui le funzionalità sembrano esserci ma non funzionano.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Usare anche i gestori di eventi logici ("onfocus", "onkeypress", ...).

Meglio ancora se le funzionalità fossero rese disponibili anche senza JavaScript.

Mancanza di link interni

Categoria:

Utilizzazione, controllo da parte dell'utente

Causa:

La pagina, relativamente complessa e ricca di contenuto che spesso non viene tutto visualizzato insieme, manca di link interni alla pagina che permettano all'utente di saltare di sezione in sezione, o di ritornare in testa alla pagina.

Tipo di fallimento:

L'utente è costretto a continuamente muovere il puntatore dalla pagina alla barra di scorrimento e viceversa.

Anche nel caso di utilizzo della tastiera (se ovviamente è possibile usarla), la mancanza di tali link richiede all'utente un uso più frequente dei tasti.

Effetto:

Aumenta il tempo necessario per completare il compito; aumentano gli errori (nell'uso della barra di scorrimento ad esempio). E quindi cala l'efficacia e la produttività.

Rimedio:

Alla fine di ciascuna sezione della pagina includere dei link per poter saltare alla fine della successiva sezione, all'inizio della sezione appena vista, in testa o alla fine della pagina.

Troppi link

Categoria:

Comprensione, Controllo da parte dell'utente

Causa:

Troppi link nella pagina, talvolta non bene organizzati in gruppi.

Tipo di fallimento:

Il numero elevato di link costringe l'utente ad un'analisi lunga e faticosa di ciascuno di essi.

Il gran numero di link, se disposti in maniera da richiedere dello scrolling verticale od orizzontale, forza l'utente a delle azioni con il mouse o con la tastiera che sono difficili da compiere con accuratezza (il pulsante di scroll è piccolo, il cursore della barra di scorrimento è piccola).

Effetto:

Il problema influenza ovviamente la produttività e la soddisfazione; ma anche l'efficacia ne viene compromessa soprattutto se il problema si ripete dato che l'utente si stanca e rischia di confondersi e quindi commette più errori e la sua motivazione nell'usare il sito si riduce.

Rimedio:

Occorre riorganizzare i link suddividendoli in sezioni/categorie. Nella stessa pagina introducendo delle liste (UL) o DIV separate, introducendo dei titoli di categoria (con degli H2-H3). Eventualmente aggiungendo dei link intra-pagina (A/@href che punta ad un A/@name), eventualmente nascosti, per poter passare da un gruppo al successivo o al precedente. In pagine diverse rendendo più profondo il sito con delle pagine intermedie. Deve essere possibile per l'utente esaminare sinteticamente un blocco di link e decidere solo dal titolo del blocco se i link che esso contiene sono rilevanti o meno.

Inoltre bisogna supportare un layout liquido in modo che l'utente possa ingrandire il testo a piacimento, accorciando le righe di testo (utile per gli utenti di ingranditori di schermo) senza richiedere scrolling orizzontale.

Link troppo vicini

Categoria:

Utilizzazione

Causa:

La pagina contiene delle sequenze di link molto vicini tra loro o molto piccoli.

Tipo di fallimento:

L'utente farà molta fatica a posizionare il mouse su dei link molto piccoli; in certi casi rischierà di colpire il link sbagliato, se posto vicino a quello desiderato.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Distanziare i link tra loro, ed assicurarsi che l'etichetta di ciascuno dei link sia sufficientemente grande.

Nuove finestre

Categoria:

Utilizzazione

Causa:

La pagina contiene del codice (HTML o JavaScript) che apre nuove finestre quando l'utente attiva dei link o pulsanti.

Tipo di fallimento:

Il dover muovere il mouse sul pulsantino di chiusura della finestra, ogni volta che questa appare, richiede all'utente una notevole fatica perché deve muovere il mouse sul pulsante, piccolo, di chiusura della finestra in alto a destra, nella barra del titolo.

Effetto:

Riduzione della produttività.

Rimedio:

Evitare di aprire nuove finestre in generale.

Se lo si deve proprio fare, fare in modo che sin dall'inizio della nuova pagina sia chiaro all'utente che si tratta di una nuova finestra e dargli/le modo di chiuderla.

Form senza LABEL

Categoria:

Utilizzazione

Causa:

La pagina contiene delle form i cui controlli sono privi del corretto markup LABEL/@FOR oppure è impaginata in maniera complessa (ad es. perché impaginata con una tabella il cui contenuto non si linearizza correttamente).

Tipo di fallimento:

Certi controlli hanno una superficie cliccabile ridotta (ad es. radiobutton o checkbox). L'utente farà quindi fatica ad attivare il controllo.

Effetto:

Riduzione della produttività.

Rimedio:

Aggiungere sempre il tag LABEL/@FOR attorno alle etichette di ciascun controllo. Nei casi in cui questo non è possibile usare l'attributo TITLE.

In questo modo anche il testo dell'etichetta risulta cliccabile, per controlli come radiobutton e checkbox.

Temporizzazioni troppo brevi

Categoria:

Utilizzazione

Causa:

Il comportamento del server è di causrae un refresh della pagina, magari con modifica del contenuto, senza che ci sia stato un qualche evento causato dall'utente per attivare tale comportamento.

Tipo di fallimento:

L'utente che ci mette più tempo del previsto per svolgere una determinata azione (ad es. consultare una pagina e successivamente premere un pulsante "accetto") si trova nella situazione di non poter procedere perché il sistema ha cambiato stato di propria iniziativa.

Effetto:

Riduzione anche totale dell'efficacia.

Rimedio:

Evitare le temporizzazioni automatiche che cambiano stato alla pagina senza che l'utente le abbia richieste esplicitamente.

Mancanza di tasti rapidi

Categoria:

Controllo da parte dell'utente

Causa:

La pagina contiene dei link o pulsanti o controlli di form che sono ricorrenti nelle pagine del sito e che non hanno alcun tasto rapido associato (con @ACCESSKEY).

Tipo di fallimento:

L'uso della tastiera è spesso preferito; pertanto la presenza dei tasti rapidi migliora di molto l'usabilità del sito.

Effetto:

Riduzione della flessibilità, e quindi della produttività e soddisfazione.

Effetto:

Riduzione anche marcata della produttività.

Rimedio:

Per i link/pulsanti/controlli che sono ricorrenti nelle pagine del sito (cioè dove valga la pena che l'utente impari e ricordi che ci sono dei tasti rapidi associati) aggiungere l'attributo @ACCESSKEY ad A, INPUT, BUTTON. Ricordarsi di evitare di usare i caratteri che vengono usati nell'elenco dei nomi di menu del browser o le cifre (quest'ultime vengono usate da Firefox per saltare ad una determinata linguetta tra quelle aperte).

Ricordarsi di fare in modo che i tasti rapidi vengano descritti in qualche pagina di aiuto e che siano sempre gli stessi per un determinato link/pulsante/controllo.

Controlli del browser disabilitati

Categoria:

Controllo da parte dell'utente

Causa:

La pagina è stata aperta in una nuova finestra del browser dove i controlli tipici del browser non ci sono (back, next, refresh, ecc).

Tipo di fallimento:

L'utente è costretto a percorrere in lungo e in largo la pagina per trovare un link che gli/le permetta di tornare indietro o di rileggere l'URL della pagina.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Non disabilitare mai tali controlli.

Solamente nel caso di finestre temporanee, dove il primo link/pulsante permetta di chiuderle, è ragionevole pensare che i controlli normali vengano disabilitati.

Lista di barriere per Utenti non udenti

Categoria di utenti: Persone non udenti o con gravi difetti di udito.La categoria potrebbe includere anche utenti costretti ad usare il sito in situazioni in cui l'audio non può essere sentito (ad es. in una sala lettura, durante una conferenza).

  1. Mancano didascalie per l'audio
  2. Manca sincronizzazione

Mancano didascalie per l'audio

Categoria:

Percezione

Causa:

Un file multimediale con una voce narrante privo di sottotitoli, didascalie e di una trascrizione completa del testo narrato.

Tipo di fallimento:

L'utente non avrebbe modo di fruire delle informazioni fornite via audio.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Aggiungere al file multimediale anche la trascrizione della traccia audio vocale. Questo può essere fatto semplicemente aggiungendo un link ad una pagina con la trascrizione testuale o usando il tag OBJECT. Questa soluzione però non è adatta ai casi in cui la narrazione è sincronizzata con le immagini video. In tali casi è necessario procedere ad una titolazione del filmato, arricchendo scena per scena con i sottotitoli (descrizione testuale dei dialoghi) e didascalie (descrizione testuale di altri suoni importanti delle scene). Linguaggi come SMIL permettono di realizzare una sincronizzazione sofisticata tra i vari canali.

Manca sincronizzazione

Categoria:

Percezione. Controllo da parte dell'utente

Causa:

Un file multimediale, sia video che audio, non contiene né è associato a testo equivalente sincronizzato alle scene video.

Tipo di fallimento:

L'utente non ha modo di percepire le informazioni narrative (i dialoghi) né quelle relative a suoni importanti nelle scene video (ad es. i passi dell'assassino che si avvicina alle spalle della vittima), nel momento in cui vede la scena.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Arricchire il materiale multimediale con descrizioni testuali sincronizzate con le scene video. Procedere ad una titolazione del filmato, arricchendo scena per scena con i sottotitoli (descrizione testuale dei dialoghi) e didascalie (descrizione testuale di altri suoni importanti delle scene). Linguaggi come SMIL permettono di realizzare una sincronizzazione sofisticata tra i vari canali, incluso quello testuale.

Lista di barriere per Utenti disabili cognitivi

Categoria di utenti: Persone con abilità limitata di elaborare e ricordare informazioni, prendere decisioni o apprendere; includono disabili nell'apprendere (dislessici o disgrafici), con disturbi nell'attenzione, con disabilità nella crescita (es. autismo, Down) o con disturbi neurologici (es. Alzheimer).Questa categoria potrebbe includere anche persone che usano il sito sotto stress (ad es. con fretta in un ambiente rumoroso e pieno di distrazioni, o durante la guida di un'automobile).Inoltre la categoria può includere anche visitatori del sito di una lingua straniera.

  1. Mancanza di didascalie del video
  2. Link generici
  3. Link ambigui
  4. Mancanza di link interni
  5. Assenza di icone
  6. Testo complesso
  7. Sito complesso
  8. Troppi link
  9. Campi di testo
  10. Nuove finestre
  11. Temporizzazioni troppo brevi
  12. Suddivisione in sezioni
  13. Pagina solo testo

Mancanza di didascalie del video

Categoria:

Percezione

Causa:

Un file multimediale con un video o un'animazione è privo di descrizione testuale delle scene.

Tipo di fallimento:

L'utente non ha modo di scorrere di nuovo il filmato e poter leggere, con calma e alla velocità più adatta a lui/lei, la descrizione testuale delle scene, e di quello che vi accade. O chi dice quale frase.

Rimedio:

Arricchire il materiale multimediale con descrizioni testuali sincronizzate con le scene video. Procedere ad una titolazione del filmato, arricchendo scena per scena con didascalie (descrizione testuale di eventi nella scena che sono rilevanti: ad es. la ripresa dei piedi silenziosi dell'assassino che si avvicina alle spalle della vittima). Linguaggi come SMIL devono essere usati in modo da rendere esplicita alla tecnologia assistiva la presenza di tali testi e permettono di realizzare una sincronizzazione sofisticata tra i vari canali, incluso quello testuale.

Alternativamente, o in aggiunta, predisporre del materiale audio, sempre sincronizzato al video e compatibile con le altre tracce audio eventualmente presenti, che fornisca le descrizioni mancanti (ad es. con una voce di sfondo).

Link generici

Categoria:

Utilizzazione

Causa:

La pagina contiene dei link con etichette poco informative (ad es. "clicca qui", "dettagli", "di più").

Tipo di fallimento:

I link generici attirano l'occhio, che ci si sofferma sopra. Però non sempre l'utente è in grado di esaminare, contestualmente, il testo o le immagini vicine al link. Col risultato analogo alla visione dell'etichetta del link in maniera a-contestuale.

Effetto:

Riduzione anche lieve dell'efficacia.

Rimedio:

Modificare le etichette dei link in modo da renderle informative. Non usare "clicca qui", ma piuttosto "dettagli sul prodotto XYZ".

Link ambigui

Categoria:

Utilizzazione

Causa:

La pagina contiene dei link con etichette ambigue (ad es. "clicca qui", "dettagli", "di più" ripetuti più volte).

Tipo di fallimento:

I link attirano l'occhio, che ci si sofferma sopra. Però non sempre l'utente è in grado di esaminare, contestualmente, il testo o le immagini vicine al link. Col risultato analogo alla visione dell'etichetta del link in maniera a-contestuale.

Inoltre l'utente potrebbe erroneamente attivare il link sbagliato, perché gli/le sembra che sia quello che aveva visto qualche istante prima.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Modificare le etichette dei link in modo da renderle informative. Non usare "clicca qui", ma piuttosto "dettagli sul prodotto XYZ".

Se proprio ciò non fosse possibile, almenu usare l'attributo A/@TITLE per differenziare i link.

Mancanza di link interni

Categoria:

Utilizzazione, controllo da parte dell'utente

Causa:

La pagina, relativamente complessa e ricca di contenuto che spesso non viene tutto visualizzato insieme, manca di link interni alla pagina che permettano all'utente di saltare di sezione in sezione, o di ritornare in testa alla pagina.

Tipo di fallimento:

L'utente farà fatica a comprendere la struttura del documento, e a ricordare quale sezione contiene quale informazione.

Farà anche fatica a scorrere il documento e a riconoscere l'inizio o la fine di una sezione.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Alla fine di ciascuna sezione della pagina includere dei link per poter saltare alla fine della successiva sezione, all'inizio della sezione appena vista, in testa o alla fine della pagina.

Assenza di icone

Categoria:

Comprensione

Causa:

La pagina manca di icone associate ai link o alle parti importanti e ricorrenti della pagina. La pagina può anche avere pochi colori che aiuterebbero a distinguere le diverse parti di cui essa si compone.

Le pagine "solo testo" normalmente hanno questo difetto.

Tipo di fallimento:

L'utente ha difficoltà nel comprendere la funzione di ciò che osserva (ad es. il testo di un link, soprattutto se l'aspetto grafico è diverso da quanto atteso). Viene quindi speso del tempo e della fatica per decidere se è o meno utile soffermarsi su quell'elemento o se è utile attivarlo.

Inoltre l'utente farà fatica a ricordarsi, la volta successiva in cui incontra quel componente, la sua funzione.

Rimedio:

Accoppiare a ciascun link un'icona in modo da facilitarne l'identificazione e il riconoscimento.

Usare diversi colori di sfondo per evidenziare parti diverse delle pagine.

Testo complesso

Categoria:

Comprensione

Causa:

La pagina contiene del testo che è complesso da leggere per via della struttura delle frasi, per via dei termini difficili usati, per via delle frequenti abbreviazioni ed acronimi, o perché lungo e male strutturato, o per i frequenti errori ortografici.

Tipo di fallimento:

L'utente avrà molta difficoltà nel comprendere il materiale proposto e di navigarci.

Effetto:

Riduzione, anche totale, dell'efficacia. Riduzione drastica della produttività.

Rimedio:

Semplificare quanto possibile la struttura delle frasi e la terminologia adottata (evitando il gergo specialistico). Verificare la correttezza ortografica.

Fornire una narrazione audio del testo, con una voce naturale.

Ricordarsi di includere (mediante ABBR/@TITLE) lo scioglimento di tutte le sigle utilizzate. Appropriato sarebbe anche il fornire un glossario con la definizione (semplice) dei termini non comuni utilizzati.

Sito complesso

Categoria:

Comprensione

Causa:

Il sito è organizzato in maniera complessa, probabilmente a causa della ricchezza degli argomenti trattati.

Tipo di fallimento:

L'utente avrà molta difficoltà nel comprendere il materiale proposto e di navigarci.

Effetto:

Riduzione, anche totale, dell'efficacia. Riduzione drastica della produttività.

Rimedio:

Semplificare quanto possibile l'architettura informativa del sito. Ricordarsi di togliere tutto quanto non serve all'utente.

Fornire delle briciole di pane ovunque, con delle voci non ambigue, informative e facili da comprendere. Fare in modo che le briciole di pane siano facilmente visibili e distinguibili dal resto della pagina.

Troppi link

Categoria:

Comprensione, Controllo da parte dell'utente

Causa:

Troppi link nella pagina, talvolta non bene organizzati in gruppi.

Tipo di fallimento:

Il numero elevato di link costringe l'utente ad un'analisi lunga e faticosa di ciascuno di essi.

Gli utenti sono costretti ad uno sforzo di lettura e memorizzazione dei vari link prima di poter decidere e scegliere il più rilevante. Il problema è acuito dall'assenza di uso di icone e colori appropriati, e dall'uso di terminologia e parole di difficile lettura o comprensione.

Effetto:

Il problema influenza ovviamente la produttività e la soddisfazione; ma anche l'efficacia ne viene compromessa soprattutto se il problema si ripete dato che l'utente si stanca e rischia di confondersi e quindi commette più errori e la sua motivazione nell'usare il sito si riduce.

Rimedio:

Occorre riorganizzare i link suddividendoli in sezioni/categorie. Nella stessa pagina introducendo delle liste (UL) o DIV separate, introducendo dei titoli di categoria (con degli H2-H3). Eventualmente aggiungendo dei link intra-pagina (A/@href che punta ad un A/@name), eventualmente nascosti, per poter passare da un gruppo al successivo o al precedente. In pagine diverse rendendo più profondo il sito con delle pagine intermedie. Deve essere possibile per l'utente esaminare sinteticamente un blocco di link e decidere solo dal titolo del blocco se i link che esso contiene sono rilevanti o meno.

Inoltre bisogna supportare un layout liquido in modo che l'utente possa ingrandire il testo a piacimento, accorciando le righe di testo (utile per gli utenti di ingranditori di schermo) senza richiedere scrolling orizzontale.

Campi di testo

Categoria:

Utilizzazione

Causa:

La pagina contiene delle form che hanno dei campi di testo privi di esempi.

Tipo di fallimento:

L'utente farà fatica a capire come compilare correttamente il campo.

Effetto:

Gli errori di compilazione aumenteranno, riducendo quindi l'efficacia e la produttività.

Rimedio:

Fornire, come default e magari in maniera che scompaia una volta che si clicca il campo, un esempio di corretta compilazione.

Nuove finestre

Categoria:

Utilizzazione

Causa:

La pagina contiene del codice (HTML o JavaScript) che apre nuove finestre quando l'utente attiva dei link o pulsanti.

Tipo di fallimento:

L'utente non si accorge che il contesto di interazione è cambiato, e che quindi è cambiato sia il contenuto che i comandi possibili.

Questo è tanto più grave quanto inaspettate sono le nuove finestre (ad es. finestre pop-up che c'entrano poco con il compito dell'utente).

Anche il pulsante BACK del browser non funziona più, e questo toglie un'"ancora di salvezza" all'utente.

Effetto:

Riduzione della efficacia.

Rimedio:

Evitare di aprire nuove finestre in generale.

Se lo si deve proprio fare, fare in modo che sin dall'inizio della nuova pagina sia chiaro all'utente che si tratta di una nuova finestra e dargli/le modo di chiuderla in maniera chiara e inequivocabile.

Temporizzazioni troppo brevi

Categoria:

Utilizzazione

Causa:

Il comportamento del server è di causrae un refresh della pagina, magari con modifica del contenuto, senza che ci sia stato un qualche evento causato dall'utente per attivare tale comportamento.

Tipo di fallimento:

L'utente che ci mette più tempo del previsto per svolgere una determinata azione (ad es. consultare una pagina e successivamente premere un pulsante "accetto") si trova nella situazione di non poter procedere perché il sistema ha cambiato stato di propria iniziativa.

Effetto:

Riduzione anche totale dell'efficacia.

Rimedio:

Evitare le temporizzazioni automatiche che cambiano stato alla pagina senza che l'utente le abbia richieste esplicitamente.

Suddivisione in sezioni

Categoria:

Comprensione, controllo da parte dell'utente

Causa:

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

Tipo di fallimento:

la presenza di titoli ben marcati per distinguere tra loro varie parti della pagina aiuterebbe l'utente nel decidere a cosa porre l'attenzione e come proseguire l'interazione.

Effetto:

Riduzione della produttività.

Rimedio:

Per ogni tipo di contenuto (ad es. barra globale, briciole di pane, gruppo di link, sequenza di paragrafi) aggiungere un tag H1-H6.

Rispettare l'ordine: non mettere un H3 dopo un H1.

Pagina solo testo

Categoria:

Controllo da part dell'utente

Causa:

La pagina contiene un link che porta ad una pagina solo del contenuto testuale. Talvolta c'è modo di cambiare i colori e la dimensione del testo.

Spesso però la pagina solo testo contiene meno materiale, meno link e minori possibilità di accedere ai contenuti del sito di quanto permetta la pagina grafica.

Tipo di fallimento:

L'uso del solo testo non facilita la leggibilità e la comprensibilità della pagina.

Effetto:

Riduzione marcata dell'efficacia.

Rimedio:

Evitare di costringere l'utente a dover ricorrere a questa pagina per consultare il sito. Nel caso fare in modo che questa pagina alternativa usi i colori e icone (ben scelte) per facilitarne l'utilizzo.

Lista di barriere per Utenti di browser senza JavaScript

Categoria di utenti: Utenti di browser o sistemi che non sono in grado di elaborare istruzioni JavaScript. Ad es. microbrowser a bordo di telefonini o PDA; ad es. utenti di sistemi proxy, gateway o transcoder.Anche agenti artificiali, come gli spider dei motori di ricerca, o i sistemi di test automatizzati, si trovano nella situazione di non poter elaborare istruzioni JavaScript.

  1. Menu dinamici in JavaScript
  2. Menu a cascata
  3. Eventi mouse
  4. Form popolata automaticamente
  5. Form con redirect
  6. Validazione dei campi
  7. Campi nascosti
  8. Nuove finestre
  9. Controlli del browser disabilitati

Menu dinamici in JavaScript

Categoria:

Utilizzazione

Causa:

La pagina contiene del codice JavaScript che, non appena l'utente posiziona il focus dell'interazione su un elemento, viene aperto un menu in una determinata zona della pagina.

Tipo di fallimento:

L'utente non riuscirà proprio ad usare le funzionalità offerte del menu, dato che esso non si attiva.

Effetto:

Azzeramento assoluto dell'efficacia.

Rimedio:

Fare in modo che tutte le opzioni di navigazione e i comandi operativi (ad es. i comandi da menu) siano attivabili anche disattivando JavaScript. Magari offrendo in una sezione separata della pagina dei link o pulsanti ridondanti. Far in modo che tale pagina sia raggiungibile dalla pagina originale anche se javaScript è disabilitato.

Menu a cascata

Categoria:

Utilizzazione

Causa:

La pagina contiene dei menu a cascata (implementati con delle SELECT annidate o mediante codice JavaScript).

Tipo di fallimento:

Se il menu è implementato in JavaScript, i menu non saranno proprio utilizzabili.

Effetto:

Riduzione totale dell'efficacia.

Rimedio:

Evitare i menu in cascata; eventualmente realizzare dei menu separati, meglio ancora se appiattiti (barre di navigazione con le voci esplicite) o basati su radiobutton.

Eventi mouse

Categoria:

Utilizzazione

Causa:

La pagina si basa su codice JavaScript per ottenere determinati effetti. Le routine vengono invocate mediante gestori di eventi legati al mouse (es. "onclick", "onmouseover", "onmouseout", ...).

Tipo di fallimento:

L'utente non riuscirà ad usare proprio le funzionalità attivabili con i gestori di eventi.

Effetto:

Riduzione, anche totale, dell'efficacia.

Rimedio:

Usare anche i gestori di eventi logici ("onfocus", "onkeypress", ...).

Meglio ancora se le funzionalità fossero rese disponibili anche senza JavaScript.

Form popolata automaticamente

Categoria:

Utilizzazione

Causa:

La pagina contiene delle form in cui alcuni campi o controlli vengono popolati automaticamente, mediante codice JavaScript. Ad es. una volta che viene scelta la provincia di residenza, la lista dei comuni viene ristretta solamente ai comuni della provincia scelta.

Tipo di fallimento:

Se l'utente usa un browser privo di interprete JavaScript la form può risultare non utilizzabile.

Effetto:

Riduzione anche totale dell'efficacia.

Rimedio:

Fare in modo che la form possa essere usata anche senza JavaScript.

Form con redirect

Categoria:

Utilizzazione

Causa:

La pagina contiene delle form in cui alcuni controlli (campi o menu a tendina implementati con SELECT), una volta che vengono utilizzati, causano un submit al server il quale spedisce una nuova pagina al browser. Questo comportamento è basato su gestori di eventi JavaScript.

Tipo di fallimento:

L'utente non potrà proprio usare la form, dato che le modifiche che il server ne apporterebbe non sono disponibili.

Effetto:

Azzeramento totale dell'efficacia.

Rimedio:

Se possibile fare a meno dell'invio intermedio dei dati al server. Ove ciò non fosse possibile, adottare tutti gli accorgimenti necessari per limitare le conseguenze negative: usare i tag H1-H6 e DIV per suddividere in sezioni il contenuto della pagina, usare gli skip-links per permettere all'utente di saltare oltre barre di navigazione e materiale preliminare, fornire i controlli della form di ACCESSKEY per poter spostare direttamente il focus su di essi, includere le etichette dei controlli nel tag LABEL.

Validazione dei campi

Categoria:

Utilizzazione

Causa:

La pagina contiene una form i cui campi vengono validati esclusivamente mediante JavaScript.

Tipo di fallimento:

Se il codice JavaScript blocca l'invio dei dati, allora l'utente non potrà proprio inviare i dati della form e quindi probabilmente raggiungere il proprio obiettivo.

Se invece il codice JavaScript non è bloccante, l'utente potrà usare la form ed inviare i dati, ma determinate verifiche sui dato potrebbero non essere fatte, fornendo quindi dei dati errati al server.

Effetto:

Riduzione, anche totale, dell'efficacia e della produttività.

Rimedio:

Realizzare, sempre, anche la validazione dei dati lato server per assicurarsi che i dati elaborati siano "buoni". E rendere la validazione in JavaScript (lato client) non necessaria.

La validazione lato client è utile per fornire delle risposte immediate all'utente, nel caso di errori di compilazione.

Campi nascosti

Categoria:

Utilizzazione

Causa:

La pagina contiene una form che ha dei controlli nascosti (HIDDEN) che vengono popolati mediante JavaScript subito prima dell'invio dei dati.

Tipo di fallimento:

L'utente non potrà inviare i dati al server, dato che quest'ultimo si aspetta anche i campi nascosti.

Rimedio:

Evitare di usare JavaScript per popolare i campi nascosti per inviare dei dati al server.

Nuove finestre

Categoria:

Utilizzazione

Causa:

La pagina contiene del codice (HTML o JavaScript) che apre nuove finestre quando l'utente attiva dei link o pulsanti.

Tipo di fallimento:

Se la finestra viene aperta mediante JavaScript, allora l'utente non ha proprio modo di fruire di quei contenuti.

Effetto:

Riduzione totale dell'efficacia.

Rimedio:

Evitare di aprire nuove finestre in generale e tantomeno usando JavaScript.

Se lo si deve proprio fare, fare in modo che sin dall'inizio della nuova pagina sia chiaro all'utente che si tratta di una nuova finestra e dargli/le modo di chiuderla.

Controlli del browser disabilitati

Categoria:

Controllo da parte dell'utente

Causa:

La pagina è stata aperta in una nuova finestra del browser dove i controlli tipici del browser non ci sono (back, next, refresh, ecc).

Tipo di fallimento:

L'utente non potrà proprio accedere alla pagina, dato che per aprirla in questo modo è necessario che il browser esegua codice JavaScript.

Effetto:

Riduzione dell'efficacia.

Rimedio:

Non disabilitare mai tali controlli.

Solamente nel caso di finestre temporanee, dove il primo link/pulsante permetta di chiuderle, è ragionevole pensare che i controlli normali vengano disabilitati.

Come procedere

Sulla base delle categorie di utenti da considerare, viene selezionato l'elenco delle possibili barriere da valutare. Dopo aver deciso quali scenari d'uso del sito considerare (nel caso di un'applicazione web è conveniente esaminare i "casi d'uso", o use case, previsti per il sistema, mentre per un sito informativo occorre scegliere a campione alcuni esempi di esigenze informative) il valutatore determina anche quali sono le pagine da esaminare.

A questo punto il valutatore procede in maniera sistematica, pagina per pagina, e cerca di capire se una qualche barriera può emergere dalla pagina sotto osservazione. In caso affermativo, il valutatore avrà anche modo (in base al contenuto e ruolo della pagina) di capire l'impatto della barriera sull'utente e sui suoi possibili compiti, e quindi produrre anche un livello di gravità della barriera. È anche facile per il valutatore associare un opportuno indice di prestazione che viene influenzato dalla presenza della barriera (cioè efficacia, produttività, soddisfazione o sicurezza). Si veda la sezione successiva per maggiori dettagli su come assegnare una gravità ai problemi riscontrati durante un'analisi.

Si noti che la stessa causa può causare più di una barriera.

Nel caso di disponibilità di più valutatori è preferibile procedere come nella valutazione euristica (Preece et al., 2002; Nielsen, 1994,2002; ITTATC, 2004) e cioè:

  1. i valutatori si accordano sulle categorie di utenti da considerare, e sulle pagine da valutare (eventualmente selezionando alcuni casi d'uso del sito)
  2. ciascun valutatore dedica 1-2 ore ad esplorare il sito per prenderne visione e familiarizzare con i possibili scopi e compiti
  3. ciascun valutatore, indipendentemente dagli altri esamina le pagine, le "incrocia" con le possibili barriere per ciascuna categoria di utenti, identifica quindi le eventuali barriere e ne associa dei livelli di gravità
  4. alla fine i vari valutatori si riuniscono e procedono a fondere le liste di problemi; solo se tutti sono d'accordo a che una segnalazione di problema sia effettivamente da cancellare dalla lista di procede alla sua rimozione; nel caso di mancato accordo per la gravità di un problema si deciderà per produrre un valore medio.

Assegnazione di livelli di gravità ai problemi

In quasi tutti i metodi di valutazione dell'usabilità (eccetto la valutazione della conformità dell'accessibilità) è necessario procedere all'assegnazione di un livello di gravità ai problemi che vengono riscontrati. Questo serve onde poter distinguere tra problemi gravi e meno gravi, e poter quindi fornire delle raccomandazioni mirate e più utili a chi poi dovrà pensare a come risolvere i problemi.

Onde valutare la gravità di un problema di usabilità si suggerisce di considerare due parametri, l'impatto che un problema può avere sull'efficacia, produttività e sicurezza di un utente che sta svolgendo un determinato compito in una determinata situazione operativa e la frequenza con cui quel problema si presenta all'utente durante lo svolgimento di quel compito.

Usando una scala da 1 a 3 (3 per l'effetto peggiore) associata a ciascuno dei due parametri, si può poi con la tabella 1 derivare una classificazione della gravità che permette di distinguere tra problemi minori, seri e critici. Tale distinzione potrà poi venir usata dagli sviluppatori del sito per derivare altri tipi di giudizi (ad es. di priorità o urgenza).

Figura 1: Tabella per calcolare la gravità di un difetto
impattofrequenzagravità
11minore
12minore
13serio
21serio
22serio
23critico
31critico
32critico
33critico

Si noti come questi giudizi, essendo basati su impatto rispetto ad efficacia o sicurezza, e su frequenza all'interno di un compito, permettono di derivare delle conclusioni sul grado di efficacia, produttività, soddisfazione e sicurezza che il sistema valutato supporta, e quindi di usabilità. Ovviamente è a carico del valutatore il determinare quale valore associare per ciascuno dei due parametri.

Per quanto riguarda l'impatto, i valori verranno assegnati usando i seguenti criteri di massima:

  1. la presenza del problema viene notata dall'utente considerato, ma ci sono facili modi per aggirarla od evitarla. Esso non incide significativamente sulle capacità dell'utente di raggiungere con successo il termine del compito. Può invece incidere sull'efficienza con cui l'utente svolge il compito e/o sulla sua soddisfazione.
  2. la presenza del problema è notata ed incide significativamente sull'efficacia e/o sicurezza. L'utente non riesce ad aggirarlo facilmente, o ad evitarlo. Per uscire dalla situazione problematica l'utente può necessitare di notevole tempo, vari tentativi e ingegno. Il problema rende difficile, faticoso e/o rischioso il proseguimento del compito, ed è facile che l'utente compia degli errori. Il problema incide sicuramente e marcatamente su efficacia e/o sicurezza.
  3. si tratta di una barriera che porta molto spesso a rinunciare al raggiungimento dello scopo: gli errori possono essere molti e con gravi conseguenze; vie alternative non esistono. L'impatto negativo su efficacia e sicurezza è elevato.

Si tenga conto che nell'assegnare il livello di impatto è necessario aver ipotizzato il livello di conoscenza ed esperienza che l'utente considerato possegga, sia relativamente all'uso di Internet e relativa tecnologia che relativamente all'uso del sito; sarà rispetto a questi livelli che l'impatto dovrà essere determinato.

Per la frequenza (riferita al numero di volte in cui il problema compare durante l'esecuzione di un compito) invece i valori possono essere:

  1. il problema si manifesta raramente e non sempre durante lo svolgimento del compito; in pochi e marginali casi esso si manifesta. Dunque esso incide in maniera molto limitata sulla produttività e sulla soddisfazione.
  2. il problema si verifica ogni volta che si svolge quel compito. Può incidere significativamente su produttività e su soddisfazione.
  3. il problema si verifica più volte durante lo svolgimento del compito. Sicuramente incide sulla produttività, facendola calare marcatamente; e altrettanto di sicuro incide sulla soddisfazione.

Si noti come per l'efficacia e la sicurezza, solo l'impatto debba essere considerato; mentre sia l'impatto che la frequenza devono essere valutati per determinare l'influenza sulla produttività e sulla soddisfazione.

Rapporto da produrre

Il rapporto da produrre deve contenere una prima sezione introduttiva in cui si spiega cosa si è fatto, che scenari e categorie di utenti si sono considerati e perché.

Successivamente si indicano chiaramente le pagine considerate.

Nella sezione "Sommario" vengono elencati i difetti più gravi scoperti, le loro conseguenze e le raccomandazioni del valutatore ai gestori del sito.

Nella sezione di dettaglio invece vengono elencate tutte le barriere riscontrate, ordinate per categoria di utente a cui fanno riferimento e per pagina considerata. Ciascuna barriera va descritta fornendo:

  1. una chiara descrizione del fallimento e delle sue conseguenze
  2. una chiara indicazione (ove possibile) della diagnosi (cioè indicazione delle cause della barriera), correndando il rapporto di videate del sito analizzato
  3. eventuali suggerimenti su come risolvere il problema.

Ricordarsi di segnalare le soluzioni interessanti e positive che si sono riscontrate nel sito, onde evitare che eventuali rifacimenti del sito le facciano scomparire.

Bibliografia

DRC.
Formal investigation report: web accessibility.
Disability Rights Commission, www.drc-gb.org/publicationsandreports/report.asp, April 2004.
Visited Jan. 2005.
J. Dumas and J. Redish.
A practical guide to usability testing.
Intellect Ltd., 1999.
W.D. Gray and M.C. Salzman.
Damaged merchandise: a review of experiments that compare usability evaluation methods.
Human-Computer Interaction, 13 (3): 203-261, 1998.
ITTATC.
Evaluating for accessibility.
Information Technology Technical Assistance and Training Center, www.ittatc.org/technical/access-ucd/evaluate.cfm#standards, 2004.
Visited Jan. 2005.
J. Nielsen.
Heuristic evaluation.
www.useit.com/papers/heuristic, 2002.
Visited Jan. 2005.
Jakob Nielsen.
Usability engineering.
Academic Press, Boston, MA, 1993.
Jakob Nielsen.
Heuristic evaluation.
In J. Nielsen and R.L. Mack, editors, Usability Inspection Methods. John Wiley and Sons, 1994.
Nielsen Norman Group.
Beyond ALT Text: Making the Web Easy to Use for Users with Disabilities.
www.nngroup.com/reports/accessibility/, Oct 2001.
Mark Pilgrim.
Dive into accessibility.
diveintoaccessibility.org/day_1_jackie.html, 2002.
Visited Jan. 2005.
J. Preece, Y. Rogers, and H. Sharp.
Interaction design.
John Wiley and Sons, 2002.
M. Rosson and J. Carrol.
Usability Engineering Scenario-based development of human-computer interaction.
Morgan Kaufmann, 2002.
Jeffrey Rubin.
Handbook of usability testing.
Wiley, Technical Communication Library, 1994.
UIC.
Unione Italiana dei Ciechi, Osservatorio Siti Internet.
www.uiciechi.it/osi/Lavori/index.asp, 2005.
UsabilityNet.
Methods table.
www.usabilitynet.org/tools/methods.htm, 2003.
Visited Jan. 2005.
W3C/WAI.
How people with disabilities use the web.
World Wide Web Consortium -- Web Accessibility Initiative, w3.org/WAI/EO/Drafts/PWD-Use-Web/20040302.html, March 2004.

Tabelle di supporto per l'analisi

Le seguenti tabelle possono essere usate come guida per l'analisi. Bisogna ovviamente replicarle per ciascuna pagina o ciascun compito considerato.

Tabella di valutazione per Utenti non vedenti

Tabella da compilare durante una valutazione per Utenti non vedenti
Pagina/Compito:
BarrieraImpattoFrequenzaSeverità
Immagini ricche senza testo alternativo
Mancanza di didascalie del video
Colore essenziale
Frame inaccessibili
Materiale in movimento
Immagini funzionali in sfondo
Immagini funzionali prive di testo
Link generici
Link ambigui
Menu dinamici in JavaScript
Eventi mouse
ASCII art
Titoli spaziati
Troppi link
Form con redirect
Link non separati
Nuove finestre
Form senza LABEL
Temporizzazioni troppo brevi
Tabelle dati
Tabelle di impaginazione
Pagine senza titoli
Frame senza titolo
Marcatura della lingua
Suddivisione in sezioni
Immagini come titoli
Mancanza di tasti rapidi
Skip links
Pagina solo testo
Controlli del browser disabilitati

Tabella di valutazione per Utenti ipovedenti

Tabella da compilare durante una valutazione per Utenti ipovedenti
Pagina/Compito:
BarrieraImpattoFrequenzaSeverità
Immagini ricche malposizionate
Immagini ricche incluse nello sfondo
Contrasto visivo insufficiente
Materiale in movimento
Immagini funzionali in sfondo
Immagini funzionali prive di testo
Menu dinamici in JavaScript
Mancanza di link interni
Righe di testo lunghe
Troppi link
Form con redirect
Form ampie
Finestre sovrapposte
Temporizzazioni troppo brevi
Immagini come titoli
Mancanza di tasti rapidi
Testo non ridimensionabile
Layout non ridimensionabile
Skip links
Controlli del browser disabilitati

Tabella di valutazione per Utenti daltonici

Tabella da compilare durante una valutazione per Utenti daltonici
Pagina/Compito:
BarrieraImpattoFrequenzaSeverità
Colore essenziale
Contrasto visivo insufficiente

Tabella di valutazione per Utenti disabili motori

Tabella da compilare durante una valutazione per Utenti disabili motori
Pagina/Compito:
BarrieraImpattoFrequenzaSeverità
Menu a cascata
Eventi mouse
Mancanza di link interni
Troppi link
Link troppo vicini
Nuove finestre
Form senza LABEL
Temporizzazioni troppo brevi
Mancanza di tasti rapidi
Controlli del browser disabilitati

Tabella di valutazione per Utenti non udenti

Tabella da compilare durante una valutazione per Utenti non udenti
Pagina/Compito:
BarrieraImpattoFrequenzaSeverità
Mancano didascalie per l'audio
Manca sincronizzazione

Tabella di valutazione per Utenti disabili cognitivi

Tabella da compilare durante una valutazione per Utenti disabili cognitivi
Pagina/Compito:
BarrieraImpattoFrequenzaSeverità
Mancanza di didascalie del video
Link generici
Link ambigui
Mancanza di link interni
Assenza di icone
Testo complesso
Sito complesso
Troppi link
Campi di testo
Nuove finestre
Temporizzazioni troppo brevi
Suddivisione in sezioni
Pagina solo testo

Tabella di valutazione per Utenti di browser senza JavaScript

Tabella da compilare durante una valutazione per Utenti di browser senza JavaScript
Pagina/Compito:
BarrieraImpattoFrequenzaSeverità
Menu dinamici in JavaScript
Menu a cascata
Eventi mouse
Form popolata automaticamente
Form con redirect
Validazione dei campi
Campi nascosti
Nuove finestre
Controlli del browser disabilitati

Commenti

Invia nuovo commento

Il contenuto di questo campo è privato e non verrà mostrato pubblicamente.