Quali sono gli obiettivi generali di un sito usabile?

Una pagina web usabile e leggibile è il matrimonio degli sforzi del web designer e del web content writer.

Le pagine web devono essere più facili da leggere che pagine stampate. Si può facilitare la lettura attraverso l’uso efficace di colori, caratteri, spazi ecc.

Dall’altra parte il copywriter deve fare sì che i testi si leggano velocemente e l’utente riesca subito trovare le informazioni importanti.

Non andremo a tradurre tutti i 7 i consigli di Mashable (li potete leggere direttamente sul sito loro), ma tenete in mente sempre queste tre linee guide:

• Testo e caratteri devono essere semplicemente leggibili e piacevoli da leggere.
• I contenuti devono essere semplice da capire.
• I testi dovrebbero essere “skimmable” (non so proprio come tradurre) perché utenti nella rete non leggono molto. In media solo il 28% del testo in una pagine viene veramente letto. (Vedete anche il nostro articolo Eye-tracking studies: more than meets the eye)

Quali sono i metodi per raggiungere questi obbiettivi? Andate a leggere il post su Mashable!

Photos:  Tumbleweed:-) - City Unversity Interaction Lab

Ho trovato i risultati di un’inchiesta (a mio avviso interessante) effettuata dal team di consulenza per l’ergonomia del Benchmark Group, dal titolo “Ergonomie des sites Web : le verdict des internautes“.

Ed ecco alcuni dati significativi:

• il 75% degli utenti incontrano ancora “spesso” difficoltà per trovare ciò che cercano sui siti che consultato, ed il 58% ha “spesso” problemi con la navigazione del sito stesso.
• il 66% trovano i contenuti dei siti “spesso mal presentati” e per il 47% le home page sono “spesso ben poco coinvolgenti come informazioni”.
• 7 utenti su 10 non ritornano a visitare un sito dove hanno incontrato problemi di navigazione o di orientamento.

Inoltre, uno schema che ho tradotto riassume i risultati dell’inchiesta, rispondendo alla seguente domanda:

“di solito, dopo quanto tempo decidete di abbandonare un sito che non vi soddisfa?”

A questo punto, eccovi un elenco dei principali criteri dell’ergonomia di un sito web:

• Sobrietà: cioè semplicità (un sito web epurato rafforza la credibilità) e leggerezza (le animazioni o gli effetti speciali devono essere usati solo per visualizzare messaggi forti, dato che attirano l’attenzione dell’utente).
• Leggibilità: il testo deve essere chiaro (è meno facile leggere a schermo rispetto ad un supporto cartaceo: il tempo di lettura aumenta del 25%), strutturato (testi suddivisi in paragrafi e titoli di diversi livelli) e organizzato (gli elementi di informazione più importanti devono figurare nelle parti alte delle pagine).
• Utilizzabilità: garantita dalla facilità di navigazione (ogni informazione deve essere accessibile in massimo 3 click) e dalla libertà della stessa (poter ritornare alla home page o in qualunque sezione con un semplice click grazie, ad esempio, ad una barra di navigazione, evitando poi splash screen che di solito innervosiscono e basta…). Importante è l’omogeneità della carta grafica e della struttura, e la possibilità di situarsi al suo interno senza difficoltà. L’indirizzo della pagina in corso (URL) deve essere visibile e facilmente individuabile, ed è importante garantire la tangibilità dei contenuti (grazie ad informazioni qualificate).
• Rapidità: il tempo di caricamento di una pagina deve essere il minore possibile (la maggioranza degli internauti non pazienta per più di 15 secondi) ed è quindi importante ottimizzare i materiale pubblicati, come le immagini, sia come peso che come dimensioni.
• Interattività: tra l’utente ed il sito, grazie a link ipertestuali che consentano percorsi multipli e scomposizione dell’informazione per offrire diverse opzioni di approfondimento. Importante poi è fornire strumenti di contatto (form, mail) per facilitare gli scambi, soprattutto in un’ottica evolutiva del sito.
• Adattabilità: la possibilità cioè per l’utente di personalizzare il sito web, ridimensionandone magari i caratteri dei testi (che non dovranno avere quindi dimensione assoluta) o le dimensioni del layout a schermo.
• Accessibilità: il sito deve poter essere consultato universalmente da tutti gli utenti, compresi gli ipo e non vendenti. Il rispetto degli standard, in particolare le raccomandazioni di accessibilità del W3C, permette di garantire un buon livello di interoperabilità, cioè la capacità del sito web di essere consultabile da diversi client software. Tutti i contenuti di rilievo dovranno essere consultabili anche in modalità testuale (trasparenza) e si devono prevedere testi sostitutivi per le immagini, legende che consentano ai non vedenti di capirne il senso. I colori devono essere scelti in modo da lasciare leggibile l’informazione alle persone che non li distinguono correttamente (daltonici) e il livello di contrasto tra il colore di sfondo e il testo in primo piano deve essere sufficiente per permetterne la lettura agli ipovedenti.

