Qualità per Il Web - La Metodologia Mediabeta

Web Quality Assurance, un servizio per
l’utente…

Roma 30-31 Ottobre 2008
6-7 Novembre 2008
Francesco Micali, PhD

Programma delle giornate

•Evoluzione dei contesti •La qualità dei siti web;
d’uso e degli utenti;
•Il Web-Q Model©;
•La qualità del software;
•Casi studio ed
•In movimento verso il esercitazioni.
web…
•…l’usabilità si evolve
•e diventa web-usability

© Francesco Micali

Evoluzione dei contesti e degli utenti

© Francesco Micali


Un sistema ben progettato deve essere utilizzabile
senza necessità di alcun manuale d’uso.

© Francesco Micali


Cosa si intende per software?
Tutta una serie di istruzioni date ad un computer per realizzare
determinate operazioni rispettando determinati requisiti.

© Francesco Micali

La qualità del software – ISO 9126

Il modello ISO/IEC 9126 (“Information Technology – software
Product Evaluation – Quality Characteristics and Guidelines for their Use”)
definisce:
•6 caratteristiche di qualità principali (astratte);
•27 sottocaratteristiche misurabili attraverso delle metriche, fornite in 3
technical reports (ISO/IEC 9126-2, 3 e 4);
•Qualità interna che esprime la misura in cui il codice software possiede una
serie di attributi statici, indipendentemente dall’ambiente di utilizzo e
dall’utente.
•Qualità esterna che esprime il comportamento dinamico del software,
nell’ambiente d’uso.
•Qualità in uso che esprime l’efficacia ed efficienza con cui il software serve
le esigenze dell’utente, ed è correlata alla percezione diretta dell’utente.

© Francesco Micali


Qualità interna ed esterna

© Francesco Micali



Definire
delle
metriche

© Francesco Micali


capacità di fornire servizi tali da soddisfare,in
determinate condizioni, requisiti funzionali espliciti o
impliciti (il software fa ciò per il quale è stato
acquistato).

Le sottocaratteristiche sono:
Adeguatezza: presenza di funzioni appropriate per
compiti specifici che supportano obiettivi dell’utente.
Accuratezza: capacità di fornire risultati corretti in
accordo con i requisiti dati dall’utente.
Interoperabilità: capacità di interagire con altri
sistemi.
Sicurezza: capacità di proteggere programmi e dati
da accessi non autorizzati e di consentire quelli
autorizzati.

© Francesco Micali



capacità di mantenere le prestazioni stabilite nelle
condizioni e nei tempi fissati (il software reagisce
bene a variazioni esterne);

le sottocaratteristiche sono:
Maturità (robustezza): capacità di evitare fermi
dell’applicazione a seguito di malfunzionamenti.
Tolleranza errori: capacità di mantenere
determinati livelli di prestazione in caso di
malfunzionamenti (non degrado).
Recuperabilità: capacità e velocità, in caso di
malfunzionamenti, di ripristinare dei livelli di
prestazione predeterminati e di recuperare i dati.

© Francesco Micali



capacità di essere compreso, appreso, usato
con soddisfazione dall’utente in determinate
condizioni d’uso;
Comprensibilità: capacità di ridurre l’impegno
richiesto agli utenti per capirne il funzionamento e le
modalità di utilizzo.
Apprendibilità: capacità di ridurre l’impegno
richiesto agli utenti per impararlo ad usare.
Operabilità: capacità di mettere in condizione
gli utenti di farne uso per i propri scopi e controllarne
l’uso.
Attrattività/Piacevolezza: capacità di essere
piacevole per l’utente che ne fa uso.

© Francesco Micali



rapporto fra prestazioni e quantità di risorse
utilizzate, in condizioni definite di funzionamento.

Le sottocaratteristiche correlate sono:
Comportamento rispetto al tempo: adeguati
tempi di risposta, tempi di elaborazione e throughput
rates per eseguire le funzioni richieste, sotto
determinate condizioni.
Uso di risorse: utilizzo di una quantità e di una
tipologia di risorse adeguate per eseguire le funzioni
richieste, sotto determinate condizioni.

© Francesco Micali


capacità di essere modificato con un
impegno contenuto (per evoluzioni
e/o correzioni o adeguamenti);
Analizzabilità: capacità di
limitare impegno richiesto per
identificare carenze, cause di
malfunzionamenti, parti da
modificare.
Modificabilità: capacità di
limitare l’impegno richiesto per
modificare, rimuovere errori,
sostituire componenti.
Stabilità: capacità di ridurre il
rischio di comportamenti inaspettati
a seguito della effettuazione di
modifiche.
Testabilità: capacità testare
facilmente per validare le modifiche
apportate.

© Francesco Micali

facilità con cui il interna ed esterna
Qualità software può essere
trasferito da un ambiente operativo
ad un altro;
Adattabilità: capacità di
adattarsi a nuovi ambienti
operativi limitando la necessità di
apportare modifiche.
Installabilità: capacità di ridurre
l’impegno richiesto per installarlo in
un particolare ambiente operativo.
Coesistenza: capacità di
coesistere con altri software nel
medesimo ambiente, condividendo
risorse.
Sostituibilità: capacità di
essere utilizzato al posto di un
altro software per svolgere gli stessi
compiti nello stesso ambiente.

© Francesco Micali


Qualità in uso
Efficacia, la capacità di
supportare un utente nel
raggiungere i suoi obiettivi con
accuratezza e completezza in un
dato contesto.
Produttività, la capacità di
supportare un utente nello
spendere l’appropriata quantità di
risorse in relazione all’efficacia dei
risultati da raggiungere.
Soddisfazione, la capacità di
soddisfare un utente in un dato
contesto d’uso.
Sicurezza, la capacità di
raggiungere accettabili livelli di
rischio per le persone, l’ambiente di
utilizzo, le attività dell’utilizzatore, in
un dato contesto d’uso.

© Francesco Micali

In movimento verso il web…

Beni materiali Web
o software
•Importanza del fattore
umano;
Il cliente prima
Il cliente prima
•Prototipi e Design fa esperienza
paga e dopo iterativo;
di usabilità e
avrà a che fare
dopo paga
con l’usabilità •Design contestuale;
•Design partecipativo.

- attenzione alla qualità interna, + attenzione qualità in uso

© Francesco Micali

In movimento verso il web…

