Le linee guida: un concetto di design esaustivo per il vostro sito web

La riconoscibilità abbinata a una presentazione uniforme costituisce l’ABC della progettazione di un sito web. La maggior parte delle volte non costituisce un problema, sempre che si stia lavorando da soli a un progetto. Al contrario per quanto riguarda la pianificazione di lavori online più grandi, come possono essere la creazione e l’elaborazione di un sito web di un’azienda, spesso sono più team a lavorare alla struttura e alla cura del progetto online. La soluzione in questi ambienti di lavoro viene offerta dalle linee guida, altrimenti conosciute in inglese come styleguide. Ma cosa si nasconde concretamente dietro a questa espressione? Come si creano delle linee guida appropriate in maniera semplice e veloce? E infine quali argomenti dovrebbe trattare?

Nell’ambito dell’online marketing le linee guida costituiscono il vademecum per la strutturazione uniforme di progetti online. Di questi fanno parte, oltre al proprio sito web, anche gli account sui social network e le app. Una styleguide è quindi strettamente connessa al Corporate Design e alla Corporate Identity di un’azienda o di un brand: essa si occupa infatti di rendere immediatamente riconoscibile anche in rete l’identità visiva dell’impresa. Il manuale di stile è necessario per presentare il brand su tutti i canali di comunicazione come un’unica unità: che si tratti di social media, e-mail, il proprio sito web o altre pubblicazioni. Al suo interno sono infatti contenute le linee guida destinate a tutti i collaboratori: quindi come dev’essere rappresentata graficamente e testualmente l’impresa in modo che i (potenziali) clienti possano immediatamente riconoscerla.

In sintesi le linee guida per siti web comprendono molto più di un semplice logo: oltre ai font e ai colori da utilizzare, il manuale stabilisce anche le immagini e la disposizione degli elementi, e contiene anche indicazioni riguardo alla tonalità dei testi. Se si segue la guida, il sito web trasmetterà un’immagine uniforme nonostante le singole sezioni siano state realizzate da diversi web designer.

Prima o poi i responsabili di un’azienda si trovano davanti alla questione di come rappresentare al meglio la propria impresa attraverso un sito web e come far sì che i visitatori della pagina sappiano subito associarlo alla realtà del brand. Le risposte a queste domande finiscono poi per confluire all’interno delle linee guida, che sintetizzano il contenuto elaborato e costituiscono le fondamenta per la progettazione del sito web. Un manuale di stile è essenziale poiché solamente grazie ad esso è possibile strutturare il progetto online in maniera uniforme e adeguata al target.

In questo modo il proprio brand è immediatamente riconoscibile su Internet. Idealmente un sito web concepito bene riesce a far sì che i visitatori si identifichino più facilmente con la marca o con l’azienda, nella migliore delle ipotesi tanto da consigliarla ad altre persone. Oltre a ciò un sito web strutturato uniformemente è in grado di trasmettere professionalità e serietà. I clienti o gli utenti si sentono coinvolti e rimangono più a lungo sulla pagina.

Per mettere insieme una buona styleguide è innanzitutto indispensabile inquadrare il target del sito web. Un esempio: una compagnia assicurativa non si rivolgerebbe mai ai propri clienti dando loro del “tu”. In questo settore, infatti, sia usa la forma di cortesia “Lei”, più formale e seria; questa formula viene utilizzata a partire dalla comunicazione a tu per tu con il cliente fino ad arrivare al contenuto del sito web. Dunque se di solito in questo ambito è diffusa la forma di cortesia, allora questa convenzione va ricordata in primis all’interno delle linee guida e naturalmente va adottata anche sul sito web. Se però si sta pianificando un portale indirizzato a persone giovani, il “Lei” risulta invece fuori luogo tanto da intimidire il target principale: il visitatore non si sentirebbe infatti coinvolto e finirebbe per cercarsi un altro portale.

