Un modello di qualità per i siti Web

UN MODELLO DI QUALITA ’ PER I SITI WEB Roberto Polillo Ultimo aggiornamento: 2004

Indice
Introduzione al modello
Analisi delle caratteristiche del modello

Introduzione al modello

Che cos ’ è un modello di qualità
Insieme di caratteristiche , sottocaratteristiche e rispettive relazioni, che fornisce la base per specificare requisiti di qualità e valutare la qualità di un prodotto o servizio

Esempio: un modello di qualità per alberghi NB: Un modello di qualità è sempre, in una certa misura, arbitrario Caratteristiche Sottocaratteristiche 1 Camere comfort, dimensioni, eleganza, pulizia 2 Spazi comuni comfort, dimensioni, eleganza, pulizia 3 Servizio reception, servizi in camera, cortesia del personale 4 Ristoranti qualità del cibo, ambiente, servizio, varietà del cibo 5 Piscina comfort, dimensioni, ambiente, attrezzature, pulizia 6 Spiaggia vicinanza, privata/pubblica, attrezzature, paesaggio 7 Dintorni possibilità di escursioni, vicinanza a un centro abitato 8 Impianti sportivi tennis, golf, fitness, altri 9 Bambini nursery, zone riservate

Un modello di qualità per i siti web
Una selezione delle caratteristiche che fanno di un sito web un “buon” sito
Scopo:
valutare un sito
orientarci nella sua realizzazione
Vogliamo individuare poche caratteristiche, per poterci concentrare sugli aspetti più importanti

La qualità di un sito
Non può essere una grandezza assoluta, ma deve essere relativa a:
- lo scopo del sito
- la tipologia di utenti a cui si indirizza
- il suo contesto d ’ uso
Noi useremo un modello basato su 7 caratte-ristiche , derivati da un semplice modello di produzione e gestione di un sito

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

Build Check Design

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

Produzione e gestione di un sito web La qualità complessiva di un sito è il risultato del lavoro armonico e integratodi tutti questi attori La robustezza di una catena è pari a quella del suo anello più debole Strategia & concept Consulenti 1 Graphical design & user experience Web agency 2 Sviluppo del sito System integrator 3 Esercizio del sito Application manager 5 Server housing Web farm 6 Connettività ISP 7 Content manager 4 Gestione dei contenuti

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

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

Analisi delle caratteristiche del modello

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

1. Architettura dell ’ informazione

Architettura dell’informazione
Struttura : La struttura del sito è adeguata?
Mappa del sito : La mappa del sito esiste e ne rappresenta con chiarezza la struttura?
Navigazione : La navigazione del sito è adeguata?
La struttura e la navigazione sono adeguate?

Struttura del sito E’ molto utile rappresentare la struttura del sito con un diagramma ad albero, e quindi 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

Un esempio

Prodotti Punti vendita Mondo Fidaty Lavorare con noi Azienda HOME Catalogo Fidaty Vantaggi Le carte Fidaty Valori e principi Storia Il cliente I fornitori Le risorse umane 1° livello 2° livello 3° livello Fidaty oro

Analizzando meglio il sito, si vede però che la mappa del sito non ne rappresenta completamente la struttura, che è più complessa: Prodotti Punti vendita Mondo Fidaty Lavorare con noi Azienda HOME Parlare con noi Spesa on line Accesso utenti registrati Saper scegliere Area utenti Area stampa Intratte- nimento Mappa Ricerca Info English “ scorciatoie” varie servizi “standard”

Due mappe ben fatte Ma questa si sviluppa su più schermate: è scomoda

Vari tipi 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

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

Esempio pubblicità pubblicità contenuti

Esempio

Navigazione globale Navigazione locale Navigazione contestuale Dove sono? Cosa c’è vicino? Cosa è relativo a cosa? Orientamento Dove posso andare? Dove posso andare? Dove posso andare? Navigazione

Una variante: navigazione locale in orizzontale Strutturalmente, è la stessa cosa <contenuti Linea Cash>

Un’altra variante: navigazione locale in menu a tendina

Un’altra variante: navigazione globale a tab (metafora dello schedario) A B C D E

Struttura a schedario con navigazione locale A B C D E D1 D2 D3 pagina D1 A B C D E pagina D1 D1 D2 D3