Centralità dell’utente finale e dei suoi bisogni informativi

Centralità del funzionale 3W

f3W = f(Wwhy,Wwho,Wwhat)

© Francesco Micali

…l’usabilità si evolve

Il modello ISO/IEC 9241
(“Ergonomic requirements for office work with visual display”)
definisce che l’usabilità è:

“l’efficacia, l’efficienza e soddisfazione con i quali
gli utenti raggiungono determinati obiettivi in
determinati ambienti”

© Francesco Micali


• Efficacia è il grado di raggiungimento di un
obiettivo

Obiettivi prefissati Obiettivi raggiunti
Una misura dell’efficacia la si può ottenere dall’entità della sovrapposizione tra queste due
classi

S.M.A.R.T. (Specifico Misurabile Attraente Raggiungibile Tempificato)

N.B. se l’obiettivo non viene raggiunto l’efficacia è misurata in termini
del n° di operazioni svolte in direzione del completamento

© Francesco Micali


• Efficienza è legata al tempo impiegato per
raggiungere il proprio scopo ed indirettamente al
numero di errori che l’utente compie prima di
completare un compito,

Misura efficienza = tempo impiegato
=f(numero di errori)

© Francesco Micali


• Soddisfazione è legata all’utilità percepita
dell’intero sistema da parte dei propri utenti

Per capire il grado di soddisfazione si
devono annotare i commenti
pronunciati dalle persone durante
l’utilizzo del sistema.

© Francesco Micali

e diventa usabilità web o web-usability

Un sito Web è usabile quando
soddisfa i bisogni informativi
dell’utente finale che lo sta visitando ed
facilità di
interrogando, fornendogli
accesso e di navigabilità e
consentendo un adeguato livello di
comprensione dei contenuti. Nel caso
non sia disponibile tutta l’informazione, un
buon sito demanda ad altre fonti informative

“Usabilità dei siti web – Michele Visciola”

© Francesco Micali

La qualità dei siti web

“Do the right things, and do the things
right.
but also
communicate them in the right manner”

© Francesco Micali

In assenza di qualità

Perdita dell’interazione
l’utente non riesce a gestire la navigazione;

Caos percettivo
l’utente non riesce a gestire “il sovraccarico cognitivo” tipico della
navigazione web: riceve molti stimoli poco organizzati;

Disorientamento ed incertezza su contenuti e servizi
non è chiaro come procedere per ottenere le informazioni che si cercano;

Assenza di Segnali di navigazione chiari
etichette (labels) fuorvianti o poco visibili;

Procedure prolisse
le funzionalità ci sono ma difficili da raggiungere (poco accessibili),
procedure confuse,lunghe, poco intuitive.

© Francesco Micali

per cambiare prospettiva e scegliere quella dell’utente!

© Francesco Micali


Card sorting
E’ un metodo di categorizzazione dove gli
utenti suddividono in particolari categorie le
schede che descrivono varie idee.
Il Card Sorting si basa essenzialmente sul
confronto tra risultati individuali, a differenza
dell'affinity diagram che ha come obiettivo il
raggiungimento di un risultato su cui i
partecipanti sono concordi.
Se il Card Sorting termina quando tutte le schede hanno trovato una collocazione,

l'Affinity Diagram termina quando la suddivisione in categorie soddisfa tutti i partecipanti.

© Francesco Micali

Alcuni modelli di qualità per i siti web
•QEM (Quality Evaluation Model) è un approccio legato alle realtà accademiche e museali in
generale. Si basa su 4 caratteristiche (Usabilità, Funzionalità, Affidabilità ed efficienza).

•2QCV3Q Quis (Identity), Quid (Content), Cur (Services), Ubi (Individuation), Quando
(Management), Quomodo (Usability). Questo modello si applica principalmente per siti turistici.

•MiLE è un metodo sistematico per la valutazione dell’usabilità che combina metodi di
ispezione da parte di valutatori esperti con test empirici in cui utenti simulano sessioni di lavoro
sotto osservazione.

•MINERVA sviluppato principalmente per la valutazione di siti culturali (musei, biblioteche,
istituzioni culturali),si basa su 10 caratteristiche (Trasparent, Effective, Maintained, Accessible,
User-centered, Responsive, Multilingual, Interoperable, Managed, Preserved).

•Polillo-Etnoteam si basa su 7 caratteristiche (Architettura, Comunicazione,
Funzionalità, Contenuto, Gestione, Accessibilità, Usabilità).

•Signore si basa su 4 caratteristiche (Presentation, Content, Navigation, Interaction).

© Francesco Micali

Il Web Q-Model ©

Un modello sviluppato da Mediabeta e che si basa su tre livelli di
qualità, in funzione degli obiettivi, del tempo e del budget del
cliente.

caratteristiche
Sono state individuate 6 e circa 43
sottocaratteristiche:
1. Interface Communication (IC);
2. Content (CO);
3. Navigation (NA);
4. Management and Accessibility (MA);
5. Interactivity (IN);
6. Accesibility for people with disabilities (AD).

© Francesco Micali

Il Web Q-Model ©
Riguarda gli aspetti legati
all’interazione dell’utente con
l’interfaccia grafica del sito, quindi il
layout di pagina, la disposizione degli
.
elementi al suo interno,la forza
comunicativa dell’identità visuale, la
scelta dei colori e tipi di caratteri, gli
Si basa su 6 caratteristiche :
elementi grafici e multimediali inseriti,
il labelling.
•Interface Communication (IC);
•Content (CO);
•Navigation (NA);
•Management and Accessibility (MA);
•Interactivity (IN);
•Accessibility for people with disabilities (AD).

© Francesco Micali

Il Web Q-Model ©

Relativa alle informazioni fornite, la
loro accuratezza, la periodicità di
.
aggiornamento, la completezza dei
contenuti, la possibilità di consultare
le stesse informazioni in altre lingue,
la pertinenza.
Qualità dei contenuti multimediali
forniti, la leggibilità dei testi.
•Content (CO);
•Navigation (NA);
•Accesibility for people with disabilities (AD).

© Francesco Micali

Il Web Q-Model ©

Include tutti gli aspetti relativi alla
struttura ed all’architettura del sito,
all’adeguatezza degli strumenti forniti
all’utente per orientarsi durante la
visita, la possibilità di raggiungere
facilmente una determinata
informazione o di tornare
•Content (CO);
rapidamente indietro nella
•Navigation (NA); navigazione