Durante la creazione delle linee guida vanno tenute in considerazione la filosofia aziendale e la identità societaria, o anche Corporate Identity, così come il target. Per individuare questi concetti è necessario effettuare ampie rilevazioni e analisi di dati: vanno infatti definiti età, genere, livello di istruzione, status sociale e interessi del target. Solamente chi conosce al meglio i propri clienti, lettori o follower può realizzare un sito web e un contenuto adatti al target. Allo stesso modo le linee guida devono essere in grado di descrivere la filosofia aziendale, gli obiettivi e il registro linguistico: cosa rappresenta l’azienda e quali parole possono e devono essere utilizzate principalmente sul sito per trasmettere ai clienti o ai lettori i propri ideali?

Più sono precise le indicazioni, meno correzioni ed elaborazioni dispendiose a livello di tempo e di denaro saranno necessarie in un secondo momento. Conviene dunque che il manuale di stile racchiuda le linee guida andando il più possibile nel dettaglio: i colori vanno definiti in maniera chiara con i codici Hex, valori RGB e una rappresentazione visiva. Servendosi di una breve descrizione è possibile spiegare velocemente l’effetto che le scelte cromatiche stabilite hanno sull’osservatore. Inoltre deve sempre essere evidente quali colori sono stati previsti per quali elementi. Di conseguenza vanno stabiliti il posizionamento e la colorazione di icone, pulsanti, banner e loghi.

Un testo può però non bastare a fornire chiarezza con la sua spiegazione a parole: una panoramica grafica invece risulta più trasparente e riassuntiva. Con un’immagine infatti si possono indicare la lunghezza delle colonne e l’altezza delle righe, così il designer riceve direttamente una visione completa dell’aspetto della pagina finita. In più risulta sensata anche l’aggiunta delle dimensioni relative alle immagini, alle icone e ai loghi.

Altrettanto importante è stabilire la corretta applicazione e la dimensione dei font scelti: quando e come vanno utilizzati determinati font? Possibilmente le linee guida contengono anche esempi diretti di utilizzo che evidenziano quale font è stato scelto per l’intestazione principale, quale per le secondarie e quale nel testo. Per concludere non possono certo mancare le indicazioni relative alla distanza tra le righe, al rientro e agli spazi tra i singoli elementi della pagina.

L’ultimo esempio di linee guida evidenzia come per un manuale di stile che sia utile non vi è la necessità di tante righe di testo: per la maggior parte delle guideline bastano infatti brevi descrizioni e chiare illustrazioni. Il fattore più importante di tutti è la struttura logica: ad esempio su Mozilla la navigazione funziona tramite una struttura di menu posizionata sul lato sinistro, mentre per quanto riguarda la styleguide del Ministero ci si muove attraverso una struttura ad albero molto lineare e trasparente.

Naturalmente non tutte le aziende hanno la possibilità di realizzare delle linee guida per il proprio sito web. Di solito basta già un manuale ben strutturato, magari in formato PDF, da sottoporre ai web designer prima che si mettano al lavoro.

Una volta realizzate, le linee guida vanno tenute in considerazione anche nel momento in cui il sito web viene aggiornato e rielaborato. Solo così si garantisce a lungo termine l’aspetto di uniformità in tutti i canali di comunicazione. L’uniformità è infatti essenziale per il branding, ma ciò non significa che le linee guida di un’azienda debbano rimanere invariate negli anni. Piuttosto andrebbero invece regolarmente sottoposte a verifiche: sono i design ancora attuali e i font ancora adeguati al momento? Sarà magari il caso di effettuare un upgrade del logo?

L’esempio di Mozilla dimostra non solo che il logo può vivere un’evoluzione, anzi, è persino auspicabile che lo faccia. Del resto anche il gusto del target può subire delle variazioni nel tempo e non essere più lo stesso. Per un progetto online è quindi sì importante rimanere fedeli alle direttive definite all’interno delle linee guida, ma senza essere eccessivi e comunque sempre cercando di stare al passo coi tempi.