Webmakig101 ∞ Web Design e Usabilità #2

Bentornati sulle webpagine della rubrica Webmaking101.
Oggi continuiamo il discorso su Web Design e Usabilità.
Quelle che seguono sono alcune note che ho tratto dal libro Don't Make Me Think di Steve Krug.
Una lettura che consiglio a tutti quelli che si occupano di blog o siti web.

"Non farmi pensare!"
- Prima legge di Steve Krug sull'usabilità.

Una pagina web dovrebbe essere autoevidente
I link e i pulsanti non ovviamente cliccabili sono una fonte di inutile di punti interrogativi nella testa della gente. Come utente, non dovrei mai dedicare nemmeno un millisecondo a pensare cosa è cliccabile e cosa no.
Quando usiamo il web ogni punto interrogativo aumenta il carico di lavoro cognitivo.
Le distrazioni, sommate una all'altra, confondono.

I visitatori di un sito non devono perdere tempo chiedendosi:

• Dove sono?
• Da dove comincio?
• Dove hanno messo...?
• Quali sono le cose più importanti nella pagina?
• Perché l'avranno chiamato così?

Se non riuscite a rendere la pagina autoevidente, perché state facendo qualcosa di originale, innovativo o molto complicato, dovete accontentarvi dell'autoesplicativo.
L'apparenza delle cose, i nomi ben scelti, il layout della pagina e brevi righe di testo confezionate con cura contribuiscono a creare un riconoscimento istantaneo.
Se le pagine web sono efficaci devono incantare a colpo d'occhio e il miglior modo per raggiungere questo scopo è creare pagine che siano autoevidenti o almeno autoesplicative.

Se voleste capire a cosa serve Tracky, su quale link della pagina clicchereste?

Quello che fanno davvero {gli utenti} il più delle volte è dare un'occhiata alla pagina, scorrere parte del testo e cliccare sul primo link che cattura il loro interesse o che assomiglia vagamente a ciò che stanno cercando. Di solito gran parte della pagina non è nemmeno vista.

 
"Non leggiamo le pagine. Le scorriamo."

Perché:

• Di solito andiamo di fretta.
• Sappiamo di non aver bisogno di leggere tutto: del contenuto ci interessa solo una piccola frazione.
• Siamo bravi nel farlo: scorriamo giornali, riviste e libri cercando solo le parti che ci interessano.
• L'attenzione si focalizza su parole e frasi che sembrano corrispondere a a) la nostra necessità del momento, b) i nostri interessi attuali, c) le parole che innescano un cortocircuito nel nostro sistema nervoso, come "gratis".

"Se il vostro pubblico si comporta come se progettaste dei tabelloni pubblicitari, allora progettate dei tabelloni eccezionali."

Quindi:

• Create in ogni pagina una chiara gerarchia visiva.
• Scomponete le pagine in aree ben definite.
• Rendete ovvio ciò che è cliccabile.
• Minimizzate il rumore.

 

Esercizio: analizzate l'arrangiamento grafica di questa pagina web. Cosa notate?

A cosa serve una buona gerarchia visiva
Una buona gerarchia visiva ci risparmia la fatica di pre-elaborare la pagina, organizzando e stabilendo le priorità nei contenuti in modo che ci permetta di afferrarla istantaneamente.
Dividere la pagina in aree ben definite è importante perché consente agli utenti di decidere in fretta su quali aree focalizzarsi e quali ignorare. Gli utenti decidono molto velocemente quali parti della pagina sembrano avere informazioni utili; il resto è come se non ci fosse.
Minimizzate il rumore significa evitare il sovraffollamento: quando ogni cosa sulla pagina reclama la mia attenzione il risultato è quello di travolgermi. Va evitato anche il rumore di fondo: il pulviscolo di rumore visivo che logora.

La pagina di Google, minimale, semplice, immediata.

"Non importa quanti clic devo fare, se ogni clic è frutto di una scelta che non richiede impegno e non è ambigua."
- seconda legge di Krug sull'usabilità.

Sul web ci troviamo continuamente ad affrontare delle scelte, e far si che non richiedano impegno è uno dei principali obiettivi per rendere un sito facile da usare.

"Sbarazzati di metà delle parole di ogni pagina e poi sbarazzati della metà di quello che resta."
- Terza legge di Krug sull'usabilità.

Sbarazzarsi delle parole che nessuno leggerà:

• Riduce il livello di rumore nella pagina.
• Mette in evidenza il contenuto importante.
• Rende la pagina breve, permettendo agli utenti il colpo d'occhio.
• Gli scopi della navigazione:
• Ci dice cosa c'è.
• Ci dice come usare il sito.
• Ci dà fiducia nelle persone che lo hanno costruito.

Ogni pagina deve avere un nome {il titolo; quelli che vedi in alto sul browser}.
Il nome deve essere al posto giusto: evidente nella gerarchia visuale della pagina.
Il nome deve distinguersi.
Il nome deve corrispondere a ciò che ho cliccato.

"Il nome della pagina corrisponderà alle parole su cui ho cliccato per arrivarci."

Facciamo un test
Aprite una pagina web a caso e rispondete alle domande:

• Che sito è? (ID del sito)
• Su che pagina sono? (Il nome della pagina)
• Quali sono le sezioni principali del sito?
• Dove mi trovo nello schema delle cose?
• Come posso effettuare una ricerca?

Queste sono le domande che dovrete porvi durante la fase di progettazione del vostro sito web.