Whitespace, fondamentale per un buon layout
DEVSIGN TIPS - Piccoli consigli di design per gli sviluppatori
Quando a scuola consegnavamo un foglio in bianco significava solo una cosa: un brutto voto. Oltre che grossi guai a casa.
Ora che siamo cresciuti, lasciare un po’ di bianco, invece, è un bene. Soprattutto se il bianco di cui parliamo è il whitespace.
Cosa si intende per whitespace?
Il whitespace, o “spazio negativo” è lo spazio tra diversi elementi grafici. Indica sostanzialmente gli spazi vuoti di un layout e, ovviamente, non è solo di colore bianco ma può essere anche di altri colori.
Perché è così importante?
Alcuni potrebbero pensare che sia uno spreco di spazio ma non c’è niente di più falso. Il whitespace è fondamentale per un buon layout per tanti motivi:
1. Design di qualità
Dal punto di vista grafico, se usato correttamente, può cambiare l’aspetto di un sito web dandogli un’aria più moderna, elegante e di qualità. Lo spazio bianco, infatti, è strettamente legato al concetto di minimalismo e quindi di design pulito e senza elementi inutili. Basti pensare ad Apple, uno dei marchi più famosi per quanto riguarda il design minimalista o Google che utilizza lo spazio bianco per far risaltare il suo servizio.
Beh, se avete il dark mode lo spazio sarà scuro ;)
2. Creare focus d’attenzione
Isolando gli elementi a cui si vuole dare risalto, si aumenta l’enfasi. Lo “spazio vuoto” ordina la gerarchia visiva donando armonia e mette in risalto in maniera più naturale ed efficiente gli elementi dell’interfaccia catturando l’interesse dell’utente.
Lo spazio fra le colonne ed i vuoti intorno alle call to action o ai form di contatto, ad esempio, possono guidare il visitatore a seguire in maniera più fedele possibile i percorsi che si erano progettati evitando che si perda in azioni che lo allontanano dalla conversione principale.
3. Contenuti più assimilabili
Il tempo di permanenza medio dell’utente sulla pagina è inversamente proporzionale alla difficoltà percepita. Di conseguenza, testi troppo fitti o immagini troppo grandi potrebbero spingere il navigatore ad abbandonare il nostro sito. Il whitespace permette di spezzettare i contenuti per renderli più assimilabili.
4. Leggibilità
Finora abbiamo parlato sempre di whitespace inteso come “spazio bianco macro” quindi lo spazio presente nel layout. Ma esiste anche uno “spazio bianco micro” che può essere, ad esempio, l’interlinea, (se volete approfondire l’argomento c’è sempre il nostro articolo Un supereroe fa sempre la scelta giusta...con i font), lo spazio tra i paragrafi di un testo, tra l’immagine e la sua didascalia. Può essere anche lo spazio tra le parole (tracking) o singole lettere (kerning) e tutto questo migliora la leggibilità di un testo.
Tanti i motivi quindi per utilizzare un po’ di “foglio bianco” senza prendere un brutto voto, anzi! ;)
Ti interessano i nostri consigli di design? Ecco cosa ti sei perso nelle puntate precedenti:
Un supereroe fa sempre la scelta giusta...con i font.
Contattaci.
Hai in mente un progetto e vorresti realizzarlo?
Sei interessato a migliorare le competenze del tuo team in ambito di programmazione e sviluppo?
Oppure vuoi semplicemente prendere prendere un caffè con noi e vedere la nostra collezione di Action Figure, allora scrivici tramite questo form.
Se, invece, vuoi far parte del team, guarda le nostre offerte di lavoro.
Sei interessato ad un buon design per i tuoi progetti?
Anche se - semplicemente - vuoi prendere un caffè con noi o vedere la nostra collezione di Action Figures scrivici tramite questo form.