E… il vostro sito invece? Com’è?

Niente di nuovo da segnalare: solo la conferma della famosa regola del ‘triangolo d’oro’ formato dal logo, i primi risultati ed i links sponsorizzati:

Vi troviamo anche un piccolo video, abbastanza d’effetto ma di ben limitato interesse:

Più interessante invece lo studio pubblicato da una società francese specializzata nell’oculometria: Miratech, con il suo La lecture d’une page de résultats Google.

Troviamo infatti importanti informazioni aggiuntive, come scoprire che, se il ‘triangolo d’oro’ è certo una realtà, questa si iscrive in una dimensione temporale di una sua certa importanza: i links sponsorizzati sono infatti letti solo 4 secondi dopo i risultati centrali, e rappresentano solo un minima parte dell’attenzione rivolta alla pagina:

Altro interessante insegnamento: non esiste uno schema di lettura-tipo che faccia l’unanimità nell’utenza (come il famoso schema di lettura a F):

Morale della favola: per quanto i risultati di uno studio di eye-tracking siano davvero spettacolari e talvolta, anche un po’ scontati, la loro interpretazione richiede una certa dose di esperienza e… anche un certo intuito.

Meditate signori… meditate…

Il marchio della mela ha infatti depositato un brevetto nel dicembre 2008: il Multidimensional Desktop, che ambisce ad introdurre una terza dimensione, dando così profondità alla scrivania.

Ecco che così i lati e la base dello schermo vengono utilizzati per deporvi degli oggetti:

Ancor più sorprendente, i pannelli laterali sono in un loop: se si fa scivolare una finestra verso destra, questa riappare a sinistra, come se fosse passata dietro di voi:

Inoltre, i pannelli laterali potranno accogliere le icone e i comandi delle applicazioni (rispettivamente a sinistra e a destra):

Tutto questo non sarà certo pronto per la prossima versione di Mac OS (Snow Leopard), ma ci chiarisce la roadmap evolutiva di Mac OS: un sistema operativo sempre più efficace (totale abbandono della compatibilità con le vecchie architetture) e carte grafiche sempre più potenti.

(via MacGeneration)

Vi propongo di soffermavi su un concetto: la simplexity. Un neologismo nel quale in inglese le due parole che lo compongono sono evidenti: si ha tutto ‘simple’ e più della metà di ‘complexity’. In italiano potrebbe essere ‘semplicomplessità’, ma non trovo il termine altrettanto efficace, forse per la lunghezza.
Comunque: simplexity, contrazione di semplicità e complessità, è l’arte che consiste non nel semplificare un prodotto complesso, ma piuttosto nel rendere a priori semplice quel prodotto che non può essere semplificato, pena la sua perdita di efficacia.
Questa nozione si applica in molteplici e svariati campi, ed esistono casi significativi nell’ambito industriale (Renault e la ricerca della leggibilità dei cruscotti), del design (di B&O o Apple) o dell’arte (Constantin Brâncuşi).

In poche parole, la simplexity opera nel senso di un’apparente volgarizzazione del mondo per renderlo alla portata di chiuque.

Adesso, applichiamo questo concetto al web e diamone una possibile definizione: l’interfaccia di un sito è l’apparente semplicità grazie alla quale si fruisce di un servizio complesso.

E quale sarà la logica conseguenza dell’applicazione di questo principio? L’estrema usabilità che caratterizza naturalmente il progetto costruito, dove ci sia posti dal punto di vista dell’utilizzatore finale.

