2.3 - Lo stile del tuo design

Lo stile del sito racconta molto di un progetto, della personalità e professionalità. Molto importante è lavorare consapevoli che non è solo una questione di gusti, a voi possono personalmente piacere molte cose che possono addirittura disturbare i visitatori, potenziali fan, clienti, lettori del vostro progetto web. La selezione di colori e tipo di carattere è importante, quanto la scelta del logo. Elementi fondamentali per l'intera comunicazione del vostro progetto. I dettagli fanno la differenza fra un sito professionale e uno molto personale.

Le varianti di template


Questo include variazioni e combinazioni diverse di impostazioni di stile predefinite. Così si può scegliere quello che meglio si serve per presentare il contenuto della pagina e che va in linea con l'immagine che si vuole trasmettere.

Scegliere una variante del template

  • Fare clic su varianti nel selezionare i modelli per vedere le diverse opzioni.
  • Controlla l'anteprima di ogni variazione prima di salvare. È possibile modificarla a proprio piacimento successivamente.
  • Non tutti i modelli offrono le stesse opzioni di stile.

Che cosa potete trovare nelle varianti

  • Combinazioni di colore, font e dimensioni di testo e titoli.
  • Larghezza e allineamento per l'area principale di contenuto.
  • Posizioni diverse per la seconda area contenuti e la navigazione.
  • Colori e trasparenza per la parte inferiore della pagina e le aree di contenuto.

Trova il tuo stile


1. La combinazione di colori

Prima di iniziare modificando gli stili, la prima cosa da fare è definire quali colori utilizzare per il tuo sito web. Solo dopo averlo fatto è consigliabile iniziare ad apportare modifiche con un piano cromatico ben definito.


Si consiglia…

  • Selezionare un intervallo di tre colori e definite qual è il colore di base e quello laterale.
  • Scegliere i colori tenendo presente il vostro pubblico e il contenuto del vostro sito.
  • Se si ha già un logo e materiale promozionale stampato, ricordarsi di considerare anche i colori di questi per la comunicazione integrata.
  • Utilizzare strumenti come per es. COLOURLovers per definire combinazioni armoniose.
  • Evitare l'uso di colori vivaci per i testi e le combinazioni di colori opposti.
Esempio di pessima scelta di colori nei testi di un sito

2. Lo sfondo personale

Lo sfondo personale è una delle possibilità che ti permettono di rendere inconfondibile il tuo sito. Non è una feature raccomandabile per tutti i tipi di sito. Ma per siti portfolio, di fotografia, di artisti o siti di brand è una funzione da sfruttare perché ti permette di comunicare emozioni ed evocare sensazioni.

Si consiglia di…

  • Scegliere i colori per lo sfondo e per il testo facendo attenzione ad ottenere un sufficiente contrasto per mantenere la leggibilità.
  • Provare a utilizzare toni neutri di fondo, soprattutto se si hanno tanti contenuti come immagini, video o testi.
  • Regolare il colore o la trasparenza dello sfondo per evidenziare il testo se necessario.
  • Evitare di usare immagini o colori di sfondo molto luminosi.
Esempio di contrasto per il testo del sito e lo sfondo.

3. La scelta del carattere/font

I font in circolazione sono davvero tanti. Solo sui siti Jimdo ce ne sono 600, direttamente da GoogleFont. Trovare la giusta combinazione fra titoli, testi e link non è così scontato, perché avere tanta scelta non significa dover usare mille font diversi. I testi vanno aggiustati in colore, dimensioni, font e formato. Per un sito di e-commerce ad esempio è meglio evitare font con le grazie per esempio, cosa che può essere invece possibile per un sito di brand o di portfolio.

Si consiglia di...

  • Scegliere un tipo di carattere che è facile da leggere e un colore contrastante con lo sfondo. Per il testo la giusta dimensione è 14px 16px, con 1,5 di interlinea.
  • Scegliere un tipo di carattere accattivante per i titoli e semplice per i testi. Ad esempio, un font con titoli e sans serif o decorativi Serif o semplice nel testo.
  • Utilizzare le dimensioni dei titoli per stabilire la gerarchia nel contenuto. Per "titolo 1" utilizza una dimensione tra 44px 50px e per il "Titolo 2" tra 32px e 38px, e il "Titolo 3" tra 20px e 30px.
  • Utilizzare grassetto e corsivo solo nei titoli. All'interno i testi li si usa solo per evidenziare le informazioni importanti.
  • Evitare di utilizzare più di 3 tipi di font o stili tutta la pagina.
  • Non scrivere lunghe frasi o paragrafi in maiuscolo.
Esempio di testo con diversi font e stili di carattere

Ti è piaciuto l'articolo? Condividilo!

Continua...

  1. Scegliere il template giusto
  2. Struttura i tuoi contenuti
  3. Lo stile del tuo design

Jimdo-Academy, il corso di formazione web gratuito, è un'introduzione alla presenza online per chi vuole creare un sito web e gestire in modo autonomo la sua presenza online. I primi moduli sono dedicati alla progettazione e creazione di un sito web professionale. Il contenuti sono per le piccole e medie imprese, artigiani, associazioni e professionisti ed hanno l'obiettivo i fornire un'introduzione alle principali attività online di promozione e marketing. Come settare la tua strategia di comunicazione, elementi base di marketing  e perché il content marketing è importante per il tuo business.