logo uniudUniversità degli studi di Udine - 2006/2007
Corso di Progettazione di siti web

Rapporto di valutazione euristica - volareweb

Masetto Alessandro


The goal of heuristic evaluation
is to find the usability problems
in the design so that they can be
attended to as part of
an iterative design process


Jacob Niesen

Rapporto di valutazione euristica del sito http://buy.volareweb.com/jsp/it/web/index/index.jsp

Masetto Alessandro [alemasetto(at)gmail.com]
Data stesura: 4 aprile 2007

Indice


Introduzione

Il sito di volareweblink esterno è stato sottoposto ad un'analisi euristica seguendo le dieci regole di Nielsen (Nielsen, 1990) riviste da Brajnik (Brajnik, 2005).
Verranno sotto proposte le violazioni rscontrate e gli eventuali rimedi.

Scenario, tipo di utente
L'utente in considerazione è un ragazzo italiano di età tra i 20 e 25 anni.
Il ragazzo ha una media competenza nelle tecnologie che riguardano internet, ha già effettuato diversi acquisti on-line utilizzando la sua carta di credito ed è interessato ad organizzarsi il viaggio verso una capitale europea.
Si trova a casa sua, utilizza un PC con Windows XP e Mozilla Firefox.
 
Classificazione dei livelli di gravità
La gravità delle violazioni delle euristiche è calcolata in maniera direttamente proporzionale al loro impatto e alla loro frequenza.
  1. problema minore: la presenza di questo problema viene notata dall'utente ma ci sono facili modi per aggirarlo od evitarlo se la si riconosce o ricorda; esso incide sulla produttività e sulla soddisfazione; non incide sull'efficacia né sulla sicurezza.
  2. problema serio: il problema viene notato ed esso ha una grossa influenza nel modo di proseguire il compito da parte dell'utente. Esso incide pesantemente sulla produttività e sulla soddisfazione. Può incidere anche sull'efficacia e sulla sicurezza, rendendo difficile, faticoso e/o rischioso il proseguimento del compito; è facile che l'utente compia degli errori. Spesso non è facile trovare delle vie alternative per ottenere lo scopo.
  3. problema critico: si tratta di un problema che porta molti utenti 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; è ancora più elevato su produttività e soddisfazione.

    Tabella per calcolare la gravità di un difetto
    Impatto Frequenza Gravità
    1 1 minore
    1 2 minore
    1 3 serio
    2 1 serio
    2 2 serio
    2 3 critico
    3 1 critico
    3 2 critico
    3 3 critico

    Legenda
    Icona Gravità
    problema minore Problema minore
    problema serio Problema serio
    problema critico Problema critico
    non valutabile, nessun problema Non valutabile (NV) o nessun problema

Perimetro dell'indagine

Sono state valutate le pagine più importanti (home page, orari, prenotazioni, acquisti); Lanalisi è stata eseguita tra il 3 e il 4 aprile 2007.


Le dieci euristiche:

  1. Visibilità dello stato del sistema
  2. Allineamento tra il mondo del sistema e quello reale
  3. Controllo da parte dell'utente e sua libertà
  4. Coerenza e standard
  5. Prevenzione di errori
  6. Riconoscimento piuttosto di memorizzazione
  7. Flessibilità e efficienza d'uso
  8. Design estetico e minimalista
  9. Aiutare l'utente nel riconoscere, diagnosticare e rimediare dagli errori
  10. Aiuto e documentazione

Visibilità dello stato del sistema link esterno

il sistema deve costantemente informare l'utente su ciò che sta succedendo, fornendo appropriato feedback in tempi ragionevoli.

Architettura

problema serio[serio] Dove mi trovo?
La struttura a schede aiuta molto nell'orientamento, ma non è sempre presente poichè il layout non è uniforme. La mancanza di breadcrubs accentua i problemi.

Rimedio:
Aggiungere le briciole di pane, rendere il layout uniforme.
 
problema critico[critico] La pagina ha un titolo informativo?
Le pagine non hanno un titolo informativo sulla barra in alto.. Alcune pagine hanno un titolo specificato all'interno che però non risulta abbastanza informativo; questo è dimostrato anche dal fatto che durante il test con utenti molti di essi si sono letteralmente persi.

Rimedio:
Specificare il titolo
 
problema critico[critico] Dove posso andare?
Problemi con collegamenti che hanno delle etichette non conformi alla risorsa alla quale puntano.

Esempio:
esempio
porta ad una pagina dove le possibili azioni sono:

esempio
che non sono esattamente la stessa cosa.


Rimedio:
Usare verbi e nomi adeguati
 
problema serio[serio] Ci sono link e pulsanti importanti che sono visibili senza dover fare scrolling?
Ci sono dei collegamenti importanti che non sono visibili normalmente. (es: Cambia prenotazione) ma in generale i collegamenti più importanti sono visibili gazie alla navigazione a schede.

Rimedio:
Posizionare i link importanti bene in vista.

Contenuto

problema minore[minore] cosa sto vedendo? Percependo?
In generale gli elementi che servono sono visibili, ma servirebbe una migliore organizzazione.
 
problema serio[serio] la pagina ha un chiaro obiettivo?
Alcuni problemi specialmente nella pagina "cambia prenotazione" in cui troviamo 2 possibili azioni: "visualizza itinerario" e " cambia itinerario" che non coincidono con le aspettative
 
non valutabile, nessun problema la cosa più importante della pagina si trova in alto?
Generalmente sì
 
non valutabile, nessun problema la pagina ha una chiara struttura (2-3 titoletti di sezione, titoletti chiari, parole evidenziate)?
 
non valutabile, nessun problema l'autore della pagina (persona o ente) è chiaramente indicato?
sì, in alto è evidente il logo della compagnia aerea
 
problema critico[critico] è indicata la data di aggiornamento/revisione della pagina?
no non è indicata

Rimedio:
Aggiungere la data di aggiornamento.
 
problema critico[critico] i nuovi contenuti della pagina sono chiaramente evidenziati? e le nuove pagine del sito sono evidenziate nella home?
le nuove pagine sì. I prezzi dei biglietti sono poco chiari. Non è possibile confrontare direttamente le tariffe. Calendario non chiaro.

Rimedio:
Migliorare la visibilità delle informazioni riguardanti i prezzi dei biglietti, offrire la possibilità di confrontare direttamente più tariffe.
 
problema serio[serio] se la pagina è il risultato di una compilazione di una form, è chiaro qual è stato l'esito?
Alcuni problemi sorgono dopo aver compilato la form principale. Non si capisce se non esitono voli nei giorni vicini a quello selezionato.

Presentazione

non valutabile, nessun problema posso percepire il testo? le immagini? i contenuti multimediali?
sì, i contenuti sono percepibili.
 
problema serio[serio] posso percepire i link, i pulsanti, i controlli delle form?
un piccolo problema con la form di ricerca orari: non è possibile sapere a priori che premendola senza selezionare nulla il sito visualizzerà tutti gli orari possibili.
 
problema minore[minore] si capisce che qualcosa è un link, un pulsante, un controllo?
generalmente sì, la sottolinetura aiuta ad identificare le ancore principali. Acquista ora no.

torna sù torna all'elenco

Allineamento tra il mondo del sistema e quello reale link esterno

Il sistema dovrebbe usare lo stesso linguaggio dell'utente, con parole, frasi e concetti familiari all'utente, puttosto di termini che sono orientati al sistema. Seguire le convenzioni del mondo reale, facendo sí che le informazioni appaiano in ordine naturale e logico.

Architettura

problema serio[serio] i link, pulsanti, controlli delle form hanno etichette appropriate?
Ambiguità riscontrate anche per mezzo del test su utenti nel significato di CONFERMA SSL.

esempio

Rimedio:
Questa scelta non dovrebbe competere all'utente.
 
non valutabile, nessun problema le categorie e i raggruppamenti (di informazioni, di link, di pulsanti, di controlli) hanno etichette appropriate?
In generale, sì.
 

Contenuto

problema critico[critico] il linguaggio è adatto all'audience?
Non sempre, CONFERMA SSL non è adeguato all'audience.

Rimedio:
Eliminare quell'etichetta.
 
problema critico[critico] viene indicato il momento in cui una certa informazione è stata pubblicata?
no, non viene indicato.

Rimedio:
Prevedere l'aggiunta di una data di pubblicazione delle informazioni.
 
non valutabile, nessun problema gli autori sono indicati? come li si può contattare?
c'è il numero del call-center ben visibile, mentre, seguendo il link "chi siamo" è possibile scoprire indirizzo e numero di telefono dell'ammistrazione.

Presentazione

problema serio[serio] vengono usate icone appropriate?
si potrebbe fare meglio

torna sù torna all'elenco

Controllo da parte dell'utente e sua libertàlink esterno

Gli utenti spesso invocano delle funzioni del sistema per errore e abbisognano delle uscite di emergenza chiaramente indicate in modo da abbandonare degli stati del sistema indesiderati senza dover passare attraverso un lungo dialogo. Si supportino azioni di undo/redo.

Architettura

non valutabile viene evitata una introduzione in Flash? la si può facilmente saltare?
NV
 
problema critico[critico] la pagina ha un pulsante "indietro"? oppure le briciole di pane?
a volte c'è a volte no. Spesso accade che non c'è e il comando del browser è disabilitato. Le Briciole di pane non ci sono. Solo nella sezione pagamento esiste un accenno ma non dà la possibilità di navigarci

Esempio:
esempio

Rimedio:
Non bloccare i controlli del browser, aggiungere le briciole di pane.
problema critico[critico] la pagina ha un link alla home?
Non è assolutamente visibile, benchè sia il logo della compagnia in alto.

Rimedio:
Rendere esplicito il collegamento alla home
non valutabile questi link/pulsanti funzionano correttamente anche all'interno di pagine basate su frame?
NV
 
 
problema critico[critico] le briciole di pane sono chiaramente indicate?
non ci sono; nella sezione pagamento viene accennato un percorso ma non permette di tornare indietro.
 
non valutabile se lo scaricamento della pagina richiede tempi lunghi, qualche porzione preliminare dei dati viene resa percepibile?
NV

Contenuto

problema critico[critico] i messaggi di errore suggeriscono come continuare?
no

Esempio:

esempio

Rimedio:
Presentare le date dei voli più vicini a quello selezionato
 
non valutabile eventuali restrizioni su browser o plug-in sono chiaramente indicate e correttamente gestite?
NV
 
problema critico[critico] il caricamento di immagini remote può essere disabilitato?
no
 
problema critico[critico] si può navigare solamente con la tastiera?
molto male o per nulla

Rimedio:
Aggiungere gli attributi @TABINDEX, togliere gli eventi in Javascript
 
problema critico[critico] ci sono acceleratori da tastiera?? sono chiaramente indicati?
no, non ci sono

Rimedio:
Aggiungere gli attributi @ACCESSKEY

Presentazione

non valutabile, nessun problema font, colori, animazioni, suoni sono usati in maniera appropriata?
 
problema critico[critico] gli utenti possono ridimensionare la finestra?
sì, ma in alcuni pop-up no

Esempio:

esempio pop up
 
problema critico[critico] gli utenti possono modificare la dimensione del testo?
No, il layout non è progettato per essere ridimensionato

Esempio:

esempio

Rimedio:
Usare CSS. Usare dimensioni relative e non assolute.
 
non valutabile gli utenti possono modificare le dimensioni dei frame?
NV

torna sù torna all'elenco

Coerenza e standard link esterno

Gli utenti non devono chiedersi se parole, situazioni o azioni diverse fanno riferimento alle stesse cose. Si seguano le convenzioni determinate dagli standard ufficiali o di fatto.

Architettura

non valutabile, nessun problema l'etichetta di un link o pulsante è coerente con il titolo della pagina destinazione?
in generale sì
 
problema serio[serio] il titolo di una pagina è coerente con il contenuto della pagina?
sì ma a volte impreciso

Contenuto

problema critico[critico] il contenuto è valido/vero?
Il contenuto non è valido sia per quanto riguarda il codice, sia per quanto riguarda le guide linea WCAG.

Rimedio:
Costruire pagine conformi agli standard e possibilmente alle linee guida WCAG.
 
 
problema serio[serio] la pagina o il sito è sufficientemente credibile?
In generale sì a causa della fama, ma i prezzi non sono chiari da subito e la sicurezza dei dati personali è messa a rischio
 
non valutabile il contenuto fa riferimento a fonti esterne ed indipendenti che sono credibili?
NV

Presentazione

non valutabile viene coerentemente usato lo stesso stile, colore, font per oggetti simili all'interno di questa pagina? del sito?
in generale sì

 
problema critico[critico] il layout della pagina è coerente nel sito?
no

Esempio:

esempio

Altro layout:

esempio2

Rimedio:
Usare lostesso layout.
 
non valutabile, nessun problema i colori dei link sono coerenti con le convenzioni di fatto?
in generale sì
 
 
problema critico[critico] ci sono delle convenzioni del web che sono violate?
in alcune parti sì per esempio il fatto di non aver messo chiari collegamenti alla home page

torna sù torna all'elenco

Prevenzione di errorilink esterno

Ancora meglio che dei buoni messaggi di errore è un attento progetto che previene gli errori.

Architettura

problema critico[critico] errori di navigazione (vicoli a fondo cieco, cicli, link non definiti, smarrirsi) vengono evitati?
mancanza di controllo del browser in alcune parti porta ad una situazione di stallo
 
problema critico[critico] le etichette dei link e pulsanti sono non-ambigui?
non abbastanza a volte (vedi pulsanti conferma, conferma ssl, cambia prenotazione)
 
non valutabile, nessun problema informazioni sull'attraversamento di un link vengono forniti in anticipo (dimensione della pagina, formati particolari, tipo di informazione - souno, animazione, video, PDF, ...)?
 
problema critico[critico] gli URL usano caratteri semplici (si evitano caratteri che non siano lettere, o nomi lunghi e complessi)?
no, l'URL non è assolutamente semplice!

http://buy.volareweb.com/jsp/it/web/index/index.jsp
 
non valutabile, nessun problema i frame sono evitati?
 
problema critico[critico] vengono fornite chiare ed esaurienti istruzioni su come compilare le form? sono adiacenti ai controlli delle form?
manca un aiuto chiaro sulla compilazione di alcune form.

Esempio:

esempio
Altro esempio :

esempio

Rimedio:
Indicare con chiarezza quali sono i campi obbligatori, cosa è necessario inserire, la formattazione.

Contenuti

problema critico[critico] nell'uso delle form gli errori vengono prevenuti (mediante menu, liste di scelte, ...)?
molto spesso no

Esempio (giorni inesistenti non dovrebbero essere presentati):

esempio

Altroesempio (nome del passeggero non obbligatorio!)

esempio

Rimedio:
Dire quali sono i campi obbligatori, usare Javascript per rimuovere dei giorni che non esistono.
 
non valutabile nell'uso di motori di ricerca, vengono forniti dei punti di partenza (suggerendo termini generali, codici di classificazione, ...)?
NV

Presentazione

problema serio[serio] posso percepire e capire che qualcosa è un controllo su cui è possibile operare?
certi controlli sono ambigui
 
problema serio[serio] e come lo si usa?
il pulsante "cerca" nella pagina orari non dà sufficienti indicazioni su come sfruttare le otenzialità di ricerca

torna sù torna all'elenco

Riconoscimento piuttosto di memorizzazionelink esterno

Rendere visibili gli oggetti, le azioni e le opzioni. L'utente non dovrebbe dover ricordarsi le informazioni relative ad una parte del dialogo nelle successive. Le istruzioni su come usare il sistema dovrebbero essere visibili o reperibili con facilità ogni volta che è appropriato.

Architettura

non valutabile i link sono troppi? sono presentati in maniera pesante?
no, non è un problema
 
non valutabile i tooltip con delle descrizioni più ricche sono disponibili?
NV

Contenuti

non valutabile il contenuto della pagina è differenziabile da etichette di link?
 
non valutabile è chiaro perchè una pagina è rilevante rispetto allo stadio dell'interazione?
 
non valutabile le figure hanno delle descrizioni che sono significative?
quelle poche che ci sono sì

Presentazione

