Docstoc

USABILITA' DEI SITI WEB

Document Sample
USABILITA' DEI SITI WEB Powered By Docstoc
					E-government:
L’USABILITA'
DEI SITI WEB


        e-Government Conference
          Roma, Hotel Sheraton
                22.10.03


            Arturo Di Corinto




           arturo.dicorinto@uniroma1.it
What you see
is what you get?


Quante volte ci troviamo a visitare un sito
 web senza capire dove-cosa-come?
E’ accettabile che questo accada per i servizi
  orientati al cittadino?


              arturo.dicorinto@uniroma1.it
Comunicazione efficace


Le tre dimensioni dell’efficacia:
la complessita’ del compito
la facilita’ d’uso della tecnologia utilizzata
 il livello di abilita’ del target


                  arturo.dicorinto@uniroma1.it
Bisogno Informativo


 Un sito viene visitato per una ragione ben
    precisa.
 La visita coincide con un bisogno di
    informazioni.
 Il bisogno di informazioni puo’ essere
    generico o specifico.


              arturo.dicorinto@uniroma1.it
Bisogni non soddisfatti

Ogni volta che non si trova l’informazione
 cercata o che non si riesce a concludere
 un’azione o a prendere una decisione sulla
 base delle informazioni disponibili,
 abbiamo un problema di usabilita’.




               arturo.dicorinto@uniroma1.it
Usabilita’

 “Un sito web e’ usabile quando soddisfa i
 bisogni informativi dell’utente che lo sta
 visitando o interrogando, fornendogli
 facilita’ d’accesso e di navigabilita’ e
 consentendo un adeguato livello di
 comprensione dei contenuti”
             - M. Visciola, 2000 -



               arturo.dicorinto@uniroma1.it
Frustrazione

 Se vi e’ capitato spesso di avere difficolta’
 a navigare un sito, considerate che solo
 una attenta progettazione del sito vi aiuta
 ad evitare i problemi dell’usabilita’.




                arturo.dicorinto@uniroma1.it
Qualita’ e usabilita’

 L’usabilita’ e la qualita’ di un sito web
 coincidono.
 La qualita’ del servizio o dell’offerta
 dipendono dalla percezione che l’utente
 ha dell’usabilita’ del sito web.




               arturo.dicorinto@uniroma1.it
Qualita’ dei siti web

Come si costruisce un sito web di qualita’?
Come si puo’ valutare la qualita’ dei siti
 esistenti?
Come si possono migliorare siti gia’
 esistenti?




                arturo.dicorinto@uniroma1.it
What To Do?

Niente sostituisce l’esperienza, il testing e
 la verifica sul campo dell’efficacia
 comunicativa di un sito web.
Un buon sito e’ un sito in cui siete stati
 capaci di immaginare l’utente finale nella
 progettazione.



                 arturo.dicorinto@uniroma1.it
Modelli mentali

User first
Modelli mentali
Sforzo cognitivo
Empowerment




               arturo.dicorinto@uniroma1.it
Uomo e Macchina

Seguire alcune semplici regole di
  progettazione ci aiuta ad evitare
  grossolani errori di comunicazione:
  automatizzare le procedure
  immaginare differenti tipologie di interattori
  calibrare la difficolta’ dell’interfaccia



                 arturo.dicorinto@uniroma1.it
Permettere all’utente di
raggiungere il suo scopo




     Ovvero chiarire la mission
     del sito e fare di tutto per
     renderla operativa.


          arturo.dicorinto@uniroma1.it
Requisiti minimi

 Navigabilita’
 Utilita’ Attesa
 Completezza dei contenuti
 Comprensibilita’ delle informazioni
 Efficacia Comunicativa
 Attrattivita’ Grafica


              arturo.dicorinto@uniroma1.it
Navigabilita’


Esistenza di un sistema di navigazione che
 aiuti a orientarsi nel sito ed a cercare
 l’informazione




               arturo.dicorinto@uniroma1.it
Utilita’ Attesa


la disponibilita’ di risorse e servizi che
 corrispondano alle esigenze degli utenti
 finali e consentono il conseguimento degli
 scopi




               arturo.dicorinto@uniroma1.it
Completezza dei contenuti


La presenza di contenuti informativi al
 livello di dettaglio preferibile dagli utenti




                 arturo.dicorinto@uniroma1.it
Comprensibilita’ delle
informazioni


L’adozione di forme linguistiche e
 rappresentazionali adeguate all’utente




               arturo.dicorinto@uniroma1.it
Efficacia Comunicativa