© Francesco Micali

Il Web Q-Model ©

Garantire una corretta e continua
visualizzazione delle pagine,
indipendenza dalla piattaforma e dal
Si basa su 6 caratteristiche : browser utilizzato e in tempi
accettabili per l’utente, alta visibilità
sui motori di ricerca, la gestione delle
politiche di sicurezza del sito, delle
•Content (CO);
funzionalità offerte e degli script di
•Navigation (NA); errore utilizzati.

© Francesco Micali

Il Web Q-Model ©

Interazione attraverso commenti,
consigli, invio di contributi personali o
•Interface Communication (IC); creazione di community virtuali.
Tempestività con cui le risposte
•Content (CO); cortesi e pertinenti vengono fornite.
Trasparenza delle funzionalità offerte
•Navigation (NA);
dal sito e alla misura della facilità con
•Management and Accessibility (MA);un utente può raggiungere e
cui
attivare un dato collegamento.

© Francesco Micali

Il Web Q-Model ©

•Content (CO);
•Navigation (NA); Rendere ottimale la visibilità e la
fruizione dei servizi del sito anche per
le persone disabili che utilizzano sw
specifici per la navigazione tra le
pagine.
Linee guida del WAI e Legge Stanca.

© Francesco Micali

Il Web Q-Model ©

La Check-list di valutazione si suddivide in:

•Codice: Acronimo_della_categoria_numero (es. IC1);

•Descrizione: es. Utilizzare label chiare…;

•Modalità d’azione: Manuale e/o automatica;

•Azioni per la verifica: step 1, step 2, …step n.

© Francesco Micali

Il Web Q-Model ©

suddivisione nei tre livelli
Caratteristica / Q QQ QQQ
Livello
1, 2, 4, 6, 7, 8, 9, 10 3, 5, 11, 12, 13, 14 15
IC

1, 6 4, 5 2, 3, 7, 8
CO

1, 2 3, 4 5
NA

1, 3, 6, 7, 8 2, 4, 5 –
MA

1, 3 4 2, 5
IN

1.1.1 / 1.2.1-2 / 1.3.1-2-3 / 1.4.1-2 1.2.3-4 / 1.4.3-4-5 / 1.1.2 / 1.2.5-6-7 / 1.4.6-
AD
2.1.1-2 / 2.2.1 / 2.3.1 / 2.4.1-2-3-4 7-8-9 /
2.2.2 / 2.4.5-6-7 /
/ 3.1.1 / 3.2.1-2 / 3.3.1-2 / 2.1.3 / 2.2.3-4-5 /
3.1.2 / 3.2.3-4 /
4.1.1-2 2.3.2 / 2.4.8-9-10 /
3.3.3-4
3.1.3-4-5-6 / 3.2.5 /
3.3.5-6

© Francesco Micali

Il Web Q-Model ©

Livello
1, 2, 4, 6, 7, 8, 9, 10 3, 5, 11, 12, 13, 14 15
IC

1, 6 4, 5 2, 3, 7, 8
CO

per caratteristiche basic si
1, 2 3, 4 5
NA

intendono quelle che ogni
1, 3, 6, 7, 8 2, 4, 5 –
MA
utente dà per scontato
di trovare4sul sito;
1, 3 2, 5
IN

1.1.1 / 1.2.1-2 / 1.3.1-2-3 / 1.4.1-2 1.2.3-4 / 1.4.3-4-5 / 1.1.2 / 1.2.5-6-7 / 1.4.6-
AD
2.1.1-2 / 2.2.1 / 2.3.1 / 2.4.1-2-3-4 7-8-9 /
2.2.2 / 2.4.5-6-7 /
/ 3.1.1 / 3.2.1-2 / 3.3.1-2 / 2.1.3 / 2.2.3-4-5 /
3.1.2 / 3.2.3-4 /
4.1.1-2 2.3.2 / 2.4.8-9-10 /
3.3.3-4
3.1.3-4-5-6 / 3.2.5 /
3.3.5-6

© Francesco Micali

Il Web Q-Model ©

Livello
1, 2, 4, 6, 7, 8, 9, 10 3, 5, 11, 12, 13, 14 15
IC

1, 6 4, 5 2, 3, 7, 8
CO

per caratteristiche
1, 2 3, 4 5
NA

performance si intendono
1, 3, 6, 7, 8 2, 4, 5 –
MA
quelle che aggiungono
valore
1, 3 4 2, 5
IN
al sito;
1.1.1 / 1.2.1-2 / 1.3.1-2-3 / 1.4.1-2 1.2.3-4 / 1.4.3-4-5 / 1.1.2 / 1.2.5-6-7 / 1.4.6-
AD
2.1.1-2 / 2.2.1 / 2.3.1 / 2.4.1-2-3-4 7-8-9 /
2.2.2 / 2.4.5-6-7 /
/ 3.1.1 / 3.2.1-2 / 3.3.1-2 / 2.1.3 / 2.2.3-4-5 /
3.1.2 / 3.2.3-4 /
4.1.1-2 2.3.2 / 2.4.8-9-10 /
3.3.3-4
3.1.3-4-5-6 / 3.2.5 /
3.3.5-6

© Francesco Micali

Il Web Q-Model ©

Livello
1, 2, 4, 6, 7, 8, 9, 10 3, 5, 11, 12, 13, 14 15
IC

1, 6 4, 5 2, 3, 7, 8
CO

1, 2 3, 4 5
NA

per 6, 7, 8
caratteristiche exciting
1, 3, 2, 4, 5 –
MA
si intendono quelle che
provocano stupore
1, 3 4 2, 5
IN

positivo nell’utente.
1.1.1 / 1.2.1-2 / 1.3.1-2-3 / 1.4.1-2 1.2.3-4 / 1.4.3-4-5 / 1.1.2 / 1.2.5-6-7 / 1.4.6-
AD
2.1.1-2 / 2.2.1 / 2.3.1 / 2.4.1-2-3-4 7-8-9 /
2.2.2 / 2.4.5-6-7 /
/ 3.1.1 / 3.2.1-2 / 3.3.1-2 / 2.1.3 / 2.2.3-4-5 /
3.1.2 / 3.2.3-4 /
4.1.1-2 2.3.2 / 2.4.8-9-10 /
3.3.3-4
3.1.3-4-5-6 / 3.2.5 /
3.3.5-6

