SlideShare a Scribd company logo
1 of 34
Web usability II Andrea Crevola [email_address] http://webdesign.3juice.com
Come ottenere l’usabilità? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Linee guida ,[object Object],[object Object],[object Object],[object Object]
Linee guida: utilità ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Linee guida per l’usabilità dei siti web ,[object Object],[object Object],[object Object]
1. Visibilità dello stato del sistema ,[object Object],[object Object],[object Object],[object Object],[object Object]
2. Associazione tra sistema e mondo reale   ,[object Object],[object Object],[object Object],[object Object]
3. Controllo e libertà dell’utente ,[object Object],[object Object],[object Object],[object Object],[object Object]
4. Coerenza e standard ,[object Object],[object Object],[object Object],[object Object]
5. Gestione degli errori ,[object Object],[object Object],[object Object]
6. Riconoscimento piuttosto che memorizzazione ,[object Object],[object Object],[object Object],[object Object],[object Object]
Affordance ,[object Object],[object Object],[object Object],[object Object],[object Object]
Mapping ,[object Object],[object Object],[object Object],[object Object],[object Object],??? !
7. Flessibilità ed efficacia d’impiego ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
8. Minimalismo   ,[object Object],[object Object],[object Object]
9. Aiuto nel riconoscimento, diagnosi e soluzione degli errori   ,[object Object],[object Object],[object Object],[object Object],[object Object]
10. Aiuto e documentazione   ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Design patterns ,[object Object],[object Object],[object Object],[object Object],[object Object]
Caratteristiche dei design pattern ,[object Object],[object Object],[object Object]
Esempi di pattern ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Piramide ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],index (1) (2) (3)
Mappa di una sequenza ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Pagina 1 Pagina 2 Pagina 3 Pagina 4 Pagina 3 Indirizzo: Città:
Briciole di pane  ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Birmano Home  >  Mammiferi  >  Felini  >  Gatti  >  Birmano Indique apellae tertium canestrae  illustrum indicatio und frementisque Allorquandunquem gurdam horati est  Tenacis multique cum julius.
Griglia costante  ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Spazio principale ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Allineamento destra/sinistra ,[object Object],[object Object],[object Object],[object Object],[object Object],Nome Cognome Indirizzo Telefono Nome Cognome Indirizzo Telefono
Connotazione cromatica ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Valori predefiniti ottimali ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Errori nella stessa pagina ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Scudo di protezione ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Esercizio: progettare i wireframes delle pagine ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
ENG | ESP | ITA Email – credits - copyright ricerca Home page | Contatti | Mappa del sito  Titolo pagina Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque ornare augue nec odio. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras enim. Sed aliquet rhoncus urna. Nunc varius lacinia odio. Pellentesque consequat luctus nisi.  Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque ornare augue nec odio. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.  (Link a contenuti correlati) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Banner Questionario Utilizzare immagini di sfondo collegate all’idea di… Il logo è un collegamento all’home page Titolo del sito Utilizzare immagini di bandiere? Il menu si deve aprire fino al terzo livello ,[object Object],[object Object],[object Object],[object Object],Icona per accedere alla versione stampabile [ archivio ] Eventi [ archivio ] News
Siti web di riferimento ,[object Object],[object Object],[object Object],[object Object]
Bibliografia di base ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

More Related Content

What's hot

Screen Reader e web 2.0: binomio possibile?
Screen Reader e web 2.0: binomio possibile?Screen Reader e web 2.0: binomio possibile?
Screen Reader e web 2.0: binomio possibile?Alessio Mantegna
 
Usabilità e accessibilità
Usabilità  e accessibilitàUsabilità  e accessibilità
Usabilità e accessibilitàCinzia Savonitti
 
Web usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesignerWeb usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesignerMatteo Magni
 
Sviluppo Di Un Sito Web
Sviluppo Di Un Sito WebSviluppo Di Un Sito Web
Sviluppo Di Un Sito Webcarlol
 
Web Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesignerWeb Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesignerMatteo Magni
 
Elementi di Architettura dell'Informazione, Usabilità e Scrittura per il Web
Elementi di Architettura dell'Informazione, Usabilità e Scrittura per il WebElementi di Architettura dell'Informazione, Usabilità e Scrittura per il Web
Elementi di Architettura dell'Informazione, Usabilità e Scrittura per il WebAlberto Rota
 

What's hot (7)

Screen Reader e web 2.0: binomio possibile?
Screen Reader e web 2.0: binomio possibile?Screen Reader e web 2.0: binomio possibile?
Screen Reader e web 2.0: binomio possibile?
 
Gal.Internet
Gal.InternetGal.Internet
Gal.Internet
 
Usabilità e accessibilità
Usabilità  e accessibilitàUsabilità  e accessibilità
Usabilità e accessibilità
 
Web usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesignerWeb usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesigner
 
Sviluppo Di Un Sito Web
Sviluppo Di Un Sito WebSviluppo Di Un Sito Web
Sviluppo Di Un Sito Web
 
Web Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesignerWeb Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesigner
 