coincidenza tra l’interfaccia e la strategia
 comunicativa del sito.




                 arturo.dicorinto@uniroma1.it
Attrattivita’ Grafica


La qualita’ della grafica e la piacevolezza
 estetica di un sito




                arturo.dicorinto@uniroma1.it
NAVIGAZIONE




         arturo.dicorinto@uniroma1.it
Strumenti di orientamento/percorso


  Il sito deve offrire all’utente tutti gli strumenti per
     orientarsi all’interno della struttura delle pagine
     Web (barra di navigazione sia iconica che testuale,
     segnalazione del percorso effettuato, mappa attiva,
     funzioni di ricerca).




                   arturo.dicorinto@uniroma1.it
Back, reversibilità degli errori

Un buon sistema di navigazione è:
 facile da apprendere (‘zero learning time’),
 deve permettere la reversibilità degli errori (come il
  ritornare indietro dopo aver scelto un determinato link)
 e soprattutto deve mirare alla soddisfazione nell’uso.




                      arturo.dicorinto@uniroma1.it
Ancoraggi Cognitivi

 Una buona navigazione favorisce il raggiungimento degli
  obiettivi da parte dell’utente, il quale deve capire in ogni
  momento dove si trova, dove può andare e come
  raggiungere le altre sezioni.




                      arturo.dicorinto@uniroma1.it
Navigazione in spazio comune in alto

    Le funzioni di navigazione devono essere raggruppate
     in uno spazio comune, ben differenziato dall’area in
     cui appaiono i contenuti, e posizionato preferibilmente
     nella parte superiore dello schermo per evitare di
     costringere l’utente a scorrere la pagina.




                    arturo.dicorinto@uniroma1.it
PREDICIBILITA’

 Le azioni permesse dalle zone attive dell’interfaccia
   (barre di navigazione, bottoni, link) devono essere
   immediatamente comprensibili.
 La struttura del sito e l’organizzazione dei contenuti
   devono essere intuitive.




                    arturo.dicorinto@uniroma1.it
Standard di progettazione

    Non c’e’ limite alla creativita’ su Internet,
     tuttavia i progettisti di siti web tendono a
     rispettare alcuni standard minimi nella
     realizzazione delle pagine web dei siti .




                 arturo.dicorinto@uniroma1.it
Less is more




     More or less...




  arturo.dicorinto@uniroma1.it
Segnalare i Links

   - I link devono essere preferibilmente
     sottolineati o comunque ben segnalati




               arturo.dicorinto@uniroma1.it
Links: assoluti e relativi

   - Devono essere differenziati i link interni da
     quelli diretti verso altri siti.




                arturo.dicorinto@uniroma1.it
Active Link

   - I link già visitati devono essere segnalati da
     un colore diverso




                arturo.dicorinto@uniroma1.it
Back-Home

  - Tutte le pagine devono essere collegate alla
    home page ed alla parent-page (la pagina di
    provenienza)




               arturo.dicorinto@uniroma1.it
Alt_Tag

È bene utilizzare le descrizioni dei link da far
 apparire con effetto on-mouse-over.




                  arturo.dicorinto@uniroma1.it
CONSISTENZA




        arturo.dicorinto@uniroma1.it
Zone attive sempre nella stessa
posizione

  Le zone attive relative alla navigazione del sito devono
    essere situate sempre nella medesima posizione e
    mantenere il proprio aspetto: solo in questo modo
    potranno essere immediatamente riconoscibili per
    l’utente che minimizzerà così il suo impegno
    cognitivo e potrà concentrarsi meglio sul suo compito.




                    arturo.dicorinto@uniroma1.it
Multipiattaforma

 Questo problema viene ulteriormente evidenziato nel
  caso della visualizzazione della stessa pagina Web da
  parte di diversi browser ed a risoluzioni diverse.




                  arturo.dicorinto@uniroma1.it
PROGRESSIONE




        arturo.dicorinto@uniroma1.it
Dal semplice al complesso


I contenuti vanno organizzati seguendo una progressione
   che va dalla semplicità alla complessità, evidenziando
   fin da subito l’argomento principale e relegando gli
   approfondimenti in fondo (stile della piramide invertita).
 L’utente deve essere libero di scegliere il livello di
   complessità più adatto alle sue esigenze.




                      arturo.dicorinto@uniroma1.it
7 possibilità di scelta e 3 click


 Non bisogna offrire all’utente troppe alternative in una
  volta ma è bene creare una gerarchia di scelte in modo
  da orientarlo verso la soddisfazione dei suoi obiettivi,
  evidenziando fin dall’inizio le informazioni rilevanti per
  il raggiungimento del suo scopo.




                      arturo.dicorinto@uniroma1.it