© Francesco Micali

Il Web Q-Model ©
- Interface Communication

IC1 - Labelling
Codice
Utilizzare label chiare,trasparenti, non ambigue, univoche e
Descrizione
specifiche rispetto al contenuto a cui si riferiscono.
Manuale
Modalità d’azione
1. Identificare tutte le etichette dei link della pagina, relative
Azioni per la verifica
sia alla navigazione principale che a quella contestuale;
2. Cercare di anticipare l’obiettivo di ogni link e controllare
successivamente la correttezza della supposizione, per
verificare la trasparenza e la non ambiguità delle stesse;
3. Verificare se esistono più label i cui rispettivi significati si
sovrappongono o risultano simili al punto da confondere
l’utente e provocare dei dubbi nella decisione di
selezionare l’uno o l’altro link;
4. Per ogni label verificare se il termine utilizzato risulta
abbastanza specifico rispetto al contenuto a cui si
riferisce.

© Francesco Micali

Il Web Q-Model ©

© Francesco Micali

Il Web Q-Model ©

IC2 – Simboli e icone
Codice
Utilizzare icone, simboli familiari all’utente (convenzionali) o il cui
Descrizione
significato o funzione sia comunque facilmente intuibile.
Manuale
1. Identificare tutte le immagini di interazione all’interno della
pagina (simboli o icone);
2. Verificare che seguano gli standard o le convenzioni
familiari degli utenti web;
3. Individuare le immagini di interazione che non seguono
questi standard,se esistono, assicurarsi che il loro
significato sia comunque intuitivo e facilmente
comprensibile.

© Francesco Micali

Il Web Q-Model ©

IC4 – Layout e stabilità di pagina
Codice
Verificare la distribuzione degli elementi, tenendo in
Descrizione
considerazione eventuali convenzioni riguardo il
posizionamento; effettuare raggruppamenti adeguati delle unità
informative rispetto al loro significato o obiettivo; evitare
sovraccarico di informazioni, pagine ridondanti e
sovrappopolate; garantire una buona scansionabilità della
pagina.
Manuale
1. Identificare le diverse macro-aree dell’homepage e delle
pagine interne e gli elementi che compongono ciascuna di
esse.
2. Verificare che gli elementi siano disposti all’interno della
pagina rispetto alla loro importanza. Per convenzione, gli
elementi più significativi e importanti occupano più spazio
e sono posti nella parte alta della pagina.

© Francesco Micali

Il Web Q-Model ©

3. Verificare che gli elementi della pagina siano propriamente
raggruppati rispetto al loro significato e obiettivo (es. link
esterni raggruppati).
4.A Verificare che la quantità dei messaggi e il loro significato
non sia eccessivo in particolare per un utente alla prima
visita ( misurare il tempo per trovare diversi tipi di
informazioni all’interno della pagina).
4.B Verificare che non vi siano elementi ripetuti o ridondanti.
5.A Verificare se le parole chiave del messaggio che la pagina
vuole trasmettere sono evidenziate (per esempio per
mezzo di simboli grafici, icone, elenchi puntati, colori,
grassetto) e se attraverso di esse è possibile, in prima
analisi, avere una visione generale del significato della
pagina.
5.B Verificare se le sezioni principali della pagina, come l’area
di ricerca, di registrazione o di navigazione, sono presenti
e visibili chiaramente.

© Francesco Micali

Il Web Q-Model ©

IC6 – Identità visuale
Codice
Sottolineare l’importanza del Brand (sito aziendale) o del
Descrizione
carisma personale (sito individuale); esplicitare la missione e la
proprietà del sito; caratterizzare questi elementi anche
attraverso lo stile grafico (colori, immagini).
Manuale
1. Verificare se l’identità visuale del sito è coerente con il Brand
dell’azienda o con la personalità di chi ha richiesto un sito
individuale (rispetto dei colori aziendali).
2. Verificare che il logo e il nome della azienda (o della persona)
siano sempre correttamente visulizzati in ogni pagina.
3. Provvedere a fornire direttamente in homepage informazioni
sulla missione dell’azienda o sulla proprietà del sito.
4. Verificare se lo stile grafico dell’intero sito è coerente con lo
stile grafico utilizzato altrove (brochures promozionali,
pubblicità televisiva o cartacea)

© Francesco Micali

Il Web Q-Model ©

IC7 – Uso dei colori
Codice
Utilizzare i colori in modo coerente e per un preciso scopo, per
Descrizione
identificare e contraddistinguere sezioni o sottosezioni del sito e
come elemento per attrarre l’attenzione dell’utente sui diversi
elementi della pagina.
Manuale
1.A Verificare che tutti i testi siano scritti con lo stesso colore. Se
sono utilizzati più colori, verificare che sia chiaro il motivo di
questa scelta.
1.B Verificare che tutti i link abbiano lo stesso colore.
2. Verificare il corretto uso dei colori per identificare sezioni
diverse della pagina o del sito.
3. Verificare che i colori usati nel sito non siano in conflitto e
inadeguati rispetto a ciò che viene trattato e al target
d’utenza.

© Francesco Micali

Il Web Q-Model ©

IC8 – Contrasto Testo/sfondo
Codice
Utilizzare una combinazione adeguata di colori per il testo e lo
Descrizione
sfondo, che non renda difficile la lettura.
Automatica
1. Verificare che la combinazione di colori utilizzata per il testo e
lo sfondo non ostacoli la lettura.
2. Verificare i due colori scelti presentino un’adeguata differenza
di colore e di luminosità attraverso l’uso di diversi
strumenti automatici.
3. Si consiglia l’uso di Contrast Analyser, strumento reperibile,
sia singolarmente sia integrato all’interno della Barra
dell’Accessibilità, nella sezione Validatori del sito
Webaccessibile.org oppure online
Le soglie di riferimento sono poste a 125 per la differenza di
luminosità e a 500 per la differenza di colore.

© Francesco Micali

Il Web Q-Model ©

IC9 – Font
Codice
Scegliere il tipo e le dimensioni del font in modo tale da
Descrizione
agevolare la lettura.
Manuale
1. Verificare se i differenti tipi di testo (titoli, sottotitoli, testi) sono
scritti utilizzando font che non rendono difficoltosa la lettura.
Dimensione Font > di 10,11 pt.
2. Verificare gerarchia per i font dei titoli, dei sottotitoli e dei testi.
Coerenza gerarchica in tutto il sito.
3. Verificare la scelta del font utilizzato. Sono preferibili font
sans-serif.
4. Verificare coerenza del tipo di font per tutte le pagine del sito.
5. Verificare che l’uso di testo in grassetto o sottolineato sia
corretto.