Prendiamo ad esempio Gmail, il webmail di Google, che si propone come modello per un’utilizzo della posta elettronica più intuitivo, efficace, utile ed anche divertente (’un nuovo modo di concepire la posta’, come affermano).

Guardate: questa è la versione iniziale per la redazione di un nuovo messaggio, che appare all’apertura della pagina.

Questa è invece la versione completa, una volta che tutte le opzioni sono state aperte.

L’impressione di semplicità all’apertura della pagina è reale ma, se clicco sui vai link, mi rendo conto che, oltre la schermata iniziale, tutto le opzioni sono comunque presenti.

Ecco qua: apparente semplicità per un servizio dalla complessità indotta.

Usabile.

Sappiamo che l’utente internet non legge molto. Il text-scanning è un comportamento molto comune per gli utenti più istruiti; gli ultimi eyetracking studies di Jakob Nielsen confermano ulteriormente questa scoperta.

L’unica cosa che mancava era una formula matematica per quantificare esattamente quanto la gente legge online. Adesso, grazie a nuovi dati e Jakob Nielsen, c’è anche questa.

La Studie di ricerca

Per i dettagli completi consultate il seguente documento:
Harald Weinreich, Hartmut Obendorf, Eelco Herder, and Matthias Mayer: “Not Quite the Average: An Empirical Study of Web Use,” in the ACM Transactions on the Web, vol. 2, no. 1 (February 2008), article #5.

In questa studie, gli autori hanno attrezzato 25 browsers e registrato informazioni su tutto quello che gli utenti facevano durante le loro sedute web quotidiane. La cosa importante è, che gli utenti non dovevano fare niente di speciale – era tutto completamente naturale.

Una problematica della studie era il fatto che gli utenti avevano un’intelligenza oltre alla media. Alcuni di loro erano dipendenti dell’università. Ma comunque – a lungo termine – questo non dovrebbe comportare problemi. Se per esempio si confronta i dati del 2008, collezionati per il seminario Fundamental Guidelines for Web Usability con quelli di una studie simile del 2004, si scopre che il comportamento medio del 2008 è vicino a quello degli utenti più avanzati del 2004. Per questo – anche se Weinreich e i suoi colleghi hanno usato utenti high-end, il loro comportamento può essere interpretato come il comportamento dell’utente medio del prossimo futuro. Effettivamente gli autori hanno collezionato questi dati in 2005, quindi oggi sono già rappresentativi per l’utente medio.

In ogni caso, la ricerca ha portato risultati interessantissimi e il documento si merita di essere letto interamente.

Tra tante altre cose, gli autori hanno scoperto che il Back button (bottone indietro) ora è solo il terzo più importante feature nel web. Il click su hyperlinks rimane il feature più usato, ma cliccando bottoni (sulla pagina) ora ha superato il Back button ed è diventato il secondo feature più importante. Il motivo per questo sta nella prevalenza degli applicazioni e di siti web ricchi di features che richiedono all’utente di cliccare buttoni sulla pagina per accedere alle loro funzionalità.