inserzione pubblicitaria <contenuti della pagina>

<contenuti: Idee regalo fino a 10.99 euro>

Navigazione a tre livelli

<contenuti: Idee regalo fino a 10.99 euro>

Home Natale Idee regalo Casa funzionale Tempo libero Soluzioni Tecnologiche Cura della persona Fino a 10,99 euro Fino a 25,99 euro Fino a 51,99 euro Casa funzionale Tempo libero Soluzioni Tecnologiche Cura della persona navigazione locale navigazione locale navigazione globale navigazione trasversale

Un difetto tipico: duplicazione degli accessi a una stessa pagina

Orientamento: breadcrumbs

Fluidità della navigazione Evitare le redirezioni di link, che impediscono al tasto back di funzionare come l’utente si attende A B C Indietro 1 2

2. Comunicazione

Comunicazione
Home page : La home page comunica chiaramente gli obiettivi del sito?
Brand image : Il sito è coerente con la brand image?
Grafica : La grafica del sito è adeguata?
Il sito raggiunge i suoi obiettivi di comunicazione?

Home page: qual è lo scopo di questo sito?

E di questo ?

Home page: i “payoff” (o “tag-line”)
Sono frasi che caratterizzano sinteticamente lo scopo del sito
Sono quasi sempre accostate al logo
Spesso sono accompagnate da una descrizione più estesa dello scopo del sito
titolo slogan frase esplicativa

L’uso dei rollover

Comunicazione

Che cos ’è un “brand”?
“ Una miscela di attributi tangibili e intangibili, simbolizzata in un marchio, che, se gestita correttamente, crea influenza e genera valore”
(da: R.Clifton, E.Maughan (a cura di), “The future of brands”,Interbrand, MacMillan, 2000)

I brand più “forti”
1. Coca Cola 14. Marlboro
2. Microsoft 15. BMW
3. Gillette 16. Heineken
4. Disney 17. VW
5. Nescafé 18. Pepsi-Cola
6. Colgate 19. Ford
7. McDonald ’s 20. Chanel
8. McDonald ’s 21. General Electric
9. Pampers 22. Kodak
10. IBM 23. Amex
11. Sony 24. Nike
12. Heinz 25. Bacardi
13. Intel 26. Smirnoff
(Fonte: Interbrand)

Verificare che la impostazione del sito sia coerente con i “tratti distintivi del brand”

www.cocacola.com nel 2001

CocaCola tedesca nel 2003

CocaCola USA nel 2003

www.cocacola.com nel 2003

Comunicazione

Comunicazione: Grafica
Layout : Il layout delle pagine è adeguato ai vari formati video?
Gestalt : Il layout delle pagine facilita la comprensione dei contenuti?
Colore : Il colore è usato in modo adeguato?
Tipografia : I caratteri usati rendono il testo ben leggibile?
Attrattiva : La grafica è attraente?
La grafica del sito è adeguata?

800x600 1024x768 1680x1050

800x600 1680x1050

800x600 1024x768 1680x1050

Gestalt

Colore

Tipografia

Attrattiva

3. Funzionalità

Funzionalità
Adeguatezza : Le funzioni del sito sono adeguate?
Correttezza : Le funzioni del sito sono corrette?
Le funzioni del sito sono adeguate e corrette?

Funzionalità: Adeguatezza
Transazioni : Le funzioni per effettuare le transazioni sono adeguate?
Gestione degli errori : Il trattamento degli errori dell’utente è adeguato?
Ricerca : Gli strumenti di ricerca delle informazioni sono adeguati?
Comunicazione : E’ possibile comunicare in modo adeguato con chi gestisce il sito?
Le funzioni del sito sono adeguate?

Funzionalità: Correttezza Le funzioni del sito sono corrette?

4. Contenuto

Contenuto
Categorizzazione/labelling : L’informazione è classificata in modo adeguato?
Stile : Lo stile del testo è adeguato al web?
Informazione : L’informazione è adeguata, pertinente, affidabile e aggiornata?
Localizzazione : Il sito è correttamente localizzato?
Il contenuto informativo è corretto, e adeguato agli scopi del sito?

triangoli stelle cerchi bianchi neri grigi