Elementi di Architettura dell'Informazione, Usabilità e Scrittura per il Web
Elementi di Architettura dell'Informazione, Usabilità e Scrittura per il WebElementi di Architettura dell'Informazione, Usabilità e Scrittura per il Web
Elementi di Architettura dell'Informazione, Usabilità e Scrittura per il Web
 

Viewers also liked

Sito Web Aziendale - 5 passi per il successo
Sito Web Aziendale - 5 passi per il successoSito Web Aziendale - 5 passi per il successo
Sito Web Aziendale - 5 passi per il successoStudio Aqua
 
Come si calcolano i costi per la creazione di un sito internet
Come si calcolano i costi per la creazione di un sito internetCome si calcolano i costi per la creazione di un sito internet
Come si calcolano i costi per la creazione di un sito internetseopuglia
 
4 Step per analizzare un sito web
4 Step per analizzare un sito web4 Step per analizzare un sito web
4 Step per analizzare un sito webAlessandro Mazzù
 
Modello "Preventivo web design - scheda preliminare"
Modello "Preventivo web design - scheda preliminare"Modello "Preventivo web design - scheda preliminare"
Modello "Preventivo web design - scheda preliminare"Artlandis' Webinar & Workshop
 
10 regole per fare un preventivo
10 regole per fare un preventivo10 regole per fare un preventivo
10 regole per fare un preventivoPietro Mantovani
 

Viewers also liked (8)

Sito Web Aziendale - 5 passi per il successo
Sito Web Aziendale - 5 passi per il successoSito Web Aziendale - 5 passi per il successo
Sito Web Aziendale - 5 passi per il successo
 
Betanzos-Budapest
Betanzos-BudapestBetanzos-Budapest
Betanzos-Budapest
 
Lezione 06/2006
Lezione 06/2006Lezione 06/2006
Lezione 06/2006
 
8. Architetture web
8. Architetture web8. Architetture web
8. Architetture web
 
Come si calcolano i costi per la creazione di un sito internet
Come si calcolano i costi per la creazione di un sito internetCome si calcolano i costi per la creazione di un sito internet
Come si calcolano i costi per la creazione di un sito internet
 
4 Step per analizzare un sito web
4 Step per analizzare un sito web4 Step per analizzare un sito web
4 Step per analizzare un sito web
 
Modello "Preventivo web design - scheda preliminare"
Modello "Preventivo web design - scheda preliminare"Modello "Preventivo web design - scheda preliminare"
Modello "Preventivo web design - scheda preliminare"
 
10 regole per fare un preventivo
10 regole per fare un preventivo10 regole per fare un preventivo
10 regole per fare un preventivo
 

Similar to Lezione 05/2006

Studio sull'ergonomia del touchscreen dell' iphone
Studio sull'ergonomia del touchscreen dell' iphoneStudio sull'ergonomia del touchscreen dell' iphone
Studio sull'ergonomia del touchscreen dell' iphoneRiccardo Venturato
 
Ricaricare un abbonamento; studio sull'usabilità delle biglietterie elettroni...
Ricaricare un abbonamento; studio sull'usabilità delle biglietterie elettroni...Ricaricare un abbonamento; studio sull'usabilità delle biglietterie elettroni...
Ricaricare un abbonamento; studio sull'usabilità delle biglietterie elettroni...Irene Raineri
 
Progetto di Ergonomia Cognitiva: Decathlon +Plus
Progetto di Ergonomia Cognitiva: Decathlon +PlusProgetto di Ergonomia Cognitiva: Decathlon +Plus
Progetto di Ergonomia Cognitiva: Decathlon +PlusJessica Forlani
 
Relazione finale progetto Pedalami
Relazione finale progetto PedalamiRelazione finale progetto Pedalami
Relazione finale progetto PedalamiMelaniaMauri
 
Users on social networks: Cinque scoperte fatte durante le attività user cent...
Users on social networks: Cinque scoperte fatte durante le attività user cent...Users on social networks: Cinque scoperte fatte durante le attività user cent...
Users on social networks: Cinque scoperte fatte durante le attività user cent...Luca Mascaro
 
Mobile Web Best Practice
Mobile Web Best PracticeMobile Web Best Practice
Mobile Web Best PracticeMauro Binaghi
 
Valutazione TELCO - Workshop Alturalabs
Valutazione TELCO - Workshop AlturalabsValutazione TELCO - Workshop Alturalabs
Valutazione TELCO - Workshop AlturalabsMarco Camilli
 
Criterivalutazione2012bis
Criterivalutazione2012bisCriterivalutazione2012bis
Criterivalutazione2012bisLucia Bertini
 
Agile User story mapping (Mokabyte)
Agile User story mapping (Mokabyte)Agile User story mapping (Mokabyte)
Agile User story mapping (Mokabyte)Emiliano Soldi
 
Model view controller: un pattern per l’interaction design
Model view controller: un pattern per l’interaction designModel view controller: un pattern per l’interaction design
Model view controller: un pattern per l’interaction designStefano Bussolon
 