© Francesco Micali

Il Web Q-Model ©

IC10 – Identità dei link
Codice
Identificare i link con una simbologia chiara, convenzionale e
Descrizione
coerente in modo tale che sia facile distinguere i collegamenti
dagli altri elementi.
Manuale
1. Identificare tutti i link della pagina.
2. Verificare che siano associati ed evidenziati utilizzando
simboli visuali chiari e convenzionali, in modo tale da non
confondere l’utente e permettergli di distinguere facilmente
i collegamenti dagli altri elementi di testo o grafici.
Sul web si è ormai consolidata la convenzione di identificare i
link in blu e sottolineati.
3. Verificare la coerenza delle scelte effettuate all’interno di tutte
le pagine del sito.

© Francesco Micali

Il Web Q-Model ©
- Content

CO1 – Qualità dell’informazione
Codice
Verificare la qualità dell’informazione fornita: contenuto accurato,
Descrizione
attendibile, privo di errori, dettagliato, imparziale.
Manuale
1. Leggere e Verificare che ogni testo descriva adeguatamente
l’argomento trattato, sia consistente e non contenga
informazioni imprecise o errate.
3. Verificare che sia chiaro chi sia l’autore del testo e la natura di
quest’ultimo, cioè se rappresenta una notizia oggettiva, un
commento, un approfondimento, un messaggio
pubblicitario.
4. Verificare l’adeguatezza dell’autore nei confronti del
argomento trattato e nei confronti del target di utenza,
5. Verificare che il testo risulti grammaticalmente e
semanticamente corretto (non siano presenti errori
grammaticali o di punteggiatura, ripetizioni o verbi mal
coniugati).

© Francesco Micali

Il Web Q-Model ©
- Content

CO6 – Comprensibilità dei contenuti
Codice
Verificare la qualità dell’informazione fornita: contenuto accurato,
Descrizione
attendibile, privo di errori, dettagliato, imparziale.
Manuale / Automatico
1.Verificare che il contenuto sia comprensibile e autoesplicativo,
cioè che il contenuto presentato sia chiaro e non ambiguo.
2. Verificare che il linguaggio, la terminologia e lo stile dei testi
siano scelti in linea con il dominio di appartenenza del sito.
Gli indici di leggibilità più famosi relativi alla lingua italiana
sono il Flesch-Vacca e il Gulpease.
3. Verificare che il contenuto sia fornito in modo tale da
semplificare la comprensione dell’utente, quindi utilizzando
liste puntate o tabelle che forniscono immediatamente una
visione chiara e schematica di ciò di cui si sta parlando.

© Francesco Micali

Il Web Q-Model ©
- Navigation

NA1 – Architettura e topologia
Codice
Verificare che la struttura del sito sia coerente con i contenuti e
Descrizione
che permetta una facile navigazione.
Manuale
1. Verificare che la divisione in aree sia effettuata in maniera
lineare e intuitiva in modo tale da essere facilmente
comprensibile per l’utente (numero magico di Miller, cioè
7±2).
2. Verificare che sia comprensibile il motivo per cui le varie
pagine sono raggruppate nella stessa area e per cui gli
argomenti sono disposti in un certo ordine all’interno della
navigazione.
3 Verificare che l’architettura del sito sia facilmente
memorizzabile dagli utenti, cioè che essi possano riuscire
in poco tempo a crearsi una mappa mentale del sito.

© Francesco Micali

Il Web Q-Model ©
- Navigation

NA2 – Orientamento
Codice
Mettere in condizione l’utente di non perdere l’orientamento
Descrizione
(utilizzare briciole di pane o altri punti riferimento), fornire chiara
indicazione all’utente di dove si trova o dove verrà condotto
(descrizione nei link title).
Manuale
1.Verificare che all’utente siano sempre forniti dei punti di
riferimento ben definiti su dove si trova in modo tale da
impedirgli di perdere l’orientamento.
2.Verificare che sia sempre fornita all’utente una chiara
indicazione del percorso effettuato per raggiungere la
pagina corrente, a partire dalla homepage, attraverso
strumenti che aiutino soprattutto chi non ha familiarità con
la struttura del sito, come le ”briciole di pane”.
3.Verificare che ogni link interno indichi chiaramente dove
l’utente verrà condotto nel caso di click su quel
collegamento, attraverso nomi significativi e title.

© Francesco Micali

Il Web Q-Model ©
- Navigation

4. Verificare che sia sempre chiaro ed esplicitato all’utente
quando la scelta di determinati collegamenti
provocherebbe un passaggio da un’area all’altra del sito,
al fine di evitare il disorientamento.

5. Verificare che i link esterni siano facilmente distinguibili dagli
altri, in modo tale che l’utente sia preparato ad essere
indirizzato ad una pagina esterna al sito.

© Francesco Micali

Il Web Q-Model ©
- Management & Accesssibility

MA1 – Requisiti hardware e software
Codice
Verificare la compatibilità con i diversi browser, le piattaforme
Descrizione
supportate; evitare l’uso di plug-in e formati proprietari;
controllare le tecnologie utilizzate.
1. Verificare la corretta visualizzazione delle pagine sui diversi
sistemi operativi tramite i browser più diffusi. Navigare sul
sito attraverso questi diversi browser per identificare
eventuali errori di visualizzazione o discrepanze grafiche.
Oppure utilizzare i servizi offerti dal sito BrowserCam .
2. Verificare se sono supportate più piattaforme: WebTV, telefoni
cellulari, palmari. Tramite il software WebTv Viewer .
3. Verificare se sono utilizzati plug-in o formati proprietari, che
dovrebbero essere evitati perchè potrebbero creare dei
problemi di visualizzazione agli utenti che non dispongono
delle tecnologie relative . Limitare l’uso di tecnologie non
universalmente diffuse solo ai casi di effettiva necessità.

© Francesco Micali

Il Web Q-Model ©

