Copywriting e tipografia: suggerimenti per una buona impaginazione web e offline
Ecco una serie di suggerimenti per impaginare in modo vincente i tuoi testi e le tue presentazioni online e offline
Stai completando la tua presentazione ma non sai come disporre il testo nel modo migliore? Hai paura che la tua brochure non venga letta da nessuno perché c’è troppo testo oppure parti del copy non si leggono bene?
Non c’è niente di più svilente per un copywriter che trovarsi con un buon lavoro fatto ma poi non ottenere buoni risultati in termini di lettura perché il testo non era ben impaginato o leggibile. L’obiettivo è di evitare quella che nel gergo della user experience si chiama frizione: la fatica che il lettore-utente deve fare per portare a termine un determinato compito su una interfaccia; nel nostro caso il copy. È necessario quindi trovare alcune soluzioni per evitare lo stress cognitivo e la fatica da lettura. Soprattutto se stiamo parlando di un contenuto promozionale che deve attirare l’attenzione.
Ecco allora alcuni consigli che arrivano direttamente dal mondo della tipografia da applicare ai tuoi copy! Questi tips sono validi sia per contenuti che finiranno stampati (una presentazione, una brochure, un visual promozionale, una locandina eventi, etc) sia per prodotti web (la home di un sito). Al fondo, un ultimo suggerimento extra valido per blog e siti web.
Ma adesso, dritti al punto!
#1 ALLINEAMENTO A SINISTRA
Nelle culture occidentali scriviamo da sinistra verso destra. In questo modo il nostro cervello ha sviluppato metodi sempre più rapidi per leggere (e comprendere) un testo, riconoscere subito il margine e seguirne il passo. Per questo è consigliabile utilizzare l’allineamento a sinistra, detto anche “a bandiera”; per intenderci, quello con il margine destro variabile. Questo allineamento favorisce la fluidità della lettura, essendo noi portati a leggere in tale verso. In alternativa, se stiamo per impaginare lunghi testi che andranno stampati (ad esempio un libro o un white paper aziendale) si può utilizzare il classico allineamento giustificato (in termini tipografici “a pacchetto”), dove da entrambi i lati il testo rientra all’interno dei margini. Tuttavia, con quest’ultima disposizione bisogna fare attenzione al programma che utilizzere per impaginare il documento (con buona pace dei linotipisti!).
Mentre alcuni programmi ad hoc come Illustrator o InDesign bilanciano in modo automatico le parole all’interno delle righe, spostando su o giù le parole in eccesso, altri programmi di uso più generico come Canva tendono a lasciare lo stesso numero di parole all’interno della riga, lasciando a volte quei fastidiosi (e orribili esteticamente) spazi bianchi tra le parole.
Dunque, fate attenzione al programma che usate!
#2 USA UN SOLO FONT
Il consiglio è di scegliere un font adatto per il vostro testo e utilizzare solo quello. Ogni font ha le sue caratteristiche tipografiche come la crenatura, spaziatura, grazie, occhielli, l’altezza dell’occhio, etc; insomma, elementi che rendono un carattere unico rispetto ad un altro (sebbene in alcuni casi le differenze siano minime e millimetriche). L’adozione di font diversi per lo stesso copy è uno sforzo visivo maggiore per l’occhio e per la leggibilità.
Ci sono eccezioni alla regola, ovviamente. Si possono utilizzare due font diversi per headline e body-copy, ad esempio un titolo in serif e il testo in sans-serif. Un altro caso invece è quello di brevissimi testi, come una copertina di una presentazione o un banner, dove la leggibilità del testo viene meno e l’obiettivo è quello di attirare l’attenzione. Ecco un esempio qui sotto.
#3 SALTA LE MISURE
Ogni font ha una serie di misure che vanno dal più fine e sottile al più spesso e scuro: Thin, ExtraLight, Light, Regular, Medium, SemiBold, Bold, ExtraBold, Black. Non tutti i font però sono disegnati con l’intera gradazione (alcuni potrebbero avere solo light, regular, medium e bold).
Il suggerimento in questo caso è di “saltare una misura”: passa da light a bold, o da medium a extra bold. Perché? Questo salto serve per aumentare il contrasto: l’occhio del lettore non nota le piccole differenze, ma il salto di una o più misure rende il contrasto più visibile (dunque ci si può focalizzare su alcune parti del testo e farle risaltare).
Prima però controlla quanti livelli di stile possiede il font che stai per utilizzare per la tua impaginazione.
#4 CREA UN RAPPORTO 2/1 TRA HEADLINE E BODY-COPY
Se stai lavorando su una presentazione o su un visual promozionale dai il giusto peso al titolo (la headline) e al testo (body-copy). L’ideale è mantenere un rapporto 2/1 tra headline e copy. Se il titolo ha una dimensione di 60pt, il testo sarà di 30pt; se invece è di 90pt, sarà 45pt, e così via. Un rapporto maggiore o minore potrebbe pesare sulla leggibilità e non fornire la giusta corrispondenza tra elementi.
#5 RAGGRUPPA GLI ELEMENTI UTILIZZANDO LINEE E BLOCCHI
Elementi grafici come linee e blocchi rendono il documento piacevole da vedere, ordinano il testo in diverse sezioni e mettono in risalto le parti più importanti. Occhio però a non esagerare; troppi elementi grafici potrebbero stancare facilmente l’occhio del lettore e spingerlo ad abbandonare la lettura.
#6 EVITA IL TESTO NEGLI ANGOLI ESTREMI DEL DOCUMENTO (BANALE #1)
Utilizziamo le parti bianche di un testo per orientarci. Come per una composizione fotografica, il testo disposto agli angoli estremi del documento risulta poco leggibile e difficile da leggere per il lettore. Inseriamo invece il testo nelle parti centrali, creando un’armonia tra spazi bianchi e copy.
#7 ASSICURATI UNA BUONA SPAZIATURA E INTERLINEA
La spaziatura tra le lettere è di fondamentale importanza per la leggibilità di un testo, soprattutto quando questo viene letto da lontano o da dispositivi mobile, dove lo schermo riduce inevitalmente le dimensioni. Assicurati di dare il giusto spazio alle lettere. In questo caso un elemento di differenza lo svolge il font. Ogni carattere ha una sua forma e quindi una spaziatura diversa. Prova a leggere il testo da lontano e controlla se c’è lo spazio giusto tra le lettere.
Discorso analogo vale per l’interlinea, cioè lo spazio tra una riga e l’altra. Una interlinea troppo ridotta appesantisce il testo e sforza parecchio l’occhio (anche se si tratta di poche righe di testo); allo stesso modo, un’interlinea eccessiva potrebbe disperdere eccessivamente il testo e perdere continuità nella lettura.
#8 LASCIA UN PO’ DI SPAZIO BIANCO PER FAR RESPIRARE IL TESTO
In linea con il suggerimento numero #6, gli spazi bianchi orientano il lettore nelle diverse parti del documento. Nel caso di lunghe pagine di testo, un po’ di spazi bianchi aiutano ad evitare il cosiddetto muro di testo, l’intera pagina di testo senza paragrafi che abbatte psicologicamente anche il più avido lettore.
Questa regola è consigliabile non solo per intere pagine, ma anche per presentazioni, locandine e brochure. Ecco un esempio qui sotto.
#9 ORGANIZZA IL TESTO IN RIGA: NON LASCIARE SINGOLE PAROLE SULL’ULTIMA RIGA
Se stai usando l’allineamento a sinistra, struttura bene le frasi di ogni riga. Non troncare le proposizioni lasciando un’unica parola sull’ultima riga. In gergo tipografico questo fenomeno si chiama vedova. Lasciando da sola una parola la frase potrebbe perdere effetto e continuità, salvo che si tratti di esperimenti creativi!
#10 USA LO SPAZIO DOPO LA PUNTEGGIATURA (BANALE #2)
Secondo suggerimento banale, ma a volte capita di vedere questi errori stampati o su una presentazione. Ricordiamoci di lasciare lo spazio dopo tutti i segni di interpunzione.
#BONUS 1 PER BLOG O SITO WEB: OCCHIO ALLA DISPOSIZIONE DEGLI ELEMENTI
Bonus e off-topic (non troppo, in realtà) non strettamente correlato con la tipografia. Questo suggerimento è per coloro che si occupano di curare il layout di un blog o del proprio sito personale. Qui ci vengono in soccorso le indagini svolte dal neuromarketing, che si occupa di studiare i processi che avvengono nella mente dei consumatori - soprattutto quelli inconsapevoli - riguardo le decisioni di acquisto (qui il sito della comunità italiana di neuromarketing).
Grazie a questi studi è possibile comprendere il “viaggio” che la maggior parte degli utenti compie quando visita una pagina web. I due modelli che se ne ricavano sono quello a “F” e quello a “Z”. Vediamoli con gli esempi qui sotto.
Quando gli utenti visitano la home-page del vostro sito, i loro occhi faranno un percorso che ricorda la forma della lettera F (passando dal punto 1 in alto a sinistra al punto 2 in alto a destra; successivamente al punto 3, leggendo il paragrafo e poi giù fino al tasto di call to action). Dunque, nel caso di blog o siti web con contenuti testuali il suggerimento è quello di fare attenzione alla disposizione dei propri contenuti, considerando anche la differenza tra laptop e mobile (nel mobile probabilmente la F sarà più alta, per via della forma del monitor e della tendenza dell’utente allo scrolling).
Il secondo modello invece riguarda blog o siti con contenuti prevalentemente visuali (come può essere un e-commerce). In questo caso il percorso che l’utente compie ricorda una lettera Z, partendo dall’angolo in alto a sinistra verso destra (dal punto 1 al 2) e scendendo diagonalmente verso il punto 3 per poi proseguire verso il tasto di call to action.
Ecco dunque 10 suggerimenti (+1) tratti dalla tipografia che possono venirci in soccorso nel momento di impaginare i nostri documenti.
Se invece sei alle prime armi con il copywriting, qui puoi trovare una serie di suggerimenti per una scrittura più fluida e incisiva; oppure, se stati per scrivere il tuo primo payoff ma non sai come muoverti, ecco alcuni consigli su come creare un micro-copy originale e vincente!
Puoi seguirmi su | LinkedIn | Medium | SlideShare |