www.msn.it www.virgilio.it Amori e incontri 5minutidi ANSA Notizie Annunci Aste online Broadband Business Business Calcio Casa Casa Cinema e TV Cucina Community Donne Donne e bellezza Famiglia Giochi GQ Junior Intrattenimento Lavoro Lavoro Mobile Money Motori Motori Musica Musica Salute e benessere Shopping Sapere e libri Sport Shopping Tecnologia Sociale Telefonia Soldi Viaggi Sport Videogiochi Tecnologia Viaggi Esplora Virgilio

Contenuto

SINTESI DETTAGLIO MATERIALE AGGIUNTIVO

Contenuto

5. Gestione

Gestione
Disponibilità : Il sito è sempre attivo e disponibile agli utenti?
Monitoraggio : L’accesso al sito è adeguatamente monitorato?
Aggiornamento : Il sito viene costantemente aggiornato e migliorato?
Relazioni con gli utenti : Le relazioni con gli utenti sono adeguatamente presidiate?
L’operatività del sito è ben gestita?

Link spezzati
Uno studio sperimentale ha rilevato che il 5-8%
dei link seguiti durante la navigazione erano
interrotti
(Xerox, 1997)

Missing links La presenza di pagine “in costruzione”, anche se correttamente segnalate, comunica all’utente una impressione di provvisorietà e di scarsa profes- sionalità, e va assolutamente evitata.

Gestione
Disponibilità : Il sito è sempre attivo e disponibile agli utenti?
Monitoraggio : L’accesso al sito è adeguatamente monitorato?
Aggiornamento : Il sito viene costantemente aggiornato e migliorato?
Relazioni con gli utenti : Le relazioni con gli utenti sono adeguatamente presidiate?
L’operatività del sito è ben gestita?

6. Accessibilità

Accessibilità
Tempi di accesso : I tempi di accesso sono adeguati?
Reperibilità : Il sito è facile da trovare?
Indipendenza dal browser : Il sito è accessibile con ogni browser?
Accessibilità per i disabili : Il sito è utilizzabile da utenti disabili?
Il sito è di facile accesso per tutti?

Fattori che influenzano le prestazioni di accesso Banda verso UAP Caratteristiche dell ’UAP Itinerario sulla rete Caratteristiche del SAP Banda verso SAP Dimensionamento del server “ peso” delle pagine web del sito User Site Access Provider User Access Provider Web Server Internet

Accessibilità

Motori di ricerca: esempio

Accessibilità

Disabilità: alcuni numeri
Almeno il 10% della popolazione mondiale è disabile.
Nell’Unione Europea, almeno 37 milioni di cittadini sono disabili, e il 70% ha un’età superiore ai 70 anni.
In Italia, i disabili sono oltre 2.800.000, pari a circa il 5% della popolazione. Di questi, il 75% ha almeno 65 anni (Fonte: Istat).

La legge Stanca (dicembre 2003)
Tutela e garantisce il diritto di accesso ai servizi informatici e telematici della pubblica amministrazione e ai servizi di pubblica utilità da parte delle persone disabili, in ottemperanza al principio di uguaglianza stabilito dall’articolo 3 della Costituzione Italiana.
In particolare, stabilisce che le pubbliche amministrazioni non possano stipulare contratti per la realizzazione e la modifica di siti Internet quando non è previsto che essi rispettino opportuni requisiti d’accessibilità
I requisiti sono stabiliti con decreto del Ministro per l’Innovazione e le Tecnologie, nell’osservanza delle raccomandazioni dell’Unione Europea.

WAI
Il World Wide Web Consortium (W3C) ha promosso la Web Accessibility Iniziative ( WAI ).
Scopo: individuare e suggerire criteri per la realizzazione dei siti web, tali da permetterne l ’ accesso anche ad utilizzatori disabili.

Web Content Accessibility Guidelines
Linee guida emesse dal WAI per la realizzazione di siti accessibili.
Il riferimento principale è il documento WCAG 1.0, adottato come raccomandazione del W3C (1999), che elenca 14 linee guida .
WCAG 2.0 è in corso di definizione.