MA3 – Reperibilità sui motori di ricerca
Codice
Verificare il grado di reperibilità sui motori di ricerca.
Descrizione
1. Scegliere un nome per il sito che sia semplice e mnemonico.
2. Verificare con regolarità la posizione in cui il sito viene
segnalato dai più diffusi motori di ricerca, che in Italia sono
rappresentati daGoogle, Virgilio e Libero.
3.Utilizzare delle keyword tramite cui cercare di raggiungere il
sito e verificare se questo si trova nei primi 30 risultati.
Quest’operazione può essere effettuata sia manualmente
sia automaticamente – EasyPosition oTuttowebmaster.

© Francesco Micali

Il Web Q-Model ©

3. Monitorare indicatori offpage di un sito: link popularity, page
rank, link popularity efficace e domain popularity efficace.
La popolarità di un sito può essere calcolata manualmente o
utilizzando Tuttowebmaster.
Il valore di Page rank è fornito dalla Google Toolbar,
Gli indici efficaci si consiglia di calcolarli utilizzando le seguenti
semantiche sul motore di ricerca di Yahoo:
– link:http://www.nomesito.it -site:nomesito.it per la link
popularity
efficace;
– linkdomain:www.nomesito.it -site:nomesito.it per la domain
popularity efficace.

© Francesco Micali

Il Web Q-Model ©

MA6 – Funzionalità
Codice
Garantire l’adeguatezza e la correttezza delle funzionalità.
Descrizione
Manuale
1. Verificare che le diverse funzionalità di vario tipo offerte dal
sito siano tutte correttamente funzionanti e adeguate
rispetto agli scopi e alle aspettative degli utenti.
2. Verificare se, nel caso di errore da parte dell’utente durante
una transazione, il sistema ricorda e mantiene comunque
le informazioni e le operazione effettuate
precedentemente, evitando di dover ricominciare
dall’inizio.
3. Nel caso in cui sia prevista un’area di login, verificare che
questa funzione di accesso e riconoscimento funzioni
correttamente, sia basata su pochissimi parametri facili da
ricordare (di solito due) e preveda routine di recupero
password in caso di dimenticanza.

© Francesco Micali

Il Web Q-Model ©

4. Offrire all’utente la possibilità di fornire i propri dati personali
una volta soltanto, attraverso una form di registrazione
accurata e richieste rilevanti. In particolare:
– Verificare che i campi obbligatori siano ridotti al minimo e
distinguerli chiaramente dagli altri attraverso l’uso di
simboli o di differenze di colore.
– Prevedere una procedura semplice che consenta all’utente di
modificare i propri dati e di annullare la propria
registrazione e renderla sempre visibile e disponibile
all’utente.

© Francesco Micali

Il Web Q-Model ©

MA7 – Sicurezza e Privacy
Codice
Utilizzare politiche di sicurezza e garantire il corretto uso dei dati
Descrizione
personali.
Manuale
1. Utilizzare delle politiche di sicurezza adeguate al tipo e al
valore dei dati da preservare da accessi esterni e indebiti e
da cancellazioni involontarie.
2. Garantire il corretto uso dei dati personali forniti dagli utenti
tramite form di registrazione ai servizi del sito, nel rispetto
della legge sulla privacy e sulla tutela dei dati personali.
3. Fornire precise e esplicite indicazioni relative alle politiche di
sicurezza e di privacy utilizzate, direttamente nella pagina
in cui vengono inserite le informazioni da proteggere.
4. Inserire alla fine di ogni pagina collegamenti a pagine che
descrivono le condizioni d’uso.

© Francesco Micali

Il Web Q-Model ©

MA8 – Gestione degli errori
Codice
Verificare le reazioni del sistema e l’adeguatezza e la
Descrizione
comprensibilità degli script di errore, eliminare o riparare broken
link e pagine under costruction.
Manuale / Automatica
1. Verificare la reazione del sistema nel caso in cui vengano
inserite informazioni scorrette all’interno di una form, ad
esempio per quanto riguarda le date o gli indirizzi e-mail: il
sistema dovrebbe fornire un messaggio di warning relativo
alle informazioni scorrette.

2. Verificare la reazione del sistema nel caso in cui non vengano
riempiti dei campi obbligatori all’interno di una form: il
sistema dovrebbe fornire un messaggio di warning che
ricordi all’utente quali sono i campi obbligatori (evidenziati,
affiancati da un asterisco).

© Francesco Micali

Il Web Q-Model ©

3. Verificare la reazione del sistema in caso di inserimento di
caratteri speciali (è,ò,à,ù,ì,?,!,”): il sistema dovrebbe
riconoscerli o fornire un warning in cui sono elencati i
caratteri speciali che non possono essere utilizzati nella
form.
4. Verificare che i warning forniti dal sistema all’utente siano
sempre tempestivi, molto chiari e forniscano utili
indicazioni su come correggere l’azione scorretta.
5. Verificare la presenza di link spezzati o obsoleti, con cadenza
frequente, attraverso uno dei vari strumenti open source
disponibili in rete, Xenu’s Link - link del W3C – e-Valid.
6. Verificare la presenza di pagine ”under costruction”, ed
effettuare le dovute correzioni.

© Francesco Micali

Il Web Q-Model ©
- Interactivity

IN1 – Trasparenza dell’interazione
Codice
Garantire la trasparenza delle funzionalità fornite nell’interazione
Descrizione
con l’utente: esplicita comunicazione delle conseguenze delle
azioni svolte, possibilità di effettuare UNDO.
Manuale
1. Verificare che prima dell’inizio di ogni transazione all’utente
vengano chiaramente comunicate le informazioni rilevanti
relative alla transazione stessa e alle conseguenze
dell’azione svolta.
2. Verificare che sia sempre ben chiaro all’utente quali saranno
le conseguenze di ogni transazione eseguita all’interno del
sito o del riempimento di campi e relativa sottomissione.
3. Verificare che nel caso di scaricamento di un file dal sito sia
comunicato esplicitamente all’utente il tipo di file e le sue
dimensioni.

© Francesco Micali

Il Web Q-Model ©
- Interactivity

4. Verificare che siano sempre comunicati all’utente i risultati di
un’azione compiuta.
5. Verificare che sia sempre possibile per l’utente effettuare
UNDO nelle pagine di form e che gli venga sempre fornita
la possibilità di annullare l’operazione.

© Francesco Micali

Il Web Q-Model ©
- Interactivity