Ma naturalmente, il Back button è sempre indispensabile per gli utenti e viene usato così frequentemente che rimane sempre una usability guideline molto forte. (Togliendo la funzione del Back button era l’errore di design #1 dell’anno 1999 e rimane uno degli errori più diffusi fino a oggi).

Il comportamento di lettura

Harald Weinreich ha fornito a Nielsen il dataset che contenente 59,573 page views.

Da questi dati, Nielsen ha tolto i seguenti records:

• 10,163 page views (17%) che hanno durato meno di 4 secondi. In visite così corti l’utente non ha veramente “usato” la pagina
• 2,615 page views (4%) che avevano una durata di più di 10 minuti. In questi casi l’utente probabilmente ha lasciato aperto il browser mentre faceva qualcos’altro.
• 1,558 page views (3%) su pagine con meno di 20 parole. Queste pagine probabilmente erano errori del server o downloads interotti ecc.

Dopo questa “pulizia”, a Nielsen rimenavono 45,237 page views per la sua analisi.

Nielsen era capace di scrivere formule molto interessanti per descrivere il comportamento dell’utente su pagine da 30 – 1.250 parole. Per pagine più lunghe invece, il comportamento diventava molto irregolare. Pagine con tantissime parole comunque di solito non sono “vere” pagine – sono più documenti accademici o pagine con “termini & condizioni” quali non vengono letti molto attentamente. (In una ricerca per il libro Prioritizing Web Usability, si è scoperto che la gente legge solo il 10% del testo che dopo “accettano”).
Il seguente disegno mostra il tempo medio che gli utenti passano sulle pagine con diversa quantità di parole:

Ovviamente, utenti spendono più tempo su pagine con più informazioni. Ma la formula best-fit dice, che gli utenti passano solo 4.4 secondi in più per ogni 100 parole aggiuntive. Di solito si calcola una velocità di lettura di 200 parole a minuto (WPM), ma siccome questi utenti erano superiore alla media, Nielsen ha usato 250 WPM. A questa velocità gli utenti possono leggere 18 parole in 4.4 secondi. Questo significa, se si mette una quantità elevata di parole su una pagine, gli utenti leggono solo il 18%.

La percentuale del testo letto

Questa studie non è stato una studie eyetracking. Per questo motive non si sa precisamente come gli utenti hanno allocato il loro tempo. La formula del disegno precedente indica, che esiste un tempo fisso di ca. 25 secondi più altri 4.4 secondi per ogni 100 parole in più. (Ovviamente questi numeri non sono “fissi” nel senso che sono sempre gli stessi – sono medie).

La formular indica che la gente spende una parte del loro tempo per capire il layout della pagina , la navigazone e guardando le immagini. E’ evidente che la gente non legge ogni secondo della visita di una pagine.

Comunque, il tempo totale passato su una pagina web è definitivamente il limite superiore di possibili tempi di lettura. Quindi si potrebbe calcolare un ipotetico numero massimo di parole che l’utente sarebbe capace di leggere, se egli dedicarebbe l’intera durata della visita alla lettura.
Il seguente chart dimostra il massimo di testo che l’utente sarebbe capace di leggere durante una visita su pagine con un numero di parole diverse:

Questa curva declina molto velocemente. Durante una visita media, gli utenti leggono la metà degli informazioni solo sulle pagine con 111 parole o meno.

Nel dataset completo, la pagina web media conteneva 593 parole. Così, mediamente, l’utente avrà tempo per leggere il 28% delle parole se dedica tutto il tempo a leggere. E’ più realistico presumere, che l’utente legge solo il 20% del testo di una pagina media.

Come esempio il conteggio parole di questo articolo: 1,082

Ovviamente, il visitatore medio non leggerà molto di questo articolo. E Nielsen come ibloom ha targetizzato un pubblico di elite molto ristretto e con affinità al tema usability. Se voi dovete targetizzare un pubblico più ampio oppure avete un ciclo di vendità da meno di 5 anni – siate saggi e mettete il vostro contatore parole a dieta.

Articolo originale da Jakob Nielsen – How little do users read

E sono soprattutto i clients di Microsoft e IBM, Outlook 2007 e Lotus Notes 8 – quelli più usati in ambito business – ad ignorare la conformità agli standard. E così accade che per i mailing templates si debbano ancora usare rigide tabelle, mentre nei browsers da tempo si è passato al design SENZA tabelle.

Per migliorare questa situazione è nato il Email Standards Project.
La mission dei membri del progetto: convertire gli sviluppatori dei clients di posta e farli diventare fans di conformità standard. I successi del progetto possono essere seguiti sulla homepage di email standards project. Secondo loro Apple, IBM e Microsoft continuano ad essere dei “barbari” per quanto riguarda gli standards.

Chi crede nelle conformità degli standards del email-Marketing dovrebbe supportare il progetto. Ci sono vari modi di farlo: diffondere le loro idee a voce o sul proprio sito, aiutare nelle loro ricerche oppure raccontare le proprie esperienze sui varie clients.

Anche la più piccola cosa viene apprezzata.

The Institute for Dynamic Educational Advancement (IDEA) a metà del 2008 ha fatto un survey con lo scopo di chiarire tutte queste domande e di rivelare problemi correlati. Il risultato: un PDF di 17 pagine che racchiude tutto. Inoltre l’instituto propone alcune direttive interessanti per un’user experience ottimale. Ecco alcune delle condierazioni:

• i designers sottovalutano la potenziale efficacia di un sito.
  “I designers dovrebbero dare più importanza all’efficienza generale del sito, riducendo così la probabilità che un’utente non trovi l’informazione che sta cercando.”

  

• L‘80% dei designers è convinto che una bella grafica sia importante per l’user experience. Solo il 50% degli visitatori ha la stessa opinione.

• Il 60% dei designers crede che l’attualità delle informazioni sul sito non sia molto importante. Per l’80% degli visitatori invece è importantissima.
• Il 70% dei designers è convinto che i visitatori navighino senza problemi in internet. Invece solo il 10% degli utenti ha sostenuto di avere pochi problemi nella navigazione.
• Gli utenti vogliono i contenuti subito. Anche nell’era dell’ADSL i visitatori apprezzano i siti veloci.
• Solo il 40% dei visitatori considera importante un motore di ricerca sul sito. Ma sono convinti che un “assistente personale” sarebbe utilissimo.

Allo studio hanno partecipato 2.488 persone – tra loro ONG, agenzie web e navigatori.

In questi casi studi scientifici possono essere considerati per supportare il designer nelle sue decisioni. Per esempio, i risultati di uno studio di usabilità eseguito dalla Facoltà di Arte di Atlanta (USA) hanno rilevato che

• il 61% degli utenti preferisce un design senza linee orizzontali anziché una grafica con linee orizzonatali,
• il 76% preferisce un menu di navigazione posizionato a sinistra piuttosto che destra.

Altri risultati interessanti provengono da uno studio ancora in corso – Fully Personal Interface research, dove ad utenti online viene chiesto la loro preferenza in user interface design:

• il 73% preferisce labels per campo di input a sinistra
• l’88% considera alcune icone utili
• il 62% preferisce una navigazione orizzontale ad una verticale
• e per il 60% la funzione è più importante della forma.

Altri dati possono essere trovati nel post Web Design: 15 Important Research Findings You Should Know di Jens Meiert, ed anche nella brochure Research-Based Web Design & Usability Guidelines. Alcuni risultati sono banali, ma altri piuttosto sorprendenti.

Certo non si deve sopravvalutare i risultati di questi studi: nell’user interface design solo rarissime volte esistono un si o no deciso.

Ma come sapere se funziona il proprio sito?

Per misurare il comportamento dei visitatori sul proprio sito esistono vari metodi più o meno efficaci e costosi.

Heatmap – Immagine da www.drweb.de

• Eyetracking – una tecnologia ormai da tempo usato per la comunicazione print. Oggi viene anche utilizzata per misurare i movimenti degli occhi di una persona mentre visita un determinato sito web. Lo scopo è capire dove l’utente guarda e in che sequenza guarda dove. Con un programma speciale vengono misurati quali punti del sito web sono stati considerati i più interessanti. Alla fine vengono creati delle “heatmaps”, dove le aree più guardate sono segnate in rosso.

• Google Analytics – un po’ meno efficace ma gratis. Dalle statistiche di Google Analytics – se installato il tracker sul proprio sito – si possono vedere i clicks su tutti i links presenti sul sito stesso. Il periodo può essere liberamente scelto. Esistono anche altri programmi con comportamenti simili come per esempio Clicktracker.
• Clicktale – questo tool registra ogni movimento di mouse e ogni click effettuato dal visitatore. Alcuni features interessantissimi sono:
  • Guardare filmati delle browsing sessions dei visitatori analizzando i loro comportamenti.
  • Scrolling Heatmaps – visualizzano dove i visitatori guardano e quanto in basso scrollano.
  • Analisi Links – visualizzano qualsiasi interazione, hover, tempi di esitazione ecc.
  • Analisi Forms – scoprono eventuali campi problematici in online forms che potrebbero causare l’abbandono del sito web.

ClickHeat

• ClickHeat – una heatmap visuale di clicks sua una pagina HTML, visualizza zone di click “calde” e “fredde”. A differenze degli altri tools si tratta di un progetto open-source in AJAX e può essere installato sul proprio server.

Per concludere una frase di Chaperro, Shaikh, and Baker, 2005:

Il layout di una pagina web (whitespace e layout avanzato dell’header, indents e immagini) potrebbe anche non influire nella performance, ma influirà sulla soddisfazione dell’utente.