Scelta dei Colori e Usabilità sul Web

Scelta dei colori e usabilità sul web
Gianpaolo Lorusso per gtConference, 20/6/2009

Gianpaolo Lorusso
Gianpaolo Lorusso per gtConference - 20/06/2009
Mi interesso di web marketing e motori di ricerca dal 1999
Sono stato responsabile marketing di una delle 20 più grandi web agency italiane
Consulente per i progetti web di molte tra le più grandi aziende italiane e per alcune agenzie di comunicazione

Impatto emotivo e navigazione
Studi dr.ssa Lindgaard (CarletonUniversity)
50 millisecondi (1/20 di secondo)
Studi neurofisiologici:
Livello pre-cognitivo
Livello logico-cognitivo

Codice cromatico universale
Non esiste alcun codice valido per tutte le culture mondiali
Linee guida per la scelta e l’accostamento di colori e elementi grafici
Limiti imposti dal media Internet

Cosa sono i colori
Il colore come noi lo percepiamo deriva da segnali nervosi generati dalla retina quando viene colpita da radiazioni elettromagnetiche di determinate lunghezze d'onda e intensità

La classificazione dei colori
Mescolanze additive e sottrattive
Modello RGB (rosso, verde, blu)
Modello HSB (tonalità, saturazione e luminosità)
Modello RGY (rosso, verde, giallo)
Modello CMYK (ciano, magenta, giallo, nero)

La ruota cromatica RGY

I colori “web safe”
I colori sicuramente gestiti dalle schede grafiche dei computer di tutto il mondo sono 216. Ma…
Fonte: www.shinynews.it

…e quindi?
Le difficoltà nella scelta dei colori per un sito web sono legate più che alla selezione dei singoli colori (spesso subordinati ai colori della comunicazione aziendale) alla individuazione delle loro combinazioni più gradevoli e funzionali.

Quali combinazioni preferire
Non più di 3-4 colori
Combinazioni di colori presenti in natura
Uniformità di uso in tutto il sito (a meno di casi particolari, es.: divisioni o società controllate)
Colori caldi (rosso) o freddi (blu)
Tonalità e luminosità diverse
Colori contrastanti o contigui

Quando usare il contrasto
Per identificare ciò che è cliccabile
Calltoaction
Indirizzare verso l’azione obiettivo
Uso in zone della pagina a minore visibilità
Per indicare come si usano i servizi
Per identificare i servizi in primo piano (a maggior valore aggiunto)

Quando usare la contiguità
Nel corpo centrale della pagina
Quando si vuole favorire la lettura “profonda”
Quando non si vuole sovraccaricare il navigatore di stimoli visivi
Per rilassare l’utente
Negli sfondi (mantenendo però sufficiente contrasto con i testi)

Il Rosso
Colore della passione (sangue e fuoco)
Potente richiamo dell’attenzione
Errore - stop
Aggressività
Violenza – eccitazione
Normalmente non bisogna eccedere nel suo uso

Il Marrone
Colore della terra
Mitiga gli aspetti negativi del rosso
Stabilità e credibilità
Variazione terrecotte gradite agli utenti nord europei
Fecondità, crescita

Il Rosa
Il colore del fiore
Dolcezza, profumo, sensibilità e grazia (come il fiore)
Aspetti romantici
Femminilità
Non violenza
Minore richiamo all’azione rispetto al rosso

L’arancione
Sorgere e tramonto del sole
Spesso associato ad offerte speciali
Energia ed equilibrio
Estroversione ed apertura
Nelle varianti collegate agli agrumi può stimolare l’appetito

Il giallo
Colore della luce solare
Brillantezza e intelligenza
Calore e originalità
Spiritualità
Difficile da abbinare, va spesso sottolineato con colori più forti
Le varianti più scure (eccetto il color oro) sono abbinate a stati di malattia

Il blu
Il colore del cielo e del mare
E’ considerato il colore universalmente più gradito (soprattutto agli uomini)
Evoca calma, professionalità, affidabilità e saggezza
In alcune varianti può calmare la fame
Nelle varianti più chiare evoca salute, tranquillità e delicatezza

Il verde
E’ il colore delle foglie, dei prati e dei boschi
E’ uno tra i colori più riposanti e gradevoli in assoluto
Evoca natura, armonia e stabilità
In opposizione al rosso denota un procedimento o un’area sicura
Negli USA richiama il colore del denaro

Il viola
Colore binario (conciliazione degli opposti)
A seconda della prevalenza del rosso o del blu evoca sensazioni molto differenti
Mediazione tra corpo e spiritualità
Associa alla stabilità del blu l’energia del rosso
Evoca nobiltà, lusso, mistero e magia
Le varianti più scure evocano eventi luttuosi

Il bianco
Il colore dell’alba, della neve e della luna
Evoca perfezione, purezza, innocenza, pulizia, igiene e lucentezza
In opposizione al nero ha spesso un significato positivo
Associato spesso al freddo e ad ambienti medici o di cura
Somma di tutti i colori o assenza degli stessi

Il Nero
Il nero rappresenta l’assenza di colore
Associato spesso all’origine di tutte le cose e al male (soprattutto in contrapposizione al bianco)
Evoca eleganza, potere, mistero, morte, paura
Colore molto formale, denota anche prestigio e autorità
Conferisce profondità, ma diminuisce la leggibilità se usato come sfondo

Come guardiamo i siti web
Fonte: Marketing Sherpa

Il carattere e i blocchi grafici
Caratteri non troppo chiusi e senza grazie
Sufficiente contrasto testo/sfondo
Alto-basso (no tutto maiuscolo)
Immagini di visi femminili
Elenchi puntati
Icone
Elementi in movimento

Piccolo test
Oggi è Nato un Bel Bambino
tutto biondo e ricciolino

La “bellezza” sul web
Layout chiaro
Navigazione immediata (test di usabilità)
Non troppi blocchi grafici e di testo
Uso degli spazi vuoti (equilibrio vuoti/pieni)
Grafica professionale (sfumature ed effetti rilievo/3D)
Immagini non di repertorio e non troppo grandi

Test di usabilità low cost
3-5 utenti individuano 80% dei problemi di un sito
Selezione dei candidati
Assegnare dei compiti
Misurare tassi di successo e tempi
Registrare audio e schermo
Il facilitatore non deve aiutare/indirizzare

Guida alla valutazione dei siti web
Nella guida troverete tutti i concetti alla base di questa presentazione.
Versione 3.0 (maggio 2009)
Scaricabile gratuitamente da:
www.gplorusso.it

Grazie per l’attenzione

http://www.sito-perfetto.it	4072
http://www.slideshare.net	11
http://wildfire.gigya.com	2
http://www.lmodules.com	1
http://translate.googleusercontent.com	1

Scelta dei Colori e Usabilità sul Web

by Gianpaolo Lorusso on Jun 22, 2009

Accessibility

Categories

Tags

Upload Details

Usage Rights

5 Embeds 4,087

Statistics

Scelta dei Colori e Usabilità sul Web — Presentation Transcript