Perché il web design non può fare a meno del copywriting

“Non sono uno scrittore”, disse il designer, usando una grammatica discutibile, mentre consegnava un incarico al copywriter.

Le immagini sono un elemento chiave del design è questo è innegabile, ma non più della parola scritta (o dell’usabilità del sistema o della tecnologia o degli altri elementi che insieme, risolvono i problemi degli utenti).

Il Copywriting è una funzione essenziale del design, che influenza l’opinione dell’utente, influenzando o meno il gradimento di un sito o di un’app.

Eppure a volte, nell’immaginario comune, si associano al copy e al designer competenze totalmente diverse o addirittura opposte, dimenticando che senza un buon copy, il design da solo, può non servire a niente.

l designer farebbero bene a demolire il muro tra la comunicazione visiva del prodotto e la sua comunicazione testuale. Alla fine della giornata infatti, farà tutto parte della stessa interfaccia che gli utenti sperimenteranno.

In questo post vorremo fornirvi 4 ragioni per cui è fondamentale che il copy e il design lavorino fianco a fianco, come si faceva una volta, la coppia creativa inscindibile.

1. Il Copy comunica direttamente con l’utente

Un visual accattivante può in senso figurato, “parlare” all’utente, ma è compito del testo parlare letteralmente con esso. Che si tratti di pagine istituzionali, dettagli del prodotto, campi modulo per un acquisto o un saluto informale, la scrittura è la distanza più breve tra te e la persona che fissa lo schermo.

Un sito o un’app può sopravvivere e anche funzionare, senza visual mozzafiato o usabilità piacevole, basta guardare Craigslist.. ma non troverai mai un sito che si basa esclusivamente su immagini. Non entreremo nella gerarchia degli elementi, ma diremo, come strumento di comunicazione, che le parole sono essenziali.

Oltre al contenuto, il copywriting soddisfa almeno sei scopi principali in uno schema di progettazione:

1. Greeting – Alcuni dei testi sulla home page (o sulla pagina di destinazione più importante) aiutano a orientare l’utente su dove si trovi, riassumono le varie sessioni e/o suggeriscono la prossima azione da intraprendere.
2. Navigazione – La maggior parte delle barre di navigazione utilizza le parole per accompagnare le icone. Può essere estremamente difficile infatti, comunicare qualcosa di astratto come “Chi siamo” con solo i simboli. Fatta eccezione ovviamente, per le icone che rappresentano metafore visive inconfondibili (es. lente di ingrandimento = ricerca).
3. Istruzioni – Non tutte le funzioni possono essere espresse con uno schema familiare o un segno visivo, probabilmente verrà un momento in cui bisognerà spiegare a grandi linee, come eseguire un compito.
4. Feedback – Quando qualcosa va storto o quando qualcosa va bene, l’utente apprezza nel ricevere notifiche.
5. Calls-to-Action – Ogni venditore conosce l’importanza del linguaggio durante la chiusura di un affare. Più veloce è la call to action, più è probabile che l’utente si fidi e clicchi.
6. Dati – A un certo punto, andranno presentati i fatti, nudi e crudi. Potrebbe trattarsi delle informazioni di contatto dell’azienda o delle labels di un form field.

Microcopia

Come consigliato nel Best Practice di Interaction Design, non bisogna mai trascurare il potere della microcopia. Decisioni come se usare “procedi” o “vai!” su un pulsante, hanno conseguenze sottili ma sostanziali, su come l’utente percepisce il prodotto e la navigazione. La microcopia può sembrare trascurabile, ma Jared Spool spiega come l’inserimento di una riga di testo, abbia contribuito ad aumentare i profitti del suo cliente di 300 milioni di dollari.

Anche se non si vuole sovraccaricare gli utenti spiegando ogni singola funzione o con commenti eccessivi, a volte, informazioni aggiuntive sono esattamente ciò che vogliono e assolutamente necessarie.

La ricerca degli utenti è il modo perfetto per determinare se alcune caratteristiche o elementi del design vengono ignorati o utilizzati in modo improprio. A volte, gli errori più comuni nell’usabilità di un sito, o di un’interfaccia confusa, potrebbero essere risolti con una singola frase ben posizionata.

