Date post: | 02-May-2015 |
Category: |
Documents |
Upload: | rosangela-baroni |
View: | 233 times |
Download: | 1 times |
Web Usability Web Usability
Dott. Simone LazziniDott. Simone Lazzini Università di Pisa
Come si persegue la usability? Come si persegue la usability? ((Realizzazione e gestione di un sito web)Realizzazione e gestione di un sito web)
Str
ateg
ia
e fa
ttib
ilità
Management,Consulenti
1
Vis
ual
des
ign
Visual designer
3
Ese
rciz
io
del
sit
o
Web master
6
Ges
tio
ne
dei
ser
ver
Web farm
7S
vilu
pp
o
del
so
ftw
are
Systemintegrator
4 5Contenteditor
Ges
tio
ne
dei
co
nte
nu
ti
Web designer
2
Web
des
ign
&
use
r ex
per
ien
ce
Co
nn
etti
vit
àin
tern
et
Internet Service Provider
8
Comun
icaz
ione
UsabilitàUsabilità
Funz
iona
lità
Conte
nuto
AccessibilitàAccessibilità
Obi
ettiv
i
Archi
tettu
ra Ges
tione
Quali elementi di valutazione è possibile Quali elementi di valutazione è possibile analizzareanalizzare
Str
ateg
ia
e fa
ttib
ilità
Management,Consulenti
1
Vis
ual
des
ign
Visual designer
3E
serc
izio
d
el s
ito
Web master
6
Ges
tio
ne
dei
ser
ver
Web farm
7
Svi
lup
po
del
so
ftw
are
Systemintegrator
4 5Contenteditor
Ges
tio
ne
dei
co
nte
nu
ti
Web designer
2
Web
des
ign
&
use
r ex
per
ien
ce
Co
nn
etti
vit
àin
tern
et
Internet Service Provider
8
ContenutoIl contenuto informativo è corretto, e adeguato
agli scopi del sito?
ComunicazioneIl sito raggiunge i suoi
obiettivi di comunicazione?
AccessibilitàIl sito è di facile
accesso per tutti?
FunzionalitàLe funzioni del sito sono
adeguate e corrette?
GestioneL’operatività del sito
è ben gestita ?
ArchitetturaLa struttura e la navigazione
del sito sono adeguate?
UsabilitàIl sito è facile Il sito è facile
da usare?da usare?
Un primo modello di analisiUn primo modello di analisi
Quindi un sito è usabile quando è :Quindi un sito è usabile quando è :
Identificare i BISOGNIBISOGNI degli utenti
Progettare e valutare prodotti FACILI DA USARE
Identificare i FATTORI CHE MOTIVANO gli utenti
UTILEUTILE
FRUIBILEFRUIBILE
DESIDERABILEDESIDERABILE
Efficacia EfficienzaSoddisfazione
UtilitàUtilità
AppropriatezzaAppropriatezza
VelocitàVelocità
AffidabilitàAffidabilità
ScalabilitàScalabilità
Facilità d’usoFacilità d’uso
PiacevolezzaPiacevolezza
SemplicitàSemplicità
QUALI SONO LE DIMENSIONI DA CONSIDERAREQUALI SONO LE DIMENSIONI DA CONSIDERARE
Il sito deve essere strutturato in modo da richiedere
il minimo numero di passi per accedere all’informazione voluta tenendo presente il numero di elementi che l'utente
riesce a mantenere contemporaneamente in memoria (tipicamente un numero variabile da 4 a 7) e garantendo
comunque il minor tempo di accesso possibile.
UsabilityUsability e Architettura dell’informazione e Architettura dell’informazione
Struttura
Mappatura
Navigazione
L’analisi della Struttura del sitoL’analisi della Struttura del sitoLa rappresentazione avviene, di solito, mediante un diagramma ad albero, allo scopo di valutarne la adeguatezza
B C D EA
HOME
D1 D2 D3A2A1
A2.2 A2.3A2.1
1° livello
2° livello
3° livello
L’architettura strutturale “comunica” la relazione tra i contenuti di un sito web e il modo in cui questi sono espressi.
Aiuta a capire come si utilizza il sito.Rende accessibili e quindi più comprensibili i suoi contenuti informativi.
L’analisi della Struttura del sito – Gli scopiL’analisi della Struttura del sito – Gli scopi
Tre strutture di baseTre strutture di base1) Lineare Una pagina dopo l’altra.
Struttura adatta per costruire funzioni vincolanti: se, ad esempio, l’informazione A deve essere conosciuta prima della B, e la B prima della C, si crea un accesso lineare da A a C.
2) Gerarchica
Più percorsi mutuamente esclusivi
Adatta ad evidenziare le relazioni insieme/sotto insieme
Consente movimenti top-down / bottom-up.
3) A ragnatelaPagine collegate in modo da permettere riferimenti incrociati e salti avanti/indietro.Struttura che esalta le potenzialità dei sistemi interattivi.
Ma più la ragnatela è complessa, più aumentano le Ma più la ragnatela è complessa, più aumentano le difficoltà di orientamento per l’utente.difficoltà di orientamento per l’utente.
I livelloHOME
II Livello
I livello
I livello
II Livello
II Livello
II Livello II Livello II Livello
v
Navigando cerco un sito per valutare la possibilità di comprare una motosega:
Lo scenario di Krug:Lo scenario di Krug:
UTENSILI
Dove sono le motoseghe?
La struttura del sito presenta tre reparti…
CASALINGHIPRATO E
GIARDINO
Ogni volta che si aggiungono nuovi contenuti bisogna valutare la loro coerenza rispetto all’architettura complessiva del sito. Trovare una collocazione adatta o riprogettare l’architettura stessa.
Le possibili strutture possono essere moltissime ed avere i caratteri di ciascuna ma…
Seguendo il vostro intuito provate a vedere se la motosega si trova sotto UTENSILI… il livello successivo è?
UTENSILI A MOTORE
UTENSILI A MOTORE
…nella corsia UTENSILI A MOTORE cercate la
motosega ma???
UTENSILI MANUALIUTENSILI MANUALI
SMERIGLIARE E LEVIGARE
SMERIGLIARE E LEVIGARE
UTENSILIPRATO E
GIARDINO
UTENSILI A MOTORE
UTENSILI A MOTORE
UTENSILI MANUALIUTENSILI MANUALI
SMERIGLIARE E LEVIGARE
SMERIGLIARE E LEVIGARE
CASALINGHI
HOME
Una struttura a ragnatelaUna struttura a ragnatela consente una molteplicità di percorsi possibili. Progettando l’architettura di un sito web si possono sfruttare
queste potenzialità, ma bisogna mantenere un modello concettuale coerente, evitando che l’utente si smarrisca.
UTENSILI PRATO E GIARDINO
Utensili per il giardino
Utensili per cucina
CASALINGHI
Utensili a motore
Smerigliare e levigare
Utensili a manuali
•motosega•tagliaerba• ecc…
HOME
La mappatura La mappatura Esplicita le relazioni tra l’aspetto strutturale a quello funzionale
In alcuni casi può risultare molto
complesso in relazione alla gamma dei servizi
offerti
La mappatura (2) La mappatura (2)
Definire la gerarchia dell’informazione
Sequenza lineare
La griglia
Network
La mappatura (3) La mappatura (3)
Correlare la mappatura alla struttura
La mappa del sito IKEALa mappa del sito IKEA
La mappa del sito IKEALa mappa del sito IKEA
Secondo l’approccio proposto da Jackob Nielsen la struttura di navigazione di un sito web deve aiutare l’utente nel rispondere a tre domande:
Dove mi trovo ?
Dove sono stato ?
Dove posso andare ?
I criteri per l’analisiI criteri per l’analisi
Le tipologie di navigazioneLe tipologie di navigazione
B C D EA
HOME
D1 D2 D3A2A1
A2.2 A2.3A2.1
navigazione orizzontale
navigazione trasversale
navigazione verticale
1. Dove mi trovo?in relazione al Web
1. Dove mi trovo?
in relazione alla struttura del sito
2. Dove sono stato
?
nel Web
all’interno del sito
2. Dove sono stato ?
3. Dove posso andare ?A questa domanda rispondono tre diversi tipi di link… link topici
link associativi
link strutturali
TOPICITOPICI
STRUTTURALI STRUTTURALI
ASSOCIATIVIASSOCIATIVI link usati per indicare altre pagine dal contenuto simile o correlato a quella attuale che l’utente potrebbe perciò trovare interessanti
testo sottolineato (di solito ma non sempre!) che conduce a ulteriori
informazioni riguardo all’argomento trattato
link usati per connettere tra di loro livelli diversi della struttura del sito. Usati anche per connettere una data pagina con altre allo stesso livello gerarchico
I I LinkLink
Link associativi
Link strutturali
Link topici
ID del sito Una via alla Home Page
Le sezioni
Utilities
Una via per la ricerca
Il “test del portabagagli”
1) In che sito mi trovo? ID
2) In che pagina sono? Nome della Pagina
3) Quali sono le sezioni principali del sito? Sezioni del sito o navigazione primaria
4) Quali opzioni ho a disposizione a questo livello? Navigazione locale
5) Dove mi trovo nella struttura generale del sito? Indicazioni “voi siete qui”
6) Come posso effettuare una ricerca? Campo ricerca
1
4
62
2
3
5
ID Sezioni
Nome della pagina
Navigazione locale
Voi siete qui
Ricerca
Una struttura di navigazione tipicaUna struttura di navigazione tipica
A B C D E
D1
D2
D3
pagina D1
contenuti della pagina
navigazione globale
navigazione locale
B C
D
EA
HOME
D1 D2 D3A2A1
A2.2 A2.3A2.1
D
A B C D E
Un’altra variante: navigazione globale (metafora dello Un’altra variante: navigazione globale (metafora dello schedario)schedario)
A B C D E
D1 D2 D3
pagina D1
A B C D E
pagina D1
D1
D2
D3
<contenuti Linea Cash>
Una variante: navigazione locale in orizzontaleUna variante: navigazione locale in orizzontale
Strutturalmente, è la stessa cosa
Un’altra variante: navigazione locale in menu a tendinaUn’altra variante: navigazione locale in menu a tendina
Cosa distingue la home page dalle altre pagine:Cosa distingue la home page dalle altre pagine:
deve mettere in evidenza l’identità del sito (ID)
deve comunicare un quadro d’insieme (facendo dei compromessi!) ed esporre la mission del sito in modo chiaro e sintetico (WELCOME BLURB)
dovrebbe avere una TAGLINE ben progettata (solo i più famosi possono farne a meno!)
può avere un diverso orientamento delle sezioni e del testo, ma senza modificare i nomi e l’ordine delle sezioni (consistency)
HOME
Cosa distingue la home page dalle altre pagine (2) :Cosa distingue la home page dalle altre pagine (2) :
L’identità del sito (ID)
…Il logo (ID) in evidenza, insieme ai valori e alla storia che esso esprime
IL WELCOM BLURB
…poche righe per spiegare chi siamo, cosa facciamo, che obiettivi abbiamo(mission)
Cosa distingue la home page dalle altre pagine (3) :Cosa distingue la home page dalle altre pagine (3) :
La TAGLINE
…poche parole (!) vicino all’ID per mettere immediatamente in relazione chi siamo (ID) e cosa facciamo (mission)(mission)
Cosa distingue la home page dalle altre pagine (4) :Cosa distingue la home page dalle altre pagine (4) :
Nella home page i link strutturali (sezioni) possono essere disposti in modo diverso rispetto a tutte le altre pagine (navigazione persistente)…
Home
page
Cosa distingue la home page dalle altre pagine (5) :Cosa distingue la home page dalle altre pagine (5) :
Pagina interna
Un difetto tipico: duplicazione degli accessi a una Un difetto tipico: duplicazione degli accessi a una stessa paginastessa pagina
Il modello più in dettaglioIl modello più in dettaglio
Valutare le caratteristiche apartire dallesottocaratteristiche
Caratteristica Voto PesoVoto
pesatoArchitettura 2,67 2,50 2,80Struttura 3 1 3Mappa del sito 2 0,5 1Navigazione 3 1 3
Comunicazione 3,00 3,00 3,00Home page 4 1 4Brand image 2 1 2Grafica 3 1 3
Funzionalità 4,00 2,00 4,00Adeguatezza 4 1 4Correttezza 4 1 4
Contenuto 3,00 4,00 3,00Categorizzazione/labelling 2 1 2Stile 4 1 4Informazione 3 1 3Localizzazione 3 1 3
Gestione 2,67 4,00 2,00Disponibilità 2 1 2Monitoraggio 1 1 1Aggiornamento 2 1 2Relazioni con gli utenti 3 1 3
Accessibilità 2,50 3,00 2,92Tempi d'accesso 3 1 3Reperibilità 4 1 4Indipendenza dal browser 2 0,75 1,5Accessibilità per i disabili 1 0,25 0,25
Usabilità 2,00 3,00 2,00Efficacia 2 1 2Efficienza 2 1 2Soddisfazione 2 1 2
Un possibile sistema Un possibile sistema di misurazionedi misurazione
Una visione globaleUna visione globale
0
0,5
1
1,5
2
2,5
3
3,5
4
Usabilità
Architettura
Comunicazione
FunzionalitàContenuto
Gestione
Accessibilità
0
0,5
1
1,5
2
2,5
3
3,5
4
Usabilità
Architettura
Comunicazione
FunzionalitàContenuto
Gestione
Accessibilità
Confronto di due sitiConfronto di due siti
Un profilo di qualità più analiticoUn profilo di qualità più analitico
Best site web awardBest site web award
Best site web awardBest site web award
Analisi operativa e “strategica” dei risultati
OBIETTIVIDEL
PORTALE
DETERMINAZIONE DELFABBISOGNO INFORMATIVO
DESTINATARI ESTERNI
REALIZZAZIONE/REVISIONE
ESPLICITAZIONEDEI
PARAMETRI DEL PORTALE
COMMISURAZIONEDEI
PARAMETRI
REPORTCON PARAMETRI
E-GOV
Il circuito del controlloIl circuito del controllo
IL PORTALE
Qualche riferimentoQualche riferimento
Documenti consultati Web Usability – Francesca Rizzo Informatica per l’e-Government
Come cambia la Pubblica Amministrazione italiana - Prof. Valter Baldassi.
Linee Guida per laQualità delle Forniture ICT: evoluzione ed applicazione – Marco Gentili
Analisi siti web Pa –Paolo Atzeni, Paolo Merialdo
Progettazione di un sito Web – Roberto Pirrone
Bibliografia Consultata Designing Web Usability, Nielsen,
J., tr. it. di Vanini, W., Apogeo,Milano, 2000.
Information Architecture for the World Wide Web, Rosenfeld, L.,Morville, P., O’Reilly, Sebastapol CA, 1998.
Usability Inspection Methods, Nielsen, J., and Mack, R. L., JohnWiley & Sons, New York, NY, 1994.