Colori e SEO: come i colori sul nostro sito web influenzano il posizionamento

Poco tempo fa un mio cliente mi disse: “Gabriele, il mio vecchio consulente seo mi ha detto di cambiare leggermente il colore blu sul sito per migliorare il posizionamento. Provi a mettere questo codice Hex xxxxxx anziché l’attuale?”. Subito pensai che al solito si trattasse della solita leggenda metropolitana sulla SEO, del tipo forza da Google Search Console l’indicizzazione più volte al giorno e il nuovo contenuto verrà indicizzato SICURAMENTE!!!, ma poi mi sono detto: proviamo, tanto non mi costa nulla (il sito non è legato ad una brand identity definita, dunque si poteva “osare” cambiando leggermente le tonalità dei colori).

Approfondendo, la questione dell’ex consulente SEO era che la tonalità di blu scelto, dagli schermi Retina, quelli dell’iPhone, era visualizzato diversamente rispetto a quello che si vedeva da altri dispositivi.

Mi sono chiesto insieme alla mia seo agency, allora, possono i colori incidere il posizionamento di un sito? E se sì, di quanto? Ho cercato su Google e ho trovato un po’ di materiale che ho deciso di vedere qui insieme nel blog e analizzarlo, oltre ad aggiungere alcune mie considerazioni personali. Iniziamo subito con un riepilogo veloce dell’utilizzo dei colori nel marketing per poi passare alla relazione con la SEO.

Il significato dei colori

E’ oramai assodato che i colori evocano differenti emozioni e sensazioni alle persone. Colori accessi come il rosso possono mettere sull’attenti un individuo, mentre i colori blu o verde possono trasmettere fiducia e rasserenare l’anima.

Tutta la “psicologia dei colori” può essere applicata quando si realizza un sito web (che come vi ricordo è parte integrante di una gestione SEO e non un optional) per far sì che il visitatore compia delle azioni sul nostro sito, dal un semplice click su un link all’acquisto di un prodotto, ad esempio.

Per farvi qualche esempio, l’utilizzo del Rosso, colore fortemente energico associato al fuoco e all’amore, mette sull’attenzione il visitatore, ma è anche un colore associato alla rabbia e al pericolo, dunque va usato saggiamente; il blu, al contrario, è il colore del cielo e del mare, viene utilizzato soprattutto dai brand che vogliono trasmettere fiducia, serenità o relax (è un colore utilizzato molto nei social network); e così via…

Come i colori migliorano la SEO

La grafica e i colori di un sito possono incidere, e qui voglio osare, indirettamente direttamente sul posizionamento dei contenuti su Google. Perché oggi più che mai, l’esperienza e il coinvolgimento di un utente sul sito incidono direttamente sul posizionamento organico.

Google stesso, infatti, ci dice che gli elementi costituenti il sito web devono essere chiari, leggibili e facilmente interpretabili dall’utente. Vi ricordate 20 anni fa quando lo spam di keyword si faceva sotto ad ogni pagina, nascondendo il testo rendendolo dello stesso colore del background? Bene, qui parliamo di qualcosa di simile. E’ ad esempio impensabile scrivere un testo in giallo su uno sfondo bianco o avere un sito web con sfondo nero e un testo in rosso o anche nascondere i collegamenti ipertestuali non evidenziandoli. Ecco cosa ci dice Google:

• Tutti i testi devono godere di Legibility & Readability (Legibility significa che i caratteri devono essere chiari, mentre Readability significa che la struttura del testo deve essere leggibile)
• Tutti i testi devono essere facilmente comprensibili;
• Tutti i collegamenti (links) interni o esterni devono essere chiaramente riconoscibili

Dunque sebbene a Google non importa nulla se stiamo utilizzando il blu anziché l’arancione, all’utente invece importa eccome. Sicuramente una buona pratica è quella di contraddistinguere i vari elementi, ad esempio le headlines e i link interni/esterni, tramite stili o colorazioni diverse, che “spiccano” rispetto al restante testo, per coinvolgere di più l’utente alla lettura. Questo come?

• Evidenziando le parti più importanti del contenuto (un po’ come l’utilizzo del grassetto);
• Mettendo in evidenza eventuali link interni o esterni;
• Rendendo chiaramente riconoscibili bottoni e CTA.

Tornando alla domanda iniziale del cliente “Provi a mettere questo codice Hex xxxxxx anziché l’attuale?”, quello che ho fatto è stato sì applicare il consiglio, ma anche quello di ragionare un po’ su tutti i colori utilizzati nel sito web. Monitorando i risultati dei giorni successivi mi sono accorto che effettivamente il numero delle pagine viste dagli utenti è leggermente aumentato, come anche è scesa la frequenza di rimbalzo.

Dunque non solo cambiando quello specifico colore, ma analizzando la combinazione dei colori utilizzati (e anche dei font), sono riuscito a rendere più leggibile il sito web e più piacevole alla navigazione. L’utilizzo dei colori ha influenzato la SEO? Sì certamente.

Prima di darvi qualche consiglio pratico da applicare vi faccio una premessa.

Quello che vi sto per dire sono tutti ragionamenti che dovrebbero essere fatti dal principio se volete portare avanti un brand. Vedo spesso siti web strafighi ma che, a parte comunicare pochissimo, utilizzano colori troppo fastidiosi e font poco leggibili. Dal punto di vista del design magari si distinguono dagli altri, ma poi funzionalmente gli utenti hanno proprio difficoltà a navigarci dentro e a reperire le informazioni che cercano. E questo per la SEO non va bene. Dunque:

