Dott. Simone Lazzini Università di Pisa

Presentazione sul tema: "Dott. Simone Lazzini Università di Pisa"— Transcript della presentazione:

1 Dott. Simone Lazzini Università di Pisa
Web Usability Dott. Simone Lazzini Università di Pisa

2 Come si persegue la usability
Come si persegue la usability? (Realizzazione e gestione di un sito web) Strategia e fattibilità Management, Consulenti 1 Web designer 2 Web design & user experience Visual design Visual designer 3 Sviluppo del software System integrator 4 5 Content editor Gestione dei contenuti Esercizio del sito Web master 6 Gestione dei server Web farm 7 Connettività internet Internet Service Provider 8

3 Quali elementi di valutazione è possibile analizzare
Gestione Usabilità Accessibilità Obiettivi Architettura Comunicazione Funzionalità Contenuto Strategia e fattibilità Management, Consulenti 1 Web designer 2 Web design & user experience Visual design Visual designer 3 Sviluppo del software System integrator 4 5 Content editor Gestione dei contenuti Esercizio del sito Web master 6 Gestione dei server Web farm 7 Connettività internet Internet Service Provider 8

4 Un primo modello di analisi
Architettura La struttura e la navigazione del sito sono adeguate? Accessibilità Comunicazione Il sito è di facile accesso per tutti? Il sito raggiunge i suoi obiettivi di comunicazione? Usabilità Il sito è facile da usare? Funzionalità Gestione L’operatività del sito è ben gestita ? Le funzioni del sito sono adeguate e corrette? Contenuto Il contenuto informativo è corretto, e adeguato agli scopi del sito?

5 Quindi un sito è usabile quando è :
Identificare i BISOGNI degli utenti UTILE Progettare e valutare prodotti FACILI DA USARE FRUIBILE Identificare i FATTORI CHE MOTIVANO gli utenti DESIDERABILE

6 QUALI SONO LE DIMENSIONI DA CONSIDERARE
Efficacia Efficienza Soddisfazione Utilità Velocità Facilità d’uso Affidabilità Appropriatezza Piacevolezza Scalabilità Semplicità 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.

7 Usability e Architettura dell’informazione
Struttura Mappatura Navigazione

8 L’analisi della Struttura del sito
La rappresentazione avviene, di solito, mediante un diagramma ad albero, allo scopo di valutarne la adeguatezza B C D E A HOME D1 D2 D3 A2 A1 A2.2 A2.3 A2.1 1° livello 2° livello 3° livello

9 L’analisi della Struttura del sito – Gli scopi
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.

10 Tre strutture di base 1) Lineare 2) Gerarchica
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.

11 3) A ragnatela I livello I livello I livello HOME II Livello
Pagine 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 difficoltà di orientamento per l’utente. 3) A ragnatela II Livello I livello HOME II Livello I livello II Livello I livello II Livello II Livello II Livello

12 Le possibili strutture possono essere moltissime ed avere i caratteri di ciascuna ma…
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. Lo scenario di Krug: v Navigando cerco un sito per valutare la possibilità di comprare una motosega: La struttura del sito presenta tre reparti… PRATO E GIARDINO UTENSILI CASALINGHI Dove sono le motoseghe?

13 SMERIGLIARE E LEVIGARE SMERIGLIARE E LEVIGARE
Seguendo il vostro intuito provate a vedere se la motosega si trova sotto UTENSILI… il livello successivo è? …nella corsia UTENSILI A MOTORE cercate la motosega ma??? UTENSILI A MOTORE UTENSILI MANUALI SMERIGLIARE E LEVIGARE HOME PRATO E GIARDINO UTENSILI CASALINGHI UTENSILI A MOTORE UTENSILI MANUALI SMERIGLIARE E LEVIGARE

14 Una 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. CASALINGHI HOME Utensili per cucina UTENSILI PRATO E GIARDINO Smerigliare e levigare Utensili per il giardino Utensili a manuali motosega tagliaerba ecc… Utensili a motore

15 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

16 La mappatura (2) Definire la gerarchia dell’informazione
Sequenza lineare Network La griglia

17 Correlare la mappatura alla struttura

18 La mappa del sito IKEA