problema critico[critico] i link e i controlli sono chiaramente visibili?
a volte no, per esempio non è chiaro che il logo collega alla home page
 
problema critico[critico] le immagini cliccabili sono facilmente riconoscibili?
come detto prima no
 
problema critico[critico] si può distinguere tra link inter- e intra-sito?
no

Rimedio:
Aggiungere un'icona particolare accanto ad un collegamento inter-sito.

torna sù torna all'elenco

Flessibilità e efficienza d'usolink esterno

Gli acceleratori da tastiera - non visibili da utenti principianti - spesso possono velocizzare l'interazione per utenti esperti, facendo sí che il sistema sia allo stesso tempo adatto agli uni e agli altri. Si permetta agli utenti di personalizzare le azioni più frequenti.

Architettura

problema critico[critico] le pagine possono essere incluse nei favoriti/segnalibri (bookmark) in maniera non ambigua?
no, avendo sempre lo stesso titolo non è immediata l'inclusione

Rimedio:
Specificare in maniera breve e precisa il titolo della pagina in funzione dei contenuti.
 
problema critico[critico] vengono offerti dei meccanismi di ricerca?
sì, ma spesso non danno le informazioni desiderate

Rimedio:
Migliorare la presentazione dei risultati

Contenuti

non valutabile, nessun problema gli utenti possono approfondire se - e solo se - lo desiderano?
sì, per esempio nelle spiegazioni delle tariffe
 
problema critico[critico] le pagine sono state realizzate in modo che possano essere reperite coi motori di ricerca?
no, mancano le parole chiave e le indicazioni.

Rimedio:
Aggiungere i tag META

Presentazione

problema serio[serio] gli utenti posssono ridimensionare la finestra?
non tutte
 
problema critico[critico] gli utenti possono modificare le dimensioni del testo?
no (vedi esempio sopra)

Rimedio:
Usare CSS e dimensioni relative.
 
non valutabile gli utenti possono ridimensionare i frame?
NV
 
problema critico[critico] gli utenti possono usare solamente la tastiera?
no

Rimedio:
Usare @TABINDEX e dare alternative agli eventi @ONCLICK
 
problema critico[critico] gli utenti possono usare gli acceleratori da tastiera?
no

Rimedio:
Usare @ACCESSKEY

torna sù torna all'elenco

Design estetico e minimalistalink esterno

I dialoghi non dovrebbero contenere informazioni che sono irrilevanti o raramente usate. Ogni componente informativo in un dialogo compete con gli altri, e diminuisce la loro visibilità relativa.

Architettura

problema serio[serio] i pulsanti e i link sono raggruppati in base alla loro funzione?
non sempre per esempio nella pagina prenotazioni c'è un doppio raggruppamento
 
non valutabile, nessun problema le cose meno importanti (paragrafi, link, pulsanti) sono minimizzati?
abbastanza
 
problema serio[serio] i termini che sono legati al web vengono evitati (es. "segui questo link", "clicca qui")?
no, per esempio nella pagina prenotazioni c'è scritto:

Clicca qui per leggere le CONDIZIONI DI ACQUISTO e di TRASPORTO Volareweb.com.

Contenuto

non valutabile, nessun problema la pagina è succinta?
abbastanza
 
non valutabile, nessun problema i dettagli sono posti in una pagina secondaria?
in generale sì,per esempio i detagli sulle tariffe o sulle condizioni contrattuali
 
non valutabile la pagina inizia con le conclusioni?
NV
 
non valutabile lunge liste vengono divise in blocchi?
NV
 
non valutabile ciascun paragrafo contiene una singola idea?

Presentazione

non valutabile, nessun problema le immagini inutili sono assenti?
in linea di massima sì
 
non valutabile le animazioni e lampeggiamenti sono evitati?
sì, non ci sono animazioni
 
non valutabile le animazioni Flash che sono inutili sono evitate?
NV

torna sù torna all'elenco

Aiutare l'utente nel riconoscere, diagnosticare e rimediare dagli errorilink esterno

I messaggi di errore devono essere espressi in un linguaggio semplice (non codici di errore), devono indicare con precisione l'errore, e suggerire in maniera costruttiva una soluzione.

Architettura

problema critico[critico] per gli errori di navigazione vengono dati dei suggerimenti costruttivi (es. link iniziali nel caso di nessun risultato da un motore di ricerca)?
no, ci si può trovare in un vicolo cieco come illustrato nel test con utenti e nell'esempio sopra
 
non valutabile vengono efferte delle spiegazioni naturali di ciò che è successo e perché?

torna sù torna all'elenco

Aiuto e documentazionelink esterno

Anche se è meglio se il sistema può venir usato senza documentazione, può essere necessario fornire degli aiuti e documentazione di riferimento. Questo tipo di informazione deve essere semplice da ricercare, focalizzata sui compiti degli utenti, elencare i passi concreti da eseguire, e non essere troppo grande come dimensione.

Architettura

problema critico[critico] quanto lontano è il materiale di aiuto? quanto bene esso è integrato nelle pagine?
non è immediato capire che un certo link porta a delle informazioni aggiuntive. Spesso manca l'indicazione su come procedere con esattezza. Ad esempio, nel caso in cui non si trovi un volo, non viene fornita nessuna indicazione su come trovarlo se non ricompilando la form o iterando l'operazione di avanzamento dei giorni.

Rimedio:
Fornire dei collegamenti a delle pagine di aiuto, aggiungere didascalie.
 
non valutabile è disponibile una mappa del sito?
 
problema critico[critico] viene data una descrizione delle caratteristiche di accessibilità del sito?
assolutamente no

Rimedio:
Modificare il sito e renderlo accessibile.
torna sù torna all'elenco

Tabella riassuntiva

Tabella riassuntiva delle violazione delle euristiche
Problema Impatto Frequenza Severità
Il pulsante INDIETRO del browser è disabilitato 3 3 grave
manca un collegamento esplicito alla pagina iniziale 3 3 grave
Deve essere visualizzata la data del volo più vicino 3 2 grave
Le pagine non hanno un titolo informativo 2 3 grave
Problemi con collegamenti che hanno delle etichette non conformi alla risorsa alla quale puntano. 3 2 grave
non è indicata la data di aggiornamento delle informazioni 2 3 grave
Linguaggio non conforme all'audience 3 2 grave
non ci sono le breadcrumbs 3 3 grave
i messaggi di errore non suggeriscono come rimediare 3 3 grave
il caricamento di immagini non può essere disabilitato 2 3 grave
non ci sono acceleratori da tastiera 3 3 grave
alcune finestre non sono ridimensionabili 3 3 grave
layout non ridimensionabile 3 3 grave
contenuto non valido / non conforme agli standard e guidelinea WCAG 3 3 grave
il layout non è coerente in tutto il sito 3 3 grave
alcune etichette sono ambigue 2 3 grave
alcune form non forniscono chiare indicazioni su come compilarle 3 3 grave
nelle form gli errori non vengono prevenuti 3 3 grave
non si distinguono i link inter-intra sito 2 3 grave
inclusione in segnalibri non automatica a causa del titolo uguale 3 3 grave
meccanismi di ricerca spesso inadeguati 3 2 grave
pagine non scansionabili da motori di ricerca 2 3 grave
testo non ridimensionabile 3 3 grave
materiale di aiuto poco strutturato, povero o inesistente 3 2 grave
nessuna descrizione di caratteristiche di accesibilità 2 3 grave
discrepanza tra CERCA LA TARIFFA e CERCA LA TARIFFA MIGLIORE 2 2 serio
Non è possibile confrontare direttamente le tariffe 2 2 serio
Radiobutton inutile 2 1 serio
Errori nella pagina cambio prenotazioni 2 1 serio
Form presenta giorni che non esistono. 1 3 serio
collegamenti importanti che non sono visibili normalmente 2 2 serio
form orari che non specifica il suo funzionamento 2 1 serio
icone non appropriate 1 3 serio
titolo all'interno della pagina impreciso 2 1 serio
Prezzi dei biglietti poco chiari 2 2 serio
termini legati al web 2 2 serio
Campi di testo senza etichette 1 2 minore
Calendario non chiaro 1 1 minore
Poca organizzazione degli elementi 1 1 minore
non si capisce che "Acquista ora" è un link 1 1 minore