IN3 – Contatti e Help
Codice
Fornire informazioni di contatto e help.
Descrizione
Manuale
1. Verificare che siano sempre disponibili e visibili all’interno
di ogni pagina le informazioni di contatto, comprendenti un
indirizzo e-mail da utilizzare nelle comunicazioni di varia
natura, un numero di telefono ed eventuali generalità del
responsabile dei rapporti con gli utenti.

2. Verificare la presenza di una funzione di help, che possa
aiutare gli utenti per quanto riguarda le funzionalità offerte
o fornisca suggerimenti e/o indicazioni utili agli utenti.

© Francesco Micali

Il Web Q-Model ©
- Accessibility for people with
disabilities

AD 1.1.1 – Testi alternativi
Codice
Fornire testi alternativi per ogni contenuto non testuale cosicchè
Descrizione
possa essere cambiato in altre forme secondo i bisogni degli
utenti, come braille, voce, simboli o linguaggio più semplice.
Manuale
Fornire un testo alternativo che presenti informazioni equivalenti
per tutti i contenuti non testuali, eccetto per situazioni
come i controlli o elementi puramente decorativi (livello A).

© Francesco Micali

Il Web Q-Model ©
disabilities

AD 1.2.1-2 – Multimedia sincronizzato
Codice
Fornire alternative sincronizzate al posto di elementi multimediali
Descrizione
sincronizzati.
Manuale
1. Fornire didascalie per il materiale multimediale
sincronizzato preregistrato, con l’eccezione di quello che è
già sincronizzato con un testo alternativo ed è chiaramente
etichettato (livello A).

2. Fornire descrizioni audio di scene visive o un testo completo
alternativo che includa ogni interazione, per tutto il
materiale multimediale sincronizzato (livello A).

© Francesco Micali

Il Web Q-Model ©
disabilities

AD 1.3.1-2-3 - Adattabilità
Codice
Creare il contenuto in modo che possa essere presentato in
Descrizione
modi e con mezzi differenti (ad esempio attraverso un layout più
semplice) senza una perdita di informazione o struttura.
Manuale
1.predisporre il contenuto in modo tale che gli strumenti utente,
come ad esempio le tecnologie assistive, possano estrarre
e presentare le informazioni in differenti modalità (livello
A).
2. Determinare una corretta sequenza di lettura quando la
sequenza in cui il contenuto è presentato influenza il suo
significato (livello A).
3. Non fornire istruzioni per la comprensione e l’utilizzo del
contenuto che siano solamente relative a caratteristiche
sensoriali come la forma, le dimensioni, la posizione,
l’orientamento o il suono.

© Francesco Micali

Il Web Q-Model ©
disabilities

AD 1.4.1-2 – Percettibilità e Distinguibilità
Codice
Rendere più semplice per gli utenti vedere e ascoltare il
Descrizione
contenuto separando lo sfondo dal primo piano.
Manuale
1. Non utilizzare solo il colore come unico mezzo visuale per
trasmettere informazioni, per indicare un azione o un
responso o per distinguere elementi visuali (livello A).
2. Se esiste un audio di sfondo che è previsto che suoni per più
di 3 secondi, rendere disponibile un meccanismo per
mettere in pausa e fermare l’audio o un meccanismo di
controllo del volume che possa essere impostato su livelli
diversi del controllo di volume del sistema (livello A).

© Francesco Micali

Il Web Q-Model ©
disabilities

AD 2.1.1-2 – Tastiera accessibile
Codice
Rendere tutte le funzionalità disponibili da tastiera.
Descrizione
Manuale
1. Rendere utilizzabili tutte le funzionalità del contenuto
attraverso tastiera senza specifici vincoli di tempo, eccetto
dove la funzione sottostante richiede input che dipendono
dal percorso del movimento dell’utente e non solo dal
punto di arrivo (livello A).
2. Il focus deve poter essere spostato da un componente della
pagina a un altro tramite tastiera e l’utente deve essere
informato del modo per farlo (livello A).

© Francesco Micali

Il Web Q-Model ©
disabilities

AD 2.2.1 - Tempo
Codice
Fornire agli utenti con disabilità abbastanza tempo per leggere e
Descrizione
usare il contenuto.
Manuale
– all’utente è permesso spegnere il limite di tempo prima che
inizi il conteggio;
– all’utente è permesso modificare il limite di tempo, prima che
inizi il conteggio, di una quantità di tempo che è almeno 10
volte la lunghezza dell’impostazione di default;
– l’utente è avvisato prima che il tempo scada e gli sono forniti
almeno 20 secondi per estendere il limite di tempo con
una semplice azione (per esempio, ”premere la barra
spaziatrice”) e all’utente è permesso estendere il limite di
almeno 10 volte;

© Francesco Micali

Il Web Q-Model ©
disabilities

AD 2.3.1 – Attacchi improvvisi
Codice
Non progettare il contenuto del sito in un modo che potrebbe
Descrizione
causare attacchi improvvisi, come scritte lampeggianti.
Manuale
Non utilizzare all’interno delle pagine web qualunque elemento
che lampeggi per più di tre volte in un secondo, o la scritta
lampeggiante sia sotto le soglie dei ”flash generali e flash
rossi” (livello A).

© Francesco Micali

Il Web Q-Model ©
disabilities

AD 2.4.1-2-3-4 - Navigabilità
Codice
Fornire delle modalità per aiutare gli utenti disabili a
Descrizione
navigare,trovate le informazioni cercate e sapere sempre dove si
trovano.
Manuale
1.Rendere disponibile un meccanismo per bypassare blocchi di
contenuto ripetuti su pagine web multiple (livello A).
2.Utilizzare title descrittivi per le pagine web (livello A).
3.Se una pagina web può essere navigata sequenzialmente e le
sequenze di navigazione influenzano il significato o
l’operazione, gli elementi componenti la pagina devono
ricevere il focus in un ordine che preservi il significato e
l’operabilità (livello A).
4.Lo scopo di ogni link deve essere determinato solo dal testo
del link o dal testo insieme con il suo contesto (livello A).

© Francesco Micali

Bibliografia 1/3