SINTESI DELLE LINEE GUIDA PER L’ACCESSIBILITà DEI WEB DEL W3C (VERSIONE 1.0) 1. Fornire alternative equivalenti ai contenuti uditivi e visivi : fornire contenuti che, quando presentati all’utente, comunichino essenzialmente la stessa funzione o scopo dei contenuti uditivi e visivi. 2. Non fare affidamento solo sul colore : assicurarsi che testo e grafica siano comprensibili anche se visti senza colore. 3. Usare marcatori e fogli di stile, e farlo in modo appropriato : marcare i documenti con i corretti elementi strutturali. Controllare la presentazione con fogli di stile piuttosto che con elementi di presentazione e attributi 4. Chiarire l’uso dei linguaggi naturali : usare marcatori che facilitino la pronuncia o l’interpretazione di testi in lingue straniere o con abbreviazioni. 5. Creare tabelle che si trasformino bene : assicurarsi che le tabelle abbiano i marcatori necessari affinché siano Trasformate correttamente dai browser accessibili e da altri programmi utilizzati dall’utente. 6. Assicurarsi che le pagine che usano nuove tecnologie si trasformino bene : assicurarsi che le pagine siano accessibili anche quando le nuove tecnologie non siano supportate o vengano disinserite. 7. Assicurarsi che l’utente abbia il controllo dei cambiamenti di contenuto nel tempo : assicurarsi che gli oggetti o le pagine che si muovono, che lampeggiano, che scrollano o che si auto-aggiornano possano essere fermate. 8. Assicurarsi che le interfacce utente inserite supportino direttamente l’accessibilità : assicurarsi che eventuali oggetti inseriti nel sito che abbiano un’interfaccia diretta con l’utente seguano anch’essi i principi dell’accessibilità. 9. Garantire l’indipendenza dai dispositivi : usare caratteristiche che permettano l’attivazione degli elementi della pagina attraverso una varietà di dispositivi di input. 10. Usare soluzioni provvisorie , in modo tale che le tecnologie che assistono i disabili o i browser meno recenti funzionino correttamente, nell’attesa di future tecnologie web che incorporino direttamente le caratteristiche necessarie. 11. Usare tecnologie e linee guida del W3C , in modo conforme alle specifiche, e seguire le linee guida per l’accessibilità. Quando non è possibile usare tecnologie W3C, fornire versioni alternative del contenuto che siano accessibili 12. Fornire informazioni di contesto e d’orientamento : fornire informazioni di contesto e di orientamento per aiutare gli utenti nella comprensione di pagine o elementi complessi. 13. Fornire chiari meccanismi di navigazione : fornire meccanismi di navigazione chiari e consistenti (informazioni di orientamento, barre di navigazione, mappe del sito, ecc.) per aumentare la probabilità che l’utente trovi ciò che cerca nel sito. 14. Assicurarsi che i documenti siano chiari e semplici, in modo che essi possano essere più facilmente compresi.

I livelli di conformità del WAI
Per ciascuna linea guida, il WAI definisce delle regole più dettagliate da applicare per soddisfarla (“checkpoint”).
I checkpoint (65 in tutto) sono classificati in tre livelli di priorità:
- Priorità 1 : chi realizza il sito deve soddisfare questi checkpoint
- Priorità 2 : chi realizza il sito dovrebbe soddisfare questi checkpoint.
- Priorità 3 : chi realizza il sito potrebbe soddisfare questi checkpoint.

I livelli di conformità del WAI Livello A : tutti i checkpoint di priorità 1 sono soddisfatti Livello AA : tutti i checkpoint di priorità 1 e 2 sono soddisfatti Livello AAA : tutti i checkpoint di priorità 1, 2 e 3 sono soddisfatti

L ’ idea di base
Progettare le pagine web in modo che siano comprensibili nonostante la disabilità e, ove ciò non sia possibile, di trasformarle in modo che esse diventino comprensibili.
Può essere necessario usare opportune tecnologie assistive : lettori di schermo, tastiere braille, browser vocali, ecc.

7. Usabilità

Usabilità
Efficacia : L’utente raggiunge il risultato voluto in modo accurato e completo?
Efficienza : Lo sforzo richiesto all’utente per ottenere il risultato voluto è accettabile?
Soddisfazione dell’utente : Il sito è confortevole e bene accetto all’utente?
Il sito è facile da usare?

Un modello di qualità per i siti Web

by Roberto Polillo on May 17, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

2 Embeds 32

Statistics

Un modello di qualità per i siti Web — Presentation Transcript

http://wikicorsoweb.altervista.org	31
http://www.wikicorsoweb.altervista.org	1