Struttura

Il sito dev’essere strutturato in modo
 gerarchico, secondo un diagramma ad albero
 in cui:




                arturo.dicorinto@uniroma1.it
Alternative

il numero massimo di alternative possibili
 all’interno della stessa pagina non dovrebbe
 superare i 7(+/- 2) elementi




                 arturo.dicorinto@uniroma1.it
Profondita’

il massimo livello di profondità (numero di
 click per raggiungere l’informazione)
 dovrebbe mantenersi sul terzo o quarto
 (regola dei 3 click: l’utente deve poter
 raggiungere qualunque sezione del sito con al
 massimo 3 click).



                 arturo.dicorinto@uniroma1.it
Testi brevi


In ogni pagina, il testo dev’essere breve,
 chiaro e conciso e strutturato in piccoli
 paragrafi.




                 arturo.dicorinto@uniroma1.it
VINCOLI NATURALI




         arturo.dicorinto@uniroma1.it
Rispetto della morfologia degli
oggetti e delle convenzioni culturali

  Utilizzare le proprietà morfologiche degli oggetti
    (forma, colore, dimensioni e posizione) per indirizzare
    l’utente verso determinate azioni e anticipare i suoi
    errori, tenendo conto delle convenzioni culturali: (il
    colore rosso, le forbici, il cestino, la buca delle lettere)




                      arturo.dicorinto@uniroma1.it
VISIBILITA’




              arturo.dicorinto@uniroma1.it
visibili



      Gli elementi più importanti devono essere ben
       visibili e la loro funzione dev’essere
       immediatamente comprensibile a partire dal loro
       aspetto. In particolare, le dimensioni dei tasti che
       svolgono le funzioni di navigazione devono
       facilitarne la riconoscibilità e la selezione (e il
       click) da parte dell’utente. Le animazioni sono
       utili per evidenziare determinati elementi
       all’interno dell’equilibrio complessivo della
       pagina. Quando è possibile, raggruppare (per
       forma, colore e posizione) le informazioni tra loro
                     arturo.dicorinto@uniroma1.it
TRASPARENZA




        arturo.dicorinto@uniroma1.it
Grafica utile e “trasparente”

 L’attenzione dell’utente dev’esser concentrata sull’azione
  che sta svolgendo e sulle informazioni che sta cercando
  piuttosto che nel formato grafico o nella navigazione.




                     arturo.dicorinto@uniroma1.it
Grafica Funzionale

 Non si deve rinunciare ad una veste grafica elevata, ma
  essa non deve disorientare l’utente.
 La grafica può creare un clima e l’utente non deve fare
  uno sforzo cognitivo per comprenderla.
 Gli elementi grafici vanno utilizzati solamente se
  comportano un reale valore aggiunto per la fruizione




                     arturo.dicorinto@uniroma1.it
Immagini e Colori

 In generale, è meglio impiegare immagini piccole, veloci
  da caricare, e non usare una gamma cromatica troppo
  estesa (al massimo 4-5 colori) per non affaticare la
  visione.
 Come standard, mantenere il logotipo aziendale o
  istituzionale in tutte le pagine e sempre nella stessa
  posizione (preferibilmente in alto a sinistra).




                     arturo.dicorinto@uniroma1.it
FEEDBACK




           arturo.dicorinto@uniroma1.it
Per ogni azione un feedback

  • Ogni azione deve avere un effetto ovvio, ben visibile
    e immediato.
  • Questo significa ad esempio che i link attivi o i
    pulsanti di navigazione devono essere segnalati da un
    effetto on-mouse-over e on-mouse-click e che
    qualsiasi cambiamento della sezione o errore
    dell’utente dev’essere immediatamente comunicato.




                    arturo.dicorinto@uniroma1.it
OBIETTIVI




            arturo.dicorinto@uniroma1.it
Orientamento agli obiettivi
dell’utente

L’utente all’interno di un sito dev’essere facilitato nel
  perseguimento dei suoi obiettivi.
Le informazioni devono essere pertinenti, rilevanti (non
  dare più informazioni di quelle richieste in quella fase di
  esplorazione del sito) ed espresse in modo chiaro in
  modo da risultare comprensibili per il target specifico.




                      arturo.dicorinto@uniroma1.it
ESPERIENZA




        arturo.dicorinto@uniroma1.it
Il web deve coinvolgere

  La visita di un sito deve rappresentare per l’utente
   un’esperienza gratificante, capace di coinvolgerlo
   anche dal punto di vista ludico.




                    arturo.dicorinto@uniroma1.it
