WINTERTemplateSiti Web

Parola visuale, analisi del lettore, usability dei

testi ed accessibilitàdott. Paolo Gatti – pgatti@unite.it

www.paologatti.it - www.webedintorni.eu

UniTE lezione #2

WINTERTemplate

AgendaPrincipi generali

Comunicare sul web

Il lettore del web

Usability dei testi

Accessibilità

Il testo sul web è una “cipolla”:

Principi generali

Sul web non ci sono solo parole: la grafica è parte integrante del processo di scrittura.

Il testo, quindi, convive con:

i colorigli spazile immaginigli elementi grafici paratestuali

Comunicare sul web..

La densità:

Provoca confusione

Allunga di tempi

Annulla l'informazione

Parola visuale: pagine dense

Parola visuale: pagine ariose

Più semplici da leggere, più veloci e con maggior piacere da parte dell'utente

Parola visuale: esempi a confronto

Tra i siti più brutti: Bakers Junction

Caratteristiche principali della lettura web

L’occhio è attratto dalle discontinuità (spazi, colori...).Si cerca di circoscrivere il contesto (argomento, autore, data, testata, lunghezza documento...)Si cercano i punti di ancoraggio (link, grassetti, foto...)La lettura è molto finalizzata. La lettura è un’azione

Vi riconoscete in questa analisi? Io sì!

Discontinuità: la lettura “a salti”

Il lettore web è un vero lettore? L’80% dei lettori “scorre” la pagina!!

Il rapporto “Eyetrack”

Osservando sperimentalmente i comportamenti degli utenti attraverso l’analisi dei movimenti oculari, dei tempi di permanenza e dei clic sui link...

Il rapporto “Eyetrack”

In generale è stato rilevato che...

Cosa vi ricorda?! Il Modello ad F!

L'effetto della dimensione dei font

Se volete spingere a leggere più a lungo la home, usate font piccoli (11) se volete aiutare un rapido scan delle cose essenziali usate font grandi (12-14)

Rapporto tra testo e azione

Se volete spingere a leggere più a lungo la home, usate font piccoli (11) se volete aiutare un rapido scan delle cose essenziali usate font grandi (12-14)

Elementi di “ancoraggio”

Le immagini e i titoli sono il primo elemento a cui si presta attenzione, indipendentemente dalla loro collocazione nella pagina. Le immagini con i visi in maniera ancora più accentuata.

All'interno del testo alcuni elementi vengono percepiti prima di altri:

TitoliSottotitoliGrassettatureLinkPunti ElencoTesto semplice

Elementi di “ancoraggio”

Usability dei testi

Il testo sul web deve essere riadattato rispetto alla carta stampata!

Sul video la leggibilità si riduce del 25% rispetto alla carta stampata (Video: 72 dpi - stampa: 300 -1200 dpi).Il testo sul web fa adeguatamente formattato per renderlo usabile e adeguarlo alle caratteristiche del mezzo.Non si può limitarsi a “riversare” in html il testo concepito su altri supporti (carta, slide, word..).I blocchi di testo troppi fitti spaventano il lettore e non danno “elementi di ancoraggio”.

Usability dei testi: consigli “per l'uso”

Di seguito una serie di consigli utili:

è meglio impaginare il testo in una sola colonna larga circa 450/500 pixel e non oltre, così da renderla adeguata alla lettura umana;è opportuno limitare la lunghezza dei testi tra 500 e 3.000 caratteri per un max di 2 o 3 schermate (ricerche confermano che la maggior parte degli utenti non supera le 2,5 scermate); in alternativa, è meglio utilizzare un indice o la “paginazione”;in caso di pagine lunghe, potrebbero essere utili bottoncini per tornare in alto;evitare il giustificato: peggiora la leggibilità!evitare l'allinamento al centro → allineamento a sx!

Usability dei testi: consigli “per l'uso” (2)

evitare i testi in maiuscolo (minore leggibilità e secondo le netiquette, scrivere in maiuscolo vuol dire URLARE!)ridurre al minimo i testi in corsivo (magari solo per parole particolari, poiché aumenta l'effetto “seghettatura” e quindi diminuisce la leggibilità);ridurre al minimo i testi sottolineati (meglio il grassetto);

Font migliori: Arial, Verdana

Font peggiori: Times New Roman, Garamond

Usability dei testi: consigli “per l'uso” (3)

Usability dei testi: consigli “per l'uso” (4)

Percezione degli utilizzatori relativamente al font utilizzato:

Le resa migliore relativamente ai tempi di lettura si ha con caratteri con corpo 12 Verdana o Thaoma

Usability dei testi: consigli “per l'uso” (5)

Usability dei testi: consigli “per l'uso” (6)

L'accessibilità è quella caratteristica dei Siti Web che li rende usabili in modo efficace e con soddisfazione anche da persone che si trovano in condizioni "di svantaggio", quali, per esempio, le persone disabili, ma anche le persone anziane, quelle con bassa scolarità, persone con tecnologia hardware e software obsoleta, immigrati, e così via.

L'obbiettivo è non escludere nessuno dalla fruizione dei contenuti!

Accessibilità dei siti web

L'accessibilità dei Siti Web è regolata in Italia da una legge: Legge 4/2004 o Legge Stanca, dal nome del ministro che l'ha promossa. Questa legge, intitolata "Disposizioni per favorire l'accesso dei soggetti disabili agli strumenti informatici" si applica alla pubblica amministrazione, ma costituisce anche un modello per i privati.

La Legge definisce tutta una serie di requisiti da rispettare e definisce delle procedure per verificare l'accessibilità di un Sito Web.

Accessibilità – Legge Stanca

Oltre a tutte le pubbliche amministrazioni, le legge Stanca obbliga altre realtà ad avere i propri siti accessibili:

enti pubblici economici;

aziende private concessionarie di servizi pubblici;

aziende municipalizzate regionali;

enti di assistenza e di riabilitazione pubblici;

aziende di trasporto e di telecomunicazione a prevalente partecipazione di capitale pubblico;

aziende appaltatrici di servizi informatici.

Accessibilità – Legge Stanca

Al fine di aumentare l'accessibilità di un sito web, è bene seguire le seguenti indicazioni:

ricordare 2 principi fondamentali:l'utente sa cosa vuole e vuole trovarlo;

l'utente non vuole perdere tempo.

rendere ben visibili in home page le informazioni più importanti;

parlare il linguaggio dell'utente;

essere coerenti (nel linguaggio, nella grafica, negli effetti, nella presentazione);

essere consistenti (strumenti di navigazione, colori, caratteri, grafiche, audio, layout, …);velocità: il sito si dovrebbe caricare in max 10 sec.

Aumentare l'accessibilità

Uno dei primi passi per creare contenuti accessibili, è il saper valutare l'accessibilità di un sito web:

validazione del codice HTML / XHTML (e CSS) → HTML Validator e CSS Validator;

validare l'accessibilità → difficile automaticamente ma The Wave è un buon punto di partenza;

controllare l'accessibilità della tastiera;

provare la pagina con uno screen reader;

Controllare la conformità della pagina alle WCAG→ WCAG Web Content Accessibility Guidelines versione 2.0 divise per priorità: 1 (A) , 2 (AA) e 3 (AAA) – Link agli strumenti di valutazione

Prevedere test pratici con gli utenti disabili

Valutare l'accessibilità

DOMANDE?! :)

That's all!

Giacomo Mason

http://www.slideshare.net/giacomo.mason/usabilita-e-scrittura-dei-testi-per-il-web

Credits