Accessibilità dei Contenuti per il Web secondo il W3C: Introduzione alle WCAG...
Accessibilità dei Contenuti per il Web secondo il W3C: Introduzione alle WCAG...Accessibilità dei Contenuti per il Web secondo il W3C: Introduzione alle WCAG...
Accessibilità dei Contenuti per il Web secondo il W3C: Introduzione alle WCAG...Simone Onofri
 
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utentemetodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utenteandrea.giro
 
Lezione5 Usability-confartigianato
Lezione5 Usability-confartigianatoLezione5 Usability-confartigianato
Lezione5 Usability-confartigianatoAndrea Vaccarella
 
IWA ForumPA 2008
IWA ForumPA 2008IWA ForumPA 2008
IWA ForumPA 2008alscar
 
WordPress Meetup Torino Giugno 2015
WordPress Meetup Torino Giugno 2015WordPress Meetup Torino Giugno 2015
WordPress Meetup Torino Giugno 2015Maurizio Pelizzone
 
Accessibilità - Adriano Cerocchi - SEO Training 2011
Accessibilità - Adriano Cerocchi - SEO Training 2011Accessibilità - Adriano Cerocchi - SEO Training 2011
Accessibilità - Adriano Cerocchi - SEO Training 2011SEO Training
 

Similar to Lezione 05/2006 (20)

Studio sull'ergonomia del touchscreen dell' iphone
Studio sull'ergonomia del touchscreen dell' iphoneStudio sull'ergonomia del touchscreen dell' iphone
Studio sull'ergonomia del touchscreen dell' iphone
 
Ricaricare un abbonamento; studio sull'usabilità delle biglietterie elettroni...
Ricaricare un abbonamento; studio sull'usabilità delle biglietterie elettroni...Ricaricare un abbonamento; studio sull'usabilità delle biglietterie elettroni...
Ricaricare un abbonamento; studio sull'usabilità delle biglietterie elettroni...
 
Progetto di Ergonomia Cognitiva: Decathlon +Plus
Progetto di Ergonomia Cognitiva: Decathlon +PlusProgetto di Ergonomia Cognitiva: Decathlon +Plus
Progetto di Ergonomia Cognitiva: Decathlon +Plus
 
Relazione finale progetto Pedalami
Relazione finale progetto PedalamiRelazione finale progetto Pedalami
Relazione finale progetto Pedalami
 
Users on social networks: Cinque scoperte fatte durante le attività user cent...
Users on social networks: Cinque scoperte fatte durante le attività user cent...Users on social networks: Cinque scoperte fatte durante le attività user cent...
Users on social networks: Cinque scoperte fatte durante le attività user cent...
 
Waz.Up Presentazione
Waz.Up PresentazioneWaz.Up Presentazione
Waz.Up Presentazione
 
Mobile Web Best Practice
Mobile Web Best PracticeMobile Web Best Practice
Mobile Web Best Practice
 
Ux research olistica
Ux research olisticaUx research olistica
Ux research olistica
 
Valutazione TELCO - Workshop Alturalabs
Valutazione TELCO - Workshop AlturalabsValutazione TELCO - Workshop Alturalabs
Valutazione TELCO - Workshop Alturalabs
 
Web Usability
Web UsabilityWeb Usability
Web Usability
 
Criterivalutazione2012bis
Criterivalutazione2012bisCriterivalutazione2012bis
Criterivalutazione2012bis
 
Agile User story mapping (Mokabyte)
Agile User story mapping (Mokabyte)Agile User story mapping (Mokabyte)
Agile User story mapping (Mokabyte)
 
Model view controller: un pattern per l’interaction design
Model view controller: un pattern per l’interaction designModel view controller: un pattern per l’interaction design
Model view controller: un pattern per l’interaction design
 
Accessibilità dei Contenuti per il Web secondo il W3C: Introduzione alle WCAG...
Accessibilità dei Contenuti per il Web secondo il W3C: Introduzione alle WCAG...Accessibilità dei Contenuti per il Web secondo il W3C: Introduzione alle WCAG...
Accessibilità dei Contenuti per il Web secondo il W3C: Introduzione alle WCAG...
 
Lezione 2
Lezione 2Lezione 2
Lezione 2
 
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utentemetodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
 
Lezione5 Usability-confartigianato
Lezione5 Usability-confartigianatoLezione5 Usability-confartigianato
Lezione5 Usability-confartigianato
 
IWA ForumPA 2008
IWA ForumPA 2008IWA ForumPA 2008
IWA ForumPA 2008
 
WordPress Meetup Torino Giugno 2015
WordPress Meetup Torino Giugno 2015WordPress Meetup Torino Giugno 2015
WordPress Meetup Torino Giugno 2015
 
Accessibilità - Adriano Cerocchi - SEO Training 2011
Accessibilità - Adriano Cerocchi - SEO Training 2011Accessibilità - Adriano Cerocchi - SEO Training 2011
Accessibilità - Adriano Cerocchi - SEO Training 2011
 

Lezione 05/2006

  • 1. Web usability II Andrea Crevola [email_address] http://webdesign.3juice.com
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.