Look’n Feel

 Oltre a facilitare il raggiungimento dei suoi obiettivi è
  quindi anche necessario porre attenzione alla
  dimensione del look & feel, del tipo di esperienza
  percettivo-emotiva.




                   arturo.dicorinto@uniroma1.it
Informazioni Multimediali

 L’utente deve percepire la sua fruizione del sito come
  un viaggio all’interno di un mondo. Da questo punto
  di vista diventa importante l’attento utilizzo di vari
  media (musica, parlato, video).




                   arturo.dicorinto@uniroma1.it
Guidelines
Esempi
   ISFOL www.isfol.it
   RUR www.rur.it
   FSI www.palazzochigi.it/fsi
   Cittadigitali www.cittadigitali.it




                 arturo.dicorinto@uniroma1.it
Front Office

Un sito web puo’ funzionare come front
 office. In questo caso e’ importante
 fornire al visitatore alcune indicazioni
 supplementari.




               arturo.dicorinto@uniroma1.it
Servizi per tutti...

Multilinguismo
Mappa testuale
Motore di ricerca
Info off-line
Help on line ed help desk



               arturo.dicorinto@uniroma1.it
E-mail e snail mail

email per contattare i curatori/responsabili
 del sito
indicare i recapiti dei responsabili dei
 serivizi offerti (e-mail, tel. Fax)
indicare fonti informative alternative
 (televideo, uffici, pubblicazioni)



                arturo.dicorinto@uniroma1.it
Quando e come

Indicare la timeline dei servizi
Indicare le modalita’ di accesso ai servizi
 in modo chiaro
Chiarire eventuali restrizioni di accesso
Fornire la data degli aggiornamenti delle
 informazioni relative ai servizi


                arturo.dicorinto@uniroma1.it
Conclusione

vantaggi per l’utenza?




               arturo.dicorinto@uniroma1.it
W3C Guidelines

Fornire alternative equivalenti al
 contenuto visivo e uditivo
Non affidarsi solo al colore. Assicurarsi
 che testo e grafica siano comprensibili
 anche in assenza di colore
Usare markup e stylesheet in modo
 conforme

                arturo.dicorinto@uniroma1.it
W3C Guidelines

Chiarire l’uso del linguaggio naturale.
 Usare markup di facile pronuncia e
 interpretazione
Creare tabelle adattabili. Usare markup
 adeguate a browser differenti
Rendere le pagine accessibile con low-
 technologies

               arturo.dicorinto@uniroma1.it
W3C Guidelines

Rendere possibile il controllo sugli oggetti.
 Assicurarsi che gli oggetti o le pagine
 animate possano essere disattivate o
 bloccate.
Rendere possibile l’accesso diretto alle
 interfacce utente. Accessibilita’
 indipendente dal mezzo sw e hw usato.


                arturo.dicorinto@uniroma1.it
W3C Guidelines

Progettare indipendentemente dal mezzo.
 Rendere possibile l’accesso
 indipendentemente dai mezzi di input.
Usare soluzioni ad interim per affinche’
 possano essere usate vecchie tecnologie
Fornire informazioni per l’orientamento e
 il contesto.

               arturo.dicorinto@uniroma1.it
W3C Guidelines

Fornire meccanismi chiari per la
 navigazione e facilitare la ricerca di
 informazioni nel sito
Rendere i documenti chiari e semplici.




               arturo.dicorinto@uniroma1.it
Riferimenti ipertestuali:

     • useit.com: usable information technology
       www.useit.com
     • Informazione accessibile in rete
       http://www.infoaccessibile.com/
     • Portale sull'accessibilità delle risorse di
       rete www.ecn.org/xs2web
     • Accessibilita’ dei siti web
       http://www.ifac.cnr.it/smid/accesso/accesso.
       htm
     • Designing a more usable World - For
       ALL www.trace.wisc.edu
                arturo.dicorinto@uniroma1.it
Riferimenti Bibliografici


   - F. Carlini, Lo stile del Web, Einaudi Ed., 1999
   - P. Russo, G. Sissa Il Governo Elettronico, Apogeo
     Ed., 2000
   - M.Visciola, Usabilità dei siti web, Apogeo Ed., 2000
   - K. Goto, E. Cotler, Web Re-Design, Apogeo Ed.,
     2003




                  arturo.dicorinto@uniroma1.it

				
DOCUMENT INFO
Shared By:
Categories:
Tags:
Stats:
views:3
posted:8/21/2011
language:Italian
pages:72