Web usability - 2 | WebMaster & WebDesigner
0 likes•325 views
Jakob Nielsen, esperto di usabilità, propone 10 principi chiave per migliorare l'usabilità dei siti web, focalizzandosi su orientamento, navigazione e prevenzione degli errori. Questi principi includono la chiarezza nella comunicazione, la consistenza del design e l'accessibilità delle informazioni. È fondamentale testare i siti con utenti reali per valutare e migliorare l'esperienza utente.
![Web Usability [2]
Matteo Magni](https://image.slidesharecdn.com/02webusability-120926135833-phpapp01/85/Web-usability-2-WebMaster-WebDesigner-1-320.jpg)
![Metodo [1]
Basato sul compito: Esempio:
• Si danno all'utente dei • Ricercare un
compiti specifici per contenuto
valutare il suo grado di
soddisfazione/frustrazio • Eseguire un acquisto
ne nell'eseguirli. • Registrarsi al sito
• Inviare una mail di
contatto
• ecc...](https://image.slidesharecdn.com/02webusability-120926135833-phpapp01/85/Web-usability-2-WebMaster-WebDesigner-23-320.jpg)
![Metodo [2]
Basato sullo scenario: • Permette di capire
• Si stabiliscono degli scenari
d'uso per vedere lo se ci sono
scostamento tra il layout eventuali carenze
proposto dal sito e il modello
dell'utente (la sequenza con
informative nel
cui l'utente consegue modello del layout
l'obiettivo nel minor tempo e proposto.
costo possibile).](https://image.slidesharecdn.com/02webusability-120926135833-phpapp01/85/Web-usability-2-WebMaster-WebDesigner-24-320.jpg)
![Il test [2]
• L'osservatore si
occuperà si
segnare come
evolve la situazione
dell'utente nello
svolgimento dei
vari compiti
.](https://image.slidesharecdn.com/02webusability-120926135833-phpapp01/85/Web-usability-2-WebMaster-WebDesigner-26-320.jpg)
Web usability - 2 | WebMaster & WebDesigner
- 1. Web Usability [2] Matteo Magni
- 2. Jakob Nielsen http://it.wikipedia.org/wiki/Jakob_Nielsen E' considerato il guru dell'usabilità. È uno scrittore, oratore e consulente. Ha un dottorato in design dell'interfaccia utente e informatica del Politecnico 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 l'usabilità è 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 dell'utente 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 l'informazione, 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 status The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.
- 7. 2 - Match between system and the real world The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
- 8. 3 - User control and freedom Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.
- 9. 4 - Consistency and standards Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.
- 10. 5 - Error prevention Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.
- 11. 6 - Recognition rather than recall Minimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.
- 12. 7 - Flexibility and efficiency of use Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.
- 13. 8 - Aesthetic and minimalist design Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.
- 14. 9 - Help users recognize, diagnose, and recover from errors Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest 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 user's task, list concrete steps to be carried out, and not be too large.
- 16. Quindi? Possiamo forse raggruppare tutto in tre aree: • 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 Navigazione Rendere cioè disponibili e comprensibili tutti quegli strumenti che consentono all'utente di capire immediatamente dove si trova, da dove è venuto e dove può andare all'interno del sito web. E' necessario presentare in maniera chiara e con nomi comprensibili le sezioni del sito, l'indicazione del percorso delle pagine interne, usando nomi significativi ed evitando di usare metafore poco chiare per l'utente. Bisognerebbe inoltre strutturare l'informazione seguendo il tipo di conoscenza dell'utente, più che il proprio, e assegnare la massima libertà di esplorazione e movimento all'utente, con chiare indicazioni di come tornare indietro e alla pagina principale. http://www.usabile.it/082001.htm
- 18. Prevenzione e Gestione di errori senza allarmismi e con linguaggio comune. Gli errori dovrebbero prima di tutto essere prevenuti, ci dice Nielsen, ma se ciò non fosse possibile, sarebbe necessario offrire all'utente la possibilità di tornare sempre indietro, e dovremmo sempre spiegare cosa sta succedendo, con un linguaggio semplice e chiaro, evitando i messaggi tecnici del server. Ciò diventa particolarmente cruciale in caso di link mancanti, di inserimento di dati nei form, di procedure d'acquisto e di registrazione a servizi online, e coinvolge in prima istanza lo staff tecnico che si occupa del sito, ma anche il progettista: le gestioni degli errori vanno comunicate con un linguaggio il più possibile vicino all'utente finale. http://www.usabile.it/082001.htm
- 19. Coerenza interna, aderenza agli standard e ai vincoli del web Il che significa soprattutto definire uno stile omogenero per l'intero sito, non disorientare il lettore con cambi di carattere tipografico, dimensioni, colori e layout senza un motivo che sia prima di tutto semantico. Come ribadisce anche Sofia Postai nel suo libro, i cambiamenti di forma dovrebbero sempre corrispondere a cambiamenti logici, di contenuto. Per quanto riguarda l'aderenza agli standard, io non mi soffermerei troppo sul colore del link, quanto sul 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à all'indietro e dalla possibilità di essere fruite senza grossi problemi dal maggior numero possibile di dispositivi. http://www.usabile.it/082001.htm
- 20. Test Usabilità • Testare il proprio sito con utenti reali serve a valutare l'usabilità 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 dell'applicazione • Valutazione di elementi specifici: Menù, carrello, ecc..
- 23. Metodo [1] Basato sul compito: Esempio: • Si danno all'utente dei • Ricercare un compiti specifici per contenuto valutare il suo grado di soddisfazione/frustrazio • Eseguire un acquisto ne nell'eseguirli. • Registrarsi al sito • Inviare una mail di contatto • ecc...
- 24. Metodo [2] Basato sullo scenario: • Permette di capire • Si stabiliscono degli scenari d'uso per vedere lo se ci sono scostamento tra il layout eventuali carenze proposto dal sito e il modello dell'utente (la sequenza con informative nel cui l'utente consegue modello del layout l'obiettivo nel minor tempo e proposto. costo possibile).
- 25. Il test • Durante lo svolgimento dei compiti l'utilizzatore deve cercare di esprimere i suoi pensieri ad alta voce
- 26. Il test [2] • L'osservatore si occuperà si segnare come evolve la situazione dell'utente nello svolgimento dei vari compiti .
- 27. Analisi dei dati • I riscontri ottenuti dal test vanno riportati e studiati per poi tradurli in modifiche per l'applicazione 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]