[1] Accessibilità di siti web - Problematiche reali e soluzioni [13] Legge Stanca (n. 4/2004) http://www.leggestanca.it/.
tecniche [14] Minerva Pattern - Elenco completo
http://www.ifac.cnr.it/smid/accesso/accesso.htm. http://www.minervaeurope.org/publications/qualitycriteriai/
[2] Alertsite http://www.alertsite.com/. indice0402/appendicetre0402.htm.
[3] Banca Popolare Etica http://www.bancaetica.com. [15] Netcraft http://news.netcraft.com/.
[4] Bobby Watchfire [16] Tecnoteca, il Portale delle Tecnologie informatiche
http://www.watchfire.com/products/webxm/bobby.aspx. http://www.tecnoteca.it.
[5] BrowserCam http://www.browsercam.com/home.aspx. [17] Torquemada http://www.webxtutti.it/testa.htm.
[6] Cinematografo http://www.cinematografo.it/. [18] Total validator
[7] Eulogos - Servizio Censor ttp://www.totalvalidator.com/validator/validator.
http://www.eulogos.net/it/censor/default.htm [19] Tuttowebmaster
[8] Evalid http://www.soft.com/evalid/. http://www.tuttowebmaster.it/.
[9] FeedReader 3 http://www.feedreader.com/. [20] W3C Web Content Accessibility Guidelines 2.0
[10] Freeware Web - Download WebTv Viewer 2.6 http://www.w3.org/tr/wcag20/.
http://www.freewareweb.com/cgi- [21] W3C World Wide Web Consortium - Ufficio Italiano - La
bin/archive.cgi?download=1id=481 Web Accessibiliy
[11] Hera http://www.sidar.org/hera/index.php.it Initiative
[12] ISO/IEC 9126:2001 Software Engineering - Product http://www.w3c.it/wai/.
Quality [22] Watchmouse - Monitoraggio di server e siti web
http://www.iso.org/iso/iso_catalogue/catalogue_tc/catalogue_d
http://www.watchmouse.com.
etail.htm?csnumber=22749.

© Francesco Micali

Bibliografia 2/3

[22] Watchmouse - Monitoraggio di server e siti web [33] R. Polillo. Il check-up dei siti web - Valutare la qualità
per migliorarla. Edizioni Apogeo. 2004.
http://www.watchmouse.com.
[34] R. Polillo. Un modello di qualità per i siti web. Mondo
[23] Wave http://wave.webaim.org/.
Digitale n.2, pp. 32-44. giugno 2005.
[24] Web Engineering Community Portal
[35] G. Rossi D. Godoy G.J. Lafuente L. Olsina Santos.
http://webengineering.org.
Specifying Quality Characteristics and Attributes for
[25] Webaccessibile http://webaccessibile.org. Websites. Lecture Notes in Computer Science, Vol.2016
[26] WebSiteOptimization Springer-Verlag Eds, pp. 266-277. giugno 2001.
http://www.websiteoptimization.com/. [36] L. Olsina Santos. Web-site Quality Evaluation Method:
[27] Wikipedia - L’enciclopedia libera http://it.wikipedia.org. a Case Study on Museums.ICSE 99 - Second Workshop on
Software Engineering over the Internet.1999.
[28] Xenu’s Link Sleuth
http://home.snafu.de/tilman/xenulink.html. [37] L. Marucci O. Signore. Evaluating Web sites quality.
CMG Italia – Congresso annuale - Pisa 19-21 maggio 2004
[29] MINERVA Working Group 5. Quality Principles for
(http://www.w3c.it/talks/cmg2004-quality/overview.htm ).
Cultural Websites: a Handbook.
http://www.minervaeurope.org. 2003. [38] O. Signore. A Comprehensive Model for Web Sites
Quality. Proc. WSE2005 - Settimo Simposio Internazionale
[30] L. Mich M. Franch. Un modello per la valutazione di siti
IEEE sull’Evoluzione dei siti web – Budapest 26 settembre
web. 2000.
2005.
[31] L. Mich M. Franch L. Gaio. Evaluating and Designing
[39] O. Signore. Towards a quality model for web sites.
Web Site Quality. IEEE Multimedia, Gen-Mar, pp. 34-437.
Primo Congresso CMG Polonia - Hotel Hyatt Regency 9-10
2003.
maggio 2005 Varsavia.
[32] N. Di Blas M.P. Guermand C. Orsini P. Paolini.
Evaluating The Features Of Museum Websites: (The Bologna
Report). Museums and the Web. 2002.

© Francesco Micali

Bibliografia 3/3

[40] L. Tamai. Un modello di qualità per i siti web. Tesi di [45] G. Von Dran P. Zhang. Expectations and Rankings of
laurea Università degli studi di Milano, AA 1995/96, sviluppata Website Quality Features: Results of Two Studies on User
in ambito ETNOTEAM (http://www.etnoteam.it/webquality). Perceptions. Proc. 34th Hawaii International Conference on
1996. System Sciences. 2001.
[41] L. Triacca. Web Usability - Enhancing Effectiveness of [46] G. Von Dran R. Small P. Zhang. Quality Websites: An
Methodologies and Improvingtheir Communication Features. Application of the Kano Model to Website Design. Proc.
Tesi di dottorato, Università di Lugano.2005. Fifth Americas Conference on Information Systems 13-15
agosto 1999.
[42] Kano Noriaki N. Seraku F. Takahashi S. Tsuji. Attractive
and Normal Quality. Quality (14:2), pp. 39-48. 1984.
[43] A. Aimar C. Mulatti S. Carrescia M. Visciola. Validazione
di una griglia di misurazione dell’usabilità dei siti web. Proc.
CHItaly 2001. 1984.
[44] M. Visciola. Software engineering: dalla qualità del
prodotto e dei processi alla qualità dell’esperienza. Riflessioni
su ebusabile.it
(http://www.webusabile.it/archivio/2002/2/15.aspx). 2002.

© Francesco Micali

Fine

Grazie a tutti per l’attenzione.
E-mail: f.micali @ mediabeta.com

LinkedIn-contact: www.linkedin.com/pub/dir/francesco/micali
Skype-contact: mediabeta.srl
Twitter-contact: twitter.com/mediabeta
Website: www.mediabeta.com

© Francesco Micali

Qualità per Il Web - La Metodologia Mediabeta

Recommandé

Recommandé

Contenu connexe

Similaire à Qualità per Il Web - La Metodologia Mediabeta

Similaire à Qualità per Il Web - La Metodologia Mediabeta (20)

Plus de f.micali

Plus de f.micali (12)

Dernier

Dernier (18)

Qualità per Il Web - La Metodologia Mediabeta