• Se ancora dovete creare la vostra brand identity e scegliere i colori, ecco qualche consiglio da far prendere atto al grafico;
• Se già avete scelto la vostra brand identity, valutate se nel sito web potete fare qualche aggiustamento in modo tale che i risultati dovuti alla SEO migliorino;
• Se non ve frega nulla del brand (o magari non lo avete neanche) ma vi importa solo di aumentare il traffico organico, ricordate che il vostro sito è dinamico e solo testando e misurando si può migliorare.

Alcuni consigli pratici sulla scelta dei colori per migliorare la SEO

Sfondi: lo sfondo dovrebbe sempre essere bianco o chiarissimo, per fare contrasto con il testo scuro, possibilmente nero o grigio scuro. La stafighissima idea di avere lo sfondo nero e il testo bianco, non funziona benissimo, perché la vista “stanca” e il bianco risulta difficile da leggere alla lunga in condizioni di luce normali. Di notte invece ha senso, grazie alla modalità scura.

Testo: scelto lo sfondo, si sceglie il testo con un colore di altissimo contrasto rispetto lo sfondo così che sia più leggibile. Anche la legibility data dal font è qualcosa di estremamente importante. Se lavoro su un sito web responsive (spero che tu lo faccia sempre), assicurati che il font da mobile sia sempre leggibile.

Bottoni: I pulsanti che invitano ad un’azione, come ad esempio a chiamare un numero di telefono o a visitare la pagina dei contatti, devono essere messi ben in evidenza, con un colore che “spicca” da resto del contenuto. Il colore migliore per fare questo è l’arancione, dato che è un colore energico che si evidenzia in moltissimi contesti. Altri colori utilizzati per i bottoni e CTA sono il giallo (ma solo su sfondi scuri), il rosso scuro e il verde. Ovviamente se avete già scelto delle combinazioni di colori, potete utilizzare il colore più energico trovato nella palette per i bottoni. I colori utilizzati per i pulsanti delle CTA dovrebbero essere utilizzati solo qui e non in altre parti del testo.

Link interni / esterni: anche qui, il colore scelto per questi elementi deve essere ben visibile rispetto al testo normale, perché è importante che l’utente sappia che lì c’è un collegamento e ci può cliccare. Più gli utenti cliccano e fanno azioni, anche grazie all’utilizzo dei colori, più Google capisce che quel contenuto è utile. Vogliamo aiutare i nostri lettori ad interagire con il contenuto? Utilizziamo i colori giusti! 

Altri elementi grafici: menù, bullet point, divisori, icone, footer ecc.. devono essere il più possibile messi in evidenza (non utilizzare lo stesso colore dei bottoni e CTA). Perché? Perché gli utenti devono subito capire qual è il menù (raga, ho visto menù “ad hamburger” in grigio tenue su sfondo bianco, che neanche si capiva fosse cliccabile), dove si trova il footer (gli utenti cercano i contatti lì), e anche capire quali sono le particolarità dei prodotti e servizi che offrite.

Ci sono colori da evitare? Nì, nel senso che tutti i colori utilizzati bene e con moderazioni hanno il loro perché, ma appunto occorre non esagerare e far scappare gli utenti 3 secondi dopo che aprono il sito web per via della scelta di colori inopportuni, pesanti e fastidiosi alla vista.

Miglioramento del Bounce e Tempo Medio

Il dato più importante che si può analizzare nei giorni successivi al cambio dei colori è il Bounce Rate o Frequenza di Rimbalzo.

Premesso che ogni modifica ai colori deve essere fatta separatamente e non tutte insieme (prima testo un nuovo colore per le CTA, poi per i link, e così via…), occorre monitorare e leggere i risultati. Il cambio colore della CTA potrebbe banalmente spingere più utenti a cliccare e tu vedere le vendite aumentare!

Anche un cambio colori di link interni potrebbe spingere gli utenti ad interagire di più con il sito web e a leggere più pagine del sito, incrementando i tempi medi di permanenza.

Per Google i contenuti interessanti da mettere nei primi posti sono quelli reputati interessanti dagli utenti: più interazioni, anche grazie all’utilizzo corretto dei colori, più pagine viste, maggiore tempo medio di permanenza sulle pagine, maggiore possibilità di posizionarsi meglio.

Un piccolo consiglio pratico da fare subito: tramite Google Tag Manager potete tracciare l’interazione di un utente con i bottoni e CTA del vostro sito. Se tutti i bottoni del vostro sito hanno la stessa ID class o style uguale (a cui per forza di cose è associato lo stesso colore) potete crearvi un Tag con un Attivatore che si attiva quando si clicca sopra.

Se avete abbastanza storico di dati e cambiate il colore delle CTA per un test, vi sarà facile monitorare l’evento click su tutti i bottoni con GA4 (prendete come riferimento principalmente il traffico organico, è meglio) per capire se un dato colore ha migliorato o peggiorato l’esperienza degli utenti. Ovviamente vi ripeto: cambiate solo il colore e non altri elementi nella pagina, per non influenzare il test.

Conclusioni

Abbiamo fatto una brevissima panoramica sulla psicologia dei colori, argomento veramente largo che potete approfondire meglio da altre fonti, e come l’utilizzo dei colori condiziona il posizionamento organico.

La scelta di colori consapevoli e l’applicazione di tali sui contenuti del sito web, permette certamente un miglioramento del coinvolgimento del nostro pubblico, con conseguente incremento dell’Authoritativeness, il paramento relativo all’autorevolezza del contenuto preso oramai in considerazione da Google per il ranking (EAT).

Fonti:

https://danieltitus.com/blog/seo/172-does-color-affect-seo

https://searchengineland.com/how-color-affects-search-engine-optimization-seo-138393

https://bippermedia.com/color-psychology-does-color-affect-seo/