ChiaraFrancesca Storti I m feeling web! webmarketing velenoso Web Marketing call-to-action efficaci 101 esempi di CTA di successo (parte 3) Puoi distribuire gratuitamente i miei appunti a chiunque, dal tuo sito o dal tuo blog, purchè lasci invariati contenuti, grazie. TRATTO DA 101 examples of effective calls-to-action. Storti Chiara Francesca Web Developer e Consulente SEO WebMarketing
Pagina 2 di 16 Introduzione Verso la fine del 2011 ho pensato di iniziare a trascrivere i miei appunti in modo ordinato (il più ordinato possibile), suddividendoli per tipologia e per argomento. Ed ecco che sono nati questi ebook: appunti su AdWords, appunti su Google, appunti sul Marketing, appunti sul SEO, appunti sullo Sviluppo di siti e sulle pagine web, appunti di Cucina e Giardinaggio (?!?!) insomma, un bel po di materiale, accumulato nel corso degli anni, infarcito con quanto ho raccolto e acquisito durante seminari, webminar, convegni e congressi, e dalla lettura di libri ed altri ebook, di articoli e di forum. Ma gli appunti tenuti nel cassetto non germogliano, mentre condividendoli potrebbero portare buoni frutti, quindi ho pensato che non fosse una cattiva idea condividere questo materiale nel web: gli ebook mi sembrano leggibili, interessanti e soprattutto utili utili non solo per me, ma anche per quanti di voi siano interessati a questi argomenti. Gratis?! Si, perché quando lavoro mi faccio pagare, ma quando studio, quando approfondisco un argomento, quando raccolgo informazioni, quando faccio test ed esperimenti, comincio a pensare che quanto ho appreso e preso dalla rete e dal mondo, sia giusto restituirlo, magari in qualche altra forma, non sempre in modo bilanciato alla perfezione, su altri canali o ad altre persone ma comunque restituito. Per me è importante poter dare qualcosa di mio, diffondere quel che ho raccolto, elaborato, acquisito e sfruttato, per dire il mio grazie e per contribuire, almeno in parte, al sapere liberamente fruibile in questo world wide web! Buona lettura e grazie a chi vorrà contribuire a condividere tutto ciò. Chiara Dicono di me: Una campagna AdWords sta a Chiara come il pane sta alla crema di cioccolata, come Napoli alla pizza, come Genova al pesto. Prova ad affidarle la tua strategia di web marketing e scoprirai come guadagnare, facendo fare a lei il lavoro più duro. Lei smonterà per te gli annunci, li ricomporrà per farli piacere a Google e per farti vendere di più, ancora di più, sempre di più. Ma non è tutto: Chiara si occupa anche di realizzazione e di ottimizzazione di siti web oltre alla gestione di domini internet italiani ed esteri. Dalle un mazzo di keywords: ti aprirà le porte al mondo del web(marketing) in un... click!
Pagina 3 di 16 WebMarketing call-to-action efficaci CTA è l acronimo di call-to-action: uno dei fattori principali della lead generation. La CTA in pratica collega il traffico in ingresso in una pagina web con la possibilità di ottenere delle conversioni da queste visite è il fattore chiave! Senza una buona CTA le azioni di ottimizzazione di qualsiasi campagna marketing potrebbero risultare inefficaci e non portare ai risultati sperati. L aspetto grafico delle call-to-action è uno dei primi passi per l ottimizzazione del processo di lead generation. Ecco quindi il motivo di questo ebook: vedere degli esempi reali di CTA, così come sono presentati in 101 pagine web di successo osserva i casi di successo, impara e sperimenta tu stesso Effetti spaziali Non sovraccaricare di testo e intercalari le informazioni indispensabili: usa frasi semplici, immediate, concise ed efficaci... e lascia il giusto spazio vuoto! A volte meno è meglio! Sicuramente questo concetto è valido per le call-to-action. Se vuoi attirare l attenzione su una CTA lasciale il giusto spazio, il giusto respiro attorno. Separa visivamente la call-to-action dal resto del contenuto della pagina, rendila un elemento a sé. Avvicinala solo a quegli elementi grafici o di testo che la rafforzano o che sono strettamente connessi ad essa.
Pagina 4 di 16 Per l utente diventa una scelta semplice ed immediata Questo esempio mostra una pagina semplicissima. Include una possibilità di navigazione nella parte superiore, una breve descrizione di ciò di cui si occupa l azienda, un immagine molto stilizzata ed immediata e 2 distinte call-to-action. Diventa immediato cosa si deve fare: cliccare nel menù di navigazione o scegliere direttamente una delle due CTA LEARN MORE oppure CONTACT US. Essenzialità Firefox ha rimosso tutto quello che non era indispensabile dall area della call-to-action, relegande le foto a lato ed uniformando lo sfondo, inserendo solo alcune semplici frasi ad effetto. L immagine più di impatto è quella della CTA.
Pagina 5 di 16 In una zona isolata ma in pieno risalto Anche qui la principale CTA si trova ben distanziata dal contesto e da eventuali distrazioni, che possono essere le immagini in alto o gli altri due pulsanti laterali. Cattura l attenzione anche con gli spazi vuoti Entrambe le CTA hanno abbastanza spazio libero attorno per poter catturare l attenzione dell utente con un buon margine di respiro. In questo modo si può focalizzare l attenzione sugli elementi essenziali.
Pagina 6 di 16 La quintessenza della semplicità La call-to-action di Dropbox è la quintessenza della semplicità. Gli utenti hanno solo due opzioni, immediatamente visibili e comprensibili: o guardano il video Watch a Video o scaricano il software Download Dropbox. La CTA riassume il tutto Evernote presenta un altro esempio di effetto spaziale, lasciando le informazioni raggruppate in 3 elementi, cui segue in basso il pulsante della CTA. Volendo, con un colore caldo o contrastato la si potrebbe rendere più evidente.
Pagina 7 di 16 La CTA spicca nel grande spazio a lei dedicato Grindr lascia un grande spazio vuoto attorno alla principale CTA, guidando così l attenzione degli utenti verso gli elementi principali della pagina. La CTA invita al miglioramento La call-to-action è nella zona meno densa dell immagine. Lytro agli utenti ma si limita ad invogliarli a conoscere altri dettagli Learn more
Pagina 8 di 16 Una pagina minimalista: spazio alla call-to-action Anche Path inserisce la CTA in una pagina minimalista, dove nulla distrae gli utenti dall unica operazione auspicata: Get the app. Pulizia e semplicità del layout Anche in questo esempio la pulizia e la semplicità della grafica mettono in evidenza le possibili call-to-action, differenziate l una dall altra sfruttando il colore di sfondo del pulsante.
Pagina 9 di 16 CTA e spazi bianchi Le CTA in questo caso sono posizionate in un ampio spazio bianco e vuoto. Grafica e colore Anche Skype sfrutta un design minimalista per mettere in risalto il pulsante della call-to-action, evidenziato anche da un colore vivace.
Pagina 10 di 16 Spazio e sfondo scuro Stripe ottiene lo stesso risultato mettendo il pulsante della CTA in pieno risalto su uno sfondo scuro, ben spaziato da ogni altro elemento. Una CTA a colori vivaci in un grande spazio vuoto Anche Uber in questo esempio sfrutta gli spazi vuoti per catturare l attenzione degli utenti verso la CTA, evidenziata da un colore vivace e contrastato.
Pagina 11 di 16 Lo stesso effetto anche con i banner Ovviamente è possibile ottenere lo stesso effetto di spazi vuoti e guida dell attenzione con i banner o con elementi in pagine diverse dall home page. Sfrutta le cornici semitrasparenti In questo esempio il pulsante della call-to-action ha una cornice semitrasparente, che cattura l attenzione ed aiuta a separare l elemento dal resto della pagina.
Pagina 12 di 16 Guida l attenzione Crea una traccia, fa in modo che l utente arrivi a posare lo sguardo sull elemento chiave: guida la sua attenzione. Alcuni dei casi di maggior successo sono semplicemente delle frecce che puntano alla callto-action. Si crea una traccia da far seguire all utente, per far sì che il suo sguardo e la sua attenzione cadano esattamente dove vogliamo noi. In questo modo creiamo un flusso che finisce esattamente sulla CTA. Se ad esempio usi una foto in cui un soggetto osserva in una determinata direzione, quella direzione verrà presa anche dallo sguardo dell utente: quindi nelle tue foto prediligi persone che osservano la tua CTA. Vediamo altri esempi efficaci. Nel guardare un video, lo stesso play è una freccia Anche chiedere di guardare un video è una CTA, e in questo caso oltre alla freccia che invita ad osservare il video, c è la freccia del pulsante play.
Pagina 13 di 16 Frecce verso destra La maggior parte delle frecce punta verso destra, perché è un passaggio più naturale, soprattutto in termini di lettura (per la nostra cultura, in cui si legge da sinistra a destra). Frecce che escono dalla CTA In questo esempio la freccia non va verso la CTA, ma punta a del testo esterno. In questo esempio potrebbe essere interessante modificare l immagine per vedere come potrebbe variare il tasso di conversione della call-to-action.
Pagina 14 di 16 Non solo una freccia In questo esempio ci sono ben 4 frecce, per far sì che ovunque cada l attenzione dell utente, questa poi si sposti, seguendo una di queste frecce, verso la CTA. Non servono sempre elementi grafici In questo esempio non ci sono frecce date da elementi grafici, ma viene usato un semplice carattere di testo > per indicare una direzione nella CTA.
Pagina 15 di 16 Altri elementi grafici potenziano la freccia Altri elementi grafici presenti nella pagina possono aumentare notevolmente l effetto della freccia nel catturare l attenzione dell utente. Qui l uso di elementi che sembrano disegnati a mano sono presenti sia nella freccia che nella traccia che circonda la CTA. Scegli tu la strada che l utente deve percorrere nelle tue pagine
Pagina 16 di 16 Web Marketing call-to-action efficaci hai già ottimizzato le tue CTA? contattami x informazioni o consulenze marketing e SEO Storti Chiara Francesca Web Developer e Consulente SEO WebMarketing