2. Elementi copy e visuals complementari

Il design consiste nel fondere insieme diversi elementi, per creare un qualcosa che sia così intuitivo, da sembrare quasi invisibile. Se un designer fosse un artista, uno dei suoi colori primari sarebbe il testo. Il copy di un’interfaccia, non deve competere assolutamente con la grafica: dovrebbero lavorare in tandem, per creare la migliore user experience possibile.

Ciò significa che i toni dei due devono sempre corrispondere. A prescindere dal contenuto, il blocco di testo dovrebbe essere visivamente inserito all’interno del design: è fondamentale lavorare insieme e in contemporanea. I tanto usati lorem ipsum infatti, possono essere davvero ingannevoli, quando poi arriva il testo effettivo, succedono disastri, guerre, morti. Ignorare un approccio content-first può rovinare facilmente il design.

3. Il Copy è il content

Anche se non tutti i siti includeranno un blog o articoli di approfondimento, la maggior parte avrà comunque almeno alcuni contenuti testuali, anche se fosse solo un paragrafo nella sezione “Chi siamo”. Il testo come contenuto è dove si sprigiona la vera arte della scrittura, assumere un professionista non è un peccato mortale, anzi, è un plus ultra.

Blue Bottle’s Our Story è un ottimo esempio di come un copy intelligente, possa suscitare una risposta emotiva mentre assolve uno scopo pratico. La storia di guerra dei tempi medievali si insinua nelle menti dei lettori, dando al contempo la credibilità del marchio grazie alle sue tecniche di torrefazione secolari.

È ormai risaputo che gli utenti non leggono ogni parola presente su un sito e più blocchi di testo vedono, più è probabile che “scansionino” ciò che stanno cercando.

Ecco perché il contenuto deve essere inquadrato in un modo da facilitarne la lettura e l’assimilazione, applicando tecniche di visual design come:

• righe e colonne chiaramente definite;
• spaziatura corretta tra lettere, parole, linee e paragrafi, leggibilità e ritmo verticale;
• spazio bianco adeguato per rilassare gli occhi.

Anche in questo caso, andrebbe evitato il “lorem ipsum”, che potrebbe falsare totalmente la leggibilità, una volta inseriti i testi reali.

4. Il Copy crea il tono e la personalità

“Quello che dici non è sempre così importante come lo dici tu.”

Le frasi, i toni e la scelta delle parole influiscono sulla personalità che il design del sito trasuda. Fa tutto parte della stessa famiglia e dato che le parole sono probabilmente la strada principale per la comunicazione, le implicazioni sono grandiose. Non è sufficiente che il tono corrisponda alle immagini – il tono deve corrispondere soprattutto al prodotto.

Dopotutto, la scrittura è la voce del prodotto!

Immaginate il sito di uno studio legale, dove parole come: “difesa”, “lottiamo per”, “rappresentazione di alta qualità”, unito a un design concreto, con forme angolari e caratteri tipografici senza fronzoli, magari in maiuscolo, che marcherebbero in modo univoco la qualità e il modo di approcciarsi dello studio, dandogli forza e credibilità. Al contrario parole fuori luogo o più “casual” come “Benvenuto! Quando si tratta dei tuoi diritti, sappiamo cosa è giusto!”, probabilmente abbandonereste in tempo 0 la navigazione cercando qualcuno più “serio”!

In conclusione:

Il copywriting non dovrebbe essere qualcosa sviluppato a parte, sottovalutato e spedito a posteriori rispetto al resto del progetto, inserito forzatamente, per perdere pezzi e pezzi lungo la strada, perché nella grafica non entra.

Quando dico che il copy è un elemento di design, intendo che, in quanto tale, è più utile se si lavora in modo sincrono: visual designer, sviluppatore, copywriter. Quando si tenta di risparmiare, semplificare e sviluppare ogni elemento individualmente, intrecciarli alla fine è molto macchinoso e dannoso. Apporta ritardi, incomprensioni e notevole spreco di risorse e soldi! Il miglior design diventa coerente quando il copywriting, la grafica, l’architettura delle informazioni, ecc., lavorano insieme in armonia.