Personalizza il sito web con il tuo brand
Fare in modo che la tua presenza online rifletta l'identità del marchio è fondamentale per rendere l'esperienza degli utenti la migliore possibile. Con un branding efficace del sito web puoi stabilire una chiara connessione tra voi e il sito, facendolo risaltare tra gli altri e rendendolo facilmente riconoscibile.
RevasOS si basa sul concetto di visual web design di alta qualità fornito attraverso temi che possono essere personalizzati dal creatore del sito. In questo modo si ottiene il massimo livello di qualità di user expeirence per l'utente finale e di facilità d'uso per il creatore del sito web.
In questa guida imparerai come personalizzare il template del tuo sito web modificandone i colori, i loghi e i caratteri del tuo marchio e altri aspetti.
Branding in RevasOS
Il branding su RevasOS viene applicato sui seguenti elementi che hanno un alto impatto sull'aspetto grafico del sito e la sua differenziazione rispetto ad altri siti web:
- Il logo principale,
- La favicon,
- Il carattere tipografico,
- Il colore principale,
- Gli arrotondamenti delle forme.
Carica il logo e la favicon
La scelta di un logo e di una favicon è fondamentale per l'identità di un marchio su un sito web, con la differenza che il logo verrà visualizzato in modo evidente sul sito web vero e proprio, mentre la favicon verrà utilizzata nella scheda del browser, se supportata.
Per questo motivo si consiglia di utilizzare file più piccoli (32x32 pixel) per le favicon, mentre i loghi possono essere più grandi.
Per aggiungere un logo e una favicon al sito web segui questi step:
- Apri l'app Siti web in RevasOS;
- Individua il gurppo di siti a cui vuoi apportare modifiche;
- Clicca sul bottone con il nome del template scelto (ad esemptio Template default) che si trova a fianco al nome del sito sulla barra del gruppo di siti;
- Clicca sul bottone "Carica icona" e selezione il file della favicon;
- Clicca sul bottone "Carica logo" e seleziona il file del logo;
- Clicca "Salva" nell'angolo in alto a destra per applicare i cambiamenti;
Scegli il colore di accento
RevasOS ti dà anche la possibilità di scegliere il colore d'accento in base all'identità del marchio. Questo colore verrà utilizzato in tutti gli elementi d'accento del gruppo di siti web.
I colori trasmettono un sacco di sensazioni ed emozioni in maniera immediata: il rosso è caldo e sensuale, il giallo brillante, il verde sereno e tranquillo, l'azzurro piacevole e disteso e il nero elegante e sobrio.
Pensa a che sensazione vuoi che i visitatori del tuo sito sentano: eleganza e sobiretà, oppure energia e movimento? Certi colori sono più energici di altri, quindi se vuoi qualcosa di sobrio, elegante e tranquillo puoi scegliere colori come il blu, il verde, l'azzurro, magari in tinte neutre o poco accese. Se invece vuoi trasmettere energia, punta a rosso, arnacione, giallo o viola, magari in tinte brillanti.
Per aggiungere il colore di accento al gruppo di siti web segui questi step:
- Apri l'app Siti web in RevasOS;
- Individua il gurppo di siti a cui vuoi apportare modifiche;
- Clicca sul bottone con il nome del template scelto (ad esemptio Template default) che si trova a fianco al nome del sito sulla barra del gruppo di siti;
- Clicca sul codice hex del colore di accento;
- Inserisci il codice hex del colore di accento che hai scelto;
- Clicca "Salva" nell'angolo in alto a destra per applicare i cambiamenti;
Imposta il font
Un altro modo per personalizzare il sito web e renderlo più riconoscibile è aggiungere il font del marchio. Questo verrà utilizzato in tutte le pagine del gruppo di siti web.
Il font trasmette molta personalità in quanto ce ne sono diverse tipologie e ognuna con un suo stile grafico con una personalità distinta: immagina di visitare un sito che usa il "Times New Roma" e poi uno che usa il "Comic Sans". Quale dei due ti trasmette un'idea di maggiore professionalità, serietà e precisione? Perfetto se stai cercando un nuovo avvocato. Ma se stai cercando un servizio per organizzare una festa di compleanno, quale ti darà una maggiore idea di divertimento e gioia?
I tipi di font esistenti sono:
- Serif, ovvero quelli con i piedini e gli abbellimenti, come il "Times New Roman" o il "Merryweather",
- Sans Serif, ovvero quelli lineari e precisi senza abbellimenti, come "inter", "Calibri" o "Roboto",
- Monospace, ovvero quelli con tutte le lettere della stessa dimensione e con le spaizature uguali simili a quelli delle macchine da scrivere,
- Display, quelli molto carichi di personalità e spesso usati solo nei titoli o nelle grafiche in quanto difficilmente leggibili in piccolo.
Puoi cercare i font usandositi quali Google Fonts o Adobe Fonts se hai un piano attivo di Adobe. Qua puoi cercare tra tantissimi font.
Se vuoi, per partire possiamo partire da un font molto versatile, elegante e neutro come "Inter".
Per personalizzare il carattere del gruppo del vostro sito web segui questi step:
- Apri l'app Siti web in RevasOS;
- Individua il gurppo di siti a cui vuoi apportare modifiche;
- Clicca sul bottone con il nome del template scelto (ad esemptio Template default) che si trova a fianco al nome del sito sulla barra del gruppo di siti;
Per modificarlo, seleziona dal menu a tendina accanto alla voce Font il font predefinito che vuoi usare. Oppure attiva la spunta Usa configurazione personalizzate per usare un valore preciso. In questo caso segui questi step:
- Nel primo campo sotto alla label Font inserisci il nome del font;
- Nel secondo campo inserisci il link che porta al pacchetto di font
- Clicca Aggiorna anteprima o Salva e procedi per applicare le modifiche.
Se conosci il CSS e l'HTML, puoi anche aggiungere altri font al sito web da utilizzare in punti specifici o solo per i titoli, ad esempio, grazie all'iniezione del codice.
Definisci l'arrotondamento dei bordi
Anche se sembra un elemento secondari, in un sito web le forme geometriche sono molte e diffuse e forniscono a definire la "morbidezza" o "durezza" di un brand: un sito web con bottoni e schede dagli angoli molto arrotondati passerà un'idea e una sensazione di dolcezza, morbidezza e apertura, mentre un sito web
Altre personalizzazioni
Se conosci il CSS e l'HTML, grazie all'iniezione del codice puoi trasfromare completamente lo stile del tuo template, modificando l'aspetto di alcune sezioni o blocchi addirittura pagina per pagina.
Approfondisci
Passaggi Successivi
Ora che hai personalizzato il tuo sito web e lo hai allineato con la tua immagine di marchio, ecco cosa puoi fare: