Anche un business ha un carattere, proprio come le persone. In un piccolo business il suo carattere è frutto delle scelte dell’imprenditore, scelte più o meno istintive che determinano il posizionamento di mercato dei suoi prodotti o servizi. Quando il posizionamento viene scelto a tavolino e in modo consapevole, lo si esprime con coerenza attraverso tutta la comunicazione aziendale, a cominciare dal logo e, più in generale, dalla Visual Identity. La Visual Identity e la sua espressione nel sito web è ciò di cui ci occupiamo in questa puntata della Guida al sito fai da te.
La guida al sito fai da te
Questa è la sesta puntata della nostra Guida al sito fai da te, una guida in otto parti rivolta a chi vuole creare il proprio sito web in autonomia.
Se ti interessano anche gli altri aspetti della creazione del tuo sito ti consigliamo di iniziare dal primo articolo “La guida definitiva al sito fai da te” e leggere le puntate nell’ordine. Insieme ti danno un metodo, una struttura per fasi ragionate che puoi seguire passo passo.
► Preferisci commissionare il sito a chi è del mestiere? Scopri il nostro servizio oppure leggi qui come commissionare un sito web professionale.
Fase 6: LOGO E VISUAL IDENTITY
Una volta che hai identificato un buon nome brand per la tua azienda e registrato il corrispondente dominio, è il momento di comunicare questo brand rappresentandone in modo visuale la sua personalità, attraverso il logo e l’intera Visual Identity che determina l’impronta grafica del tuo sito.
Per cominciare facciamo una breve introduzione: il logo e in generale la Visual Identity costituiscono solo la parte visuale di un insieme di aspetti complessi e articolati che definiscono l’Identità di Marca o Brand Identity di un business.
Per i non addetti ai lavori è facile confondere il significato dei termini Visual Identity e Brand Identity, e in giro per il web le due definizioni vengono talvolta usate come sinonimi, mentre si riferiscono a due cose diverse.
Visual identity vs. brand identity
Allora, qual è la differenza fra Visual Identity e Brand Identity?
La Brand Identity, in breve, è tutto ciò che comunica al mondo esterno il posizionamento di un business.
La Brand Identity parte dalle basi del posizionamento di mercato (ossia la combinazione prodotto / prezzo / canali di distribuzione) e si arricchisce con con tutti gli elementi di unicità del business come la Unique Value Proposition, visione e missione, valori fondanti, servizi collaterali. A questi si aggiungono tutti gli elementi di comunicazione scritta o verbale come il nome, il payoff, il tono di voce, i temi trattati e lo stile comunicativo adottato in tutti i canali online e offline.
Per far percepire meglio la Brand Identity, un business adotta anche altri elementi percettivi come il logo, la palette di colori, la scelta dei caratteri, il packaging dei prodotti, le forme e gli abbellimenti grafici che sono puramente visuali e compongono quindi la Visual Identity.
Logo e processo creativo
L’elemento principale della Visual Identity è il logo. Il logo è l’espressione grafica del nome del brand (quindi del sito) e influenza in modo potente la percezione che il pubblico ha del tuo business. I loghi migliori funzionano perché vengono ricordati dalle persone, non perché sono belli, ma perché sono unici, sanno rappresentare al meglio il brand e suscitano nel pubblico di riferimento un’impressione positiva. Puoi immaginare quindi quanto sia importante.
Il logo e la Visual Identity nascono dall’analisi del brand e da un processo creativo in diverse fasi. Se il logo viene commissionato a un professionista questo dovrà innanzitutto entrare in sintonia con il committente, capire la personalità, le caratteristiche e i punti di forza del business. Per questa prima fase della visual identity si ricorre spesso alla creazione di una mood board.
La mood board, definizione inglese che può tradursi in “tavola dell’umore” ha il compito di raccogliere suggestioni per restituire l’atmosfera e lo stile di un progetto e consiste infatti in un collage di immagini, disegni, illustrazioni, colori, texture, parole, tratte da riviste cartacee, dal web o qualsiasi media, mixate con schizzi ed esercizi di design. La mood board definisce l’espressione visuale del progetto che porterà alla definizione del logo e della palette di colori.
L’uso della mood board proviene da altri campi del design come quello di interni o della moda. Nella progettazione della Visual Identity per un business è comunque un ottimo strumento di ispirazione e diventa la fonte principale da cui vengono tratti colori, forme, pattern, tipografia e altri elementi grafici che verranno utilizzati nel materiale visuale, incluso il sito web.
Lo svantaggio della mood board, e forse uno dei motivi per cui non viene usata da tutti i professionisti, è che diventa semplice cedere alla tentazione di giocare all’infinito con immagini, colori e parole. E’ importante invece darsi un limite di tempo, raggiunto il quale è consigliabile passare alla fase produttiva.
Dall’ispirazione alla produzione del logo
Ogni professionista può avere un suo metodo personale per giungere alla creazione di un logo. Se vuoi cimentarti anche tu nel creare il logo per il tuo business, devi sapere che tra le tecniche più usate nel processo creativo c’è quella della ripetizione, durante la quale, traendo ispirazione dalla mood board, si scrive e riscrive, disegna e ridisegna, decine o centinaia di volte, il nome del business, giocando con i modi diversi di esprimerlo visualmente:
- usando le lettere maiuscole, minuscole, miste
- usando i numeri, se sono rilevanti, oppure mescolando lettere e numeri
- disegnando oggetti che ricordano il nome del brand oppure una parte dello stesso
- disegnando il prodotto (se il business tratta prodotti fisici)
- associando il nome del sito oppure del prodotto con concetti esprimibili visualmente.
- infine, creando combinazioni tra i diversi tipi di espressione grafica, creando varianti con volumi e colori diversi.
Dalla fase della ripetizione possono uscire diverse bozze del logo e solitamente si comincia riducendo la lista alle 2 o 3 bozze migliori. Queste bozze vanno poi rilavorate, semplificate, ridotte nei colori, in modo da essere utilizzabili sia sul web che in stampa su diversi supporti come carta, cartone, stoffa, eccetera, e rappresentabili senza problemi in bianco e nero.
Se pensiamo ai diversi utilizzi del logo, è meglio crearne due versioni: una versione orizzontale e una quadrata. La versione orizzontale si può usare nella testata del sito oltre che sulla carta intestata, sui biglietti da visita e sul materiale stampato, mentre la versione quadrata, possibilmente stilizzata e adattabile anche ad una forma rotonda, deve contenerne una versione più essenziale ma leggibile anche a dimensioni molto piccole, e può essere usata come foto profilo sui social media e come icona del sito web.
► Leggi anche: Come raccontarvi attraverso il colore del logo
Completare la visual identity
Partendo dalla mood board, la Visual Identity è trasposta nel sito web attraverso una palette di colori e una selezione di font da utilizzare per il corpo e il titolo dei testi e possibilmente qualche elemento di personalizzazione delle immagini.
La palette dei colori
Applicando la Visual Identity al sito web bisogna considerare anche aspetti specialistici del web come l’usabilità. Per ottenere un sito web chiaro e altamente fruibile, tutti gli elementi grafici devono avere colori ben identificati e armonici: bisogna prevedere uno o più colori per gli sfondi (delle pagine, dei box informativi, delle Call To Action), un colore per il corpo del testo e uno per i titoli, uno o più colori per gli abbellimenti grafici (es. le linee di separazione o di evidenziazione). Come per la stampa su carta, i colori del testo e dello sfondo devono avere sempre un buon contrasto in modo da garantire la leggibilità anche da parte di chi non ha una vista perfetta.
I link meritano un trattamento speciale e per essi bisogna scegliere innanzitutto un colore ben visibile che li distingue dal testo normale. Il colore dei link si usa spesso anche per i pulsanti e nel sito web viene definito colore primario. Inoltre per i link sono necessari almeno due o tre colori o sfumature di questi, per differenziare i link (e i pulsanti) in stato normale, al passaggio del mouse e, volendo, i link già visitati. Bisogna inoltre prevedere link e pulsanti di colore diverso, se il sito prevede diversi sfondi, in modo da assicurare sempre un alto contrasto di facile leggibilità.
La scelta dei caratteri
La scelta dei font giusti è importante quanto quella del logo e dei colori. La scelta del font ha un impatto diretto sulla leggibilità dei testi, quindi è consigliabile scegliere, almeno per il corpo dei testi, un font molto leggibile. A questo font principale si può abbinare un font da utilizzare nei titoli, che può dare maggior impatto visivo.
Una vera miniera di font gratuiti per i siti web è Google Font, tra cui puoi scegliere uno o più font da installare nel tuo sito seguendo le istruzioni fornite all’interno del sito stesso. Per utilizzare quasi tutti gli altri font bisogna acquistare una licenza a pagamento. In rete si possono trovare anche versioni ridotte e gratuite di alcuni font a pagamento, che però sono limitate e inadatte a un sito web per il business.
E’ meglio limitarsi a uno o due font al massimo, che devono abbinarsi in modo armonioso e coerente con il brand, piacevole per il pubblico e soprattutto funzionale e ben leggibile. Per ispirarti con gli abbinamenti dei font esistono diversi sul web, come Canva, Fontjoy o Mixfont.
Come regola generale, i font da abbinare non devono essere troppo diversi ma neppure troppo simili. Piuttosto che usare due font simili tra loro, allora meglio usarne uno solo in tutto il sito. Consigliamo di utilizzare soltanto font di alta qualità che offrono un’ottima resa senza irregolarità o sbavature sia sul web che su stampa, in tutte le dimensioni utilizzate.
La personalizzazione delle immagini
La personalizzazione delle immagini è a nostro avviso un elemento importante per rendere ancora più efficace la tua Visual Identity. Soprattutto se inserisci nel sito immagini prese dai siti di foto stock, puoi trovare immagini con colori molto diversi tra loro e, se le usi al naturale, rischiano di essere spersonalizzate, incoerenti o addirittura in conflitto con gli altri elementi visivi del tuo brand. Le immagini manipolate con l’aggiunta di filtri, tagli particolari delle inquadrature, sfumature o colorazioni personalizzate, possono invece rafforzare l’identità visiva aziendale e renderla coerente. Nell’articolo Tutto sulle immagini per il sito web parliamo proprio di come trattare le immagini per il sito.
I template grafici pronti
Durante la fase 4 del nostro programma, quando hai scelto il CMS per il tuo sito web, ti sei accorto che è possibile acquistare modelli grafici già pronti, gratuiti o a pagamento, da installare e personalizzare. Secondo il CMS che hai scelto questi modelli prendono il nome di “temi”, “template” o altri nomi simili. Il loro compito è creare, appunto, modelli con un’impronta grafica pronta (colori, sezioni, spazi) e una struttura da riempire con i tuoi contenuti.
Inutile dire che il template grafico è parte integrante della tua Visual Identity ed è opportuno sceglierlo proprio in questa fase.
Nella scelta del template fai attenzione a questi aspetti:
- Scegli un template che rispecchia la personalità, o concept, che hai formulato nella tua Visual identity
- Non sempre un tema graficamente splendido è quello giusto per i tuoi clienti potenziali.
- La disponibilità di questi modelli è davvero enorme e consigliamo di dedicare tempo e attenzione nella scelta di quello giusto, in base alla strategia e alla personalità del business, tenendo sempre a mente il pubblico a cui ti rivolgi.
Come sai, in base ai colori e all’identità visuale che sceglierai, il tuo pubblico inconsciamente tenderà a definirti. La scelta dei colori potrà instillare nel pubblico un’idea di affidabilità, autorevolezza, fascino, mistero, serietà, pulizia, coscienza sociale. Per saperne di più sulla psicologia del colore puoi consultare questa infografica.
Ricapitolando
- Puoi avere un nome brand stratosferico ma senza una Visual Identity rimane incompleto
- Per dare carattere alla tua identità visuale comincia creando una mood board da cui trarre ispirazione
- definisci la palette di colori da usare per i diversi elementi del sito
- definisci il logo in due formati, rettangolare e quadrato, più una versione in bianco e nero
- definisci i caratteri per il sito, usando al massimo 2 caratteri abbinati con armonia
- se per il sito acquisti un template grafico già pronto, assicurati che sia personalizzabile nei colori e nei caratteri del tuo brand
Bene, per la visual identity è tutto. Noi ci vediamo alla prossima puntata della nostra guida al sito fai da te, in cui parleremo del copy per il sito.
Approfondimenti
- Pensare creativo: Moodboard, cos’è e perché crearne una
- La storia e l’evoluzione dei loghi dei brand più famosi
- Per un progetto zero-budget, ecco una lista di siti per creare loghi gratis.
- Ellen Lupton, Jennifer Cole Phillips: Graphic Design, the new basics
