web usability - 2 | webmaster & webdesigner

of 29/29
Web Usability [2] Matteo Magni

Post on 11-Nov-2014

304 views

Category:

Technology

1 download

Embed Size (px)

DESCRIPTION

Seconda lezione modulo Web Usability del corso per WebMaster & WebDesigner

TRANSCRIPT

  • 1. Web Usability [2]Matteo Magni
  • 2. Jakob Nielsenhttp://it.wikipedia.org/wiki/Jakob_NielsenE considerato il gurudellusabilit. unoscrittore, oratore econsulente. Ha undottorato in designdellinterfaccia utente einformatica delPolitecnico Danese. (wikipedia) http://www.useit.com/jakob/
  • 3. Norman e Nielsen Norman uno psicologo mentre Nielsen un ingegnere. Il secondo ha un approccio che predilige le funzionalit al design. Per lui lusabilit praticit e semplicit, quindi ogni volta che qualcuno non trova una informazione o non riesce a concludere un compito si sta scontrando con problemi di usabilit.
  • 4. Un sito Web usabile quando soddisfa i bisogni informativi dellutente finale che lo sta visitando e interrogando, fornendogli facilit di accesso e navigabilit e consentendo un adeguato livello di comprensione dei contenuti. Nel caso non sia disponibile tutta linformazione, un buon sito demanda ad altre fonti informative. (Michele Visciola).
  • 5. 10 regole di Nielsen Dalle sue ricerche Nielsen fa emergere 10 principi per puntare ad una buona usabilit.
  • 6. 1 - Visibility of system statusThe system should always keep usersinformed about what is going on, throughappropriate feedback within reasonabletime.
  • 7. 2 - Match between system and the real worldThe system should speak the userslanguage, with words, phrases andconcepts familiar to the user, rather thansystem-oriented terms. Follow real-worldconventions, making information appear ina natural and logical order.
  • 8. 3 - User control and freedomUsers often choose system functions bymistake and will need a clearly marked"emergency exit" to leave the unwantedstate without having to go through anextended dialogue. Support undo andredo.
  • 9. 4 - Consistency and standardsUsers should not have to wonder whetherdifferent words, situations, or actionsmean the same thing. Follow platformconventions.
  • 10. 5 - Error preventionEven better than good error messages is acareful design which prevents a problemfrom occurring in the first place. Eithereliminate error-prone conditions or checkfor them and present users with aconfirmation option before they commit tothe action.
  • 11. 6 - Recognition rather than recallMinimize the users memory load bymaking objects, actions, and optionsvisible. The user should not have toremember information from one part of thedialogue to another. Instructions for use ofthe system should be visible or easilyretrievable whenever appropriate.
  • 12. 7 - Flexibility and efficiency of useAccelerators -- unseen by the novice user-- may often speed up the interaction forthe expert user such that the system cancater to both inexperienced andexperienced users. Allow users to tailorfrequent actions.
  • 13. 8 - Aesthetic and minimalist designDialogues should not contain informationwhich is irrelevant or rarely needed. Everyextra unit of information in a dialoguecompetes with the relevant units ofinformation and diminishes their relativevisibility.
  • 14. 9 - Help users recognize, diagnose, and recover from errorsError messages should be expressed inplain language (no codes), preciselyindicate the problem, and constructivelysuggest a solution.
  • 15. 10 - Help and documentation Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the users task, list concrete steps to be carried out, and not be too large.
  • 16. Quindi?Possiamo forse raggruppare tutto in trearee: Orientamento e Navigazione Prevenzione e gestione di errori Coerenza interna, aderenza agli standard e ai vincoli del web http://www.usabile.it/082001.htm
  • 17. Orientamento e NavigazioneRendere cio disponibili e comprensibili tutti quegli strumenti che consentonoallutente di capire immediatamente dove si trova, da dove venuto e dove puandare allinterno del sito web.E necessario presentare in maniera chiara e con nomi comprensibili le sezionidel sito, lindicazione del percorso delle pagine interne, usando nomi significativied evitando di usare metafore poco chiare per lutente. Bisognerebbe inoltrestrutturare linformazione seguendo il tipo di conoscenza dellutente, pi che ilproprio, e assegnare la massima libert di esplorazione e movimento allutente,con chiare indicazioni di come tornare indietro e alla pagina principale. http://www.usabile.it/082001.htm
  • 18. Prevenzione e Gestione di errorisenza allarmismi e con linguaggio comune. Gli errori dovrebbero prima di tuttoessere prevenuti, ci dice Nielsen, ma se ci non fosse possibile, sarebbe necessariooffrire allutente la possibilit di tornare sempre indietro, e dovremmo semprespiegare cosa sta succedendo, con un linguaggio semplice e chiaro, evitando imessaggi tecnici del server. Ci diventa particolarmente cruciale in caso di linkmancanti, di inserimento di dati nei form, di procedure dacquisto e di registrazione aservizi online, e coinvolge in prima istanza lo staff tecnico che si occupa del sito, maanche il progettista: le gestioni degli errori vanno comunicate con un linguaggio il pipossibile vicino allutente finale. http://www.usabile.it/082001.htm
  • 19. Coerenza interna, aderenza agli standard e ai vincoli del webIl che significa soprattutto definire uno stile omogenero per lintero sito, non disorientare il lettore concambi di carattere tipografico, dimensioni, colori e layout senza un motivo che sia prima di tuttosemantico. Come ribadisce anche Sofia Postai nel suo libro, i cambiamenti di forma dovrebberosempre corrispondere a cambiamenti logici, di contenuto.Per quanto riguarda laderenza agli standard, io non mi soffermerei troppo sul colore del link, quantosul fatto che effettivamente si capisca che quello un link e una barra dei menu.I vincoli sono soprattutto quelli legati alla dimensione e al formato della grafica e delle pagine html,della loro compatibilit allindietro e dalla possibilit di essere fruite senza grossi problemi dal maggiornumero possibile di dispositivi. http://www.usabile.it/082001.htm
  • 20. Test Usabilit Testare il proprio sito con utenti reali serve a valutare lusabilit di un sito internet in collaborazione con chi sta eseguendo il test
  • 21. Protagonisti Utenti Esperti di usabilit Progettisti/sviluppa tori
  • 22. Obiettivi Valutazione generale dellapplicazione Valutazione di elementi specifici: Men, carrello, ecc..
  • 23. Metodo [1]Basato sul compito: Esempio: Si danno allutente dei Ricercare un compiti specifici per contenuto valutare il suo grado di soddisfazione/frustrazio Eseguire un acquisto ne nelleseguirli. Registrarsi al sito Inviare una mail di contatto ecc...
  • 24. Metodo [2]Basato sullo scenario: Permette di capire Si stabiliscono degli scenari duso per vedere lo se ci sono scostamento tra il layout eventuali carenze proposto dal sito e il modello dellutente (la sequenza con informative nel cui lutente consegue modello del layout lobiettivo nel minor tempo e proposto. costo possibile).
  • 25. Il test Durante lo svolgimento dei compiti lutilizzatore deve cercare di esprimere i suoi pensieri ad alta voce
  • 26. Il test [2] Losservatore si occuper si segnare come evolve la situazione dellutente nello svolgimento dei vari compiti .
  • 27. Analisi dei dati I riscontri ottenuti dal test vanno riportati e studiati per poi tradurli in modifiche per lapplicazione web.
  • 28. Facciamo dei Test? sosacroniro.it sosacroniro.com ....
  • 29. Domande Slide:http://www.slideshare.net/ilbonzo Code:https://github.com/ilbonzo/Cypher mail: [email protected]