19 La mappa del sito IKEA

20 I criteri per l’analisi
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 ?

21 Le tipologie di navigazione
B C D E A HOME D1 D2 D3 A2 A1 A2.2 A2.3 A2.1 navigazione orizzontale navigazione trasversale navigazione verticale

22 Dove mi trovo? in relazione al Web

23 Dove mi trovo? in relazione alla struttura del sito

24 2. Dove sono stato ? nel Web

25 2. Dove sono stato ? all’interno del sito

26 3. Dove posso andare ? A questa domanda rispondono tre diversi tipi di link… link topici link strutturali link associativi

27 I Link testo sottolineato (di solito ma non sempre!) che conduce a ulteriori informazioni riguardo all’argomento trattato TOPICI STRUTTURALI 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 link usati per indicare altre pagine dal contenuto simile o correlato a quella attuale che l’utente potrebbe perciò trovare interessanti ASSOCIATIVI

28 Link strutturali Link topici Link associativi

29 Il “test del portabagagli”
ID del sito Una via alla Home Page Utilities Una via per la ricerca Le sezioni 1 4 6 2 3 5 Il “test del portabagagli” In che sito mi trovo? ID In che pagina sono? Nome della Pagina Quali sono le sezioni principali del sito? Sezioni del sito o navigazione primaria Quali opzioni ho a disposizione a questo livello? Navigazione locale Dove mi trovo nella struttura generale del sito? Indicazioni “voi siete qui” Come posso effettuare una ricerca? Campo ricerca

30 ID Sezioni Nome della pagina Navigazione locale Voi siete qui Ricerca

31 contenuti della pagina
Una struttura di navigazione tipica B C D E A HOME D1 D2 D3 A2 A1 A2.2 A2.3 A2.1 A B C D E D1 D2 D3 pagina D1 contenuti della pagina navigazione globale navigazione locale

32 Un’altra variante: navigazione globale (metafora dello schedario)
pagina D1 A B C D E

33 Una variante: navigazione locale in orizzontale
<contenuti Linea Cash> Strutturalmente, è la stessa cosa Un’altra variante: navigazione locale in menu a tendina

34 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)

35 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

36 Cosa distingue la home page dalle altre pagine (3) :
IL WELCOM BLURB …poche righe per spiegare chi siamo, cosa facciamo, che obiettivi abbiamo (mission)

37 Cosa distingue la home page dalle altre pagine (4) :
La TAGLINE …poche parole (!) vicino all’ID per mettere immediatamente in relazione chi siamo (ID) e cosa facciamo (mission)

38 Cosa distingue la home page dalle altre pagine (5) :
Nella home page i link strutturali (sezioni) possono essere disposti in modo diverso rispetto a tutte le altre pagine (navigazione persistente)… Home page Pagina interna

39 Un difetto tipico: duplicazione degli accessi a una stessa pagina

40 Il modello più in dettaglio

41 Valutare le caratteristiche a partire dalle sottocaratteristiche
Un possibile sistema di misurazione Valutare le caratteristiche a partire dalle sottocaratteristiche

42 Una visione globale Usabilità Architettura Comunicazione Funzionalità
Contenuto Gestione Accessibilità

43 Confronto di due siti Usabilità Accessibilità Architettura Gestione
4 3,5 Accessibilità 3 Architettura 2,5 2 1,5 1 0,5 Gestione Comunicazione Contenuto Funzionalità

44 Un profilo di qualità più analitico

45 Best site web award

46 Best site web award

47

48

49

50

51 Il circuito del controllo
DESTINATARI ESTERNI DETERMINAZIONE DEL FABBISOGNO INFORMATIVO Analisi operativa e “strategica” dei risultati OBIETTIVI DEL PORTALE IL PORTALE REPORT CON PARAMETRI E-GOV REALIZZAZIONE/ REVISIONE ESPLICITAZIONE DEI PARAMETRI DEL PORTALE COMMISURAZIONE DEI PARAMETRI

52 Qualche riferimento Bibliografia Consultata Documenti consultati
Web Usability – Francesca Rizzo Informatica per l’e-Government Come cambia la Pubblica Amministrazione italiana - Prof. Valter Baldassi. Linee Guida per la Qualità 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.