Come configurare le Heatmap di WordPress (2 modi semplici)

Quando ho iniziato a elaborare in corso i miei siti web su WordPress, perlopiù indovinavo cosa volessero i visitatori. Solo quando ho iniziato a usare le heatmap ho capito veramente come le persone interagivano con il mio sito: dove facevano clic, quanto scorrevano e cosa effettivamente attirava la loro attenzione.

Se state cercando di migliorare il vostro sito WordPress ma non siete sicuri di cosa stia funzionando e cosa no, le heatmap possono darvi delle risposte.

Dopo aver testato diversi strumenti nel corso degli anni, ho ristretto il campo a due modi semplici per impostare le heatmap su WordPress: Microsoft Clarity e UserFeedback.

In questa guida, illustrerò passo dopo passo ogni processo di configurazione. Alla fine, avrete gli strumenti necessari per apportare modifiche al vostro sito basate sui dati. 🔥

Perché è necessario impostare le Heatmap di WordPress?

Una mappa di calore è uno strumento visivo che mostra esattamente come i visitatori interagiscono con il vostro sito web WordPress. Utilizza la codifica dei colori per evidenziare le aree più e meno attive di una pagina:

• Learee rosse, arancioni e gialle (aree “calde”) mostrano dove i visitatori cliccano, toccano o trascorrono più tempo.
• Ilblu e il verde (aree “fredde”) mostrano i punti che ricevono poca o nessuna attenzione.

Vedendo questa attività mappata, si può smettere di tirare a indovinare chi siamo e cosa non funziona. In altre parole, le heatmap aiutano a eliminare le congetture, fornendo indicazioni chiare sul comportamento dei visitatori.

Vi aiutano a rispondere a domande importanti, come ad esempio:

• Le persone fanno clic sui vostri pulsanti CTA?
• Scorrono abbastanza in basso per vedere i vostri contenuti?
• Stanno facendo clic su cose che non servono a nulla?

Grazie a queste informazioni, potrete apportare modifiche intelligenti al vostro sito. Saprete cosa correggere, cosa spostare e cosa migliorare.

È possibile utilizzare questa conoscenza per ottenere più lettori, incrementare le vendite o aumentare le richieste di potenziali clienti, il tutto apportando semplici modifiche on il modo in cui le persone utilizzano effettivamente il sito.

Nelle sezioni seguenti, condividerò come impostare le heatmap di WordPress utilizzando 2 dei migliori strumenti per l’aggiunta di heatmap. Uno è completamente gratuito, l’altro è un’opzione premium con caratteristiche aggiuntive.

Utilizzate i link sottostanti per accedere al metodo che preferite:

Fase 0: Preparazione del sito WordPress per le Heatmap

Prima di aggiungere le heatmap al vostro sito WordPress, importa assicurarsi che il sito sia adeguatamente preparato. L’adozione di alcune misure precauzionali può aiutare a prevenire eventuali problemi durante l’avvio.

Se state aggiungendo le heatmap al vostro sito live per la prima volta, è una mossa intelligente testare tutto prima su un sito di staging.

Un sito di staging è essenzialmente un duplicato del vostro sito web live, dove potete apportare modifiche e testare nuove caratteristiche senza influenzare il vostro sito web reale. Permette di provare nuovi strumenti, come le heatmap, in modo sicuro, senza rischiare di interrompere l’esperienza dell’utente.

Quindi, è sufficiente inviare le modifiche per applicarle al sito web reale.

Se utilizzate Bluehost, potete creare facilmente un sito di staging, grazie alla soluzione rapida con un clic.

Detto questo, se non avete accesso allo staging tramite il vostro host, potete anche usare plugin come WP Stagecoach per creare siti di staging.

Per una panoramica completa, potete consultare la nostra guida su come creare un sito di staging per WordPress.

Inoltre, prima di apportare modifiche importanti, eseguite sempre un backup del sito. Un backup assicura che, nel caso in cui qualcosa vada storto durante il processo di configurazione, sia possibile ripristinare facilmente il sito allo stato precedente senza perdere dati importanti.

Infine, ricordate che le heatmap funzionano meglio se utilizzate insieme ad altri strumenti di analisi e ai feedback degli utenti.

Consideratele un punto di partenza per scoprire potenziali problemi o opportunità, non l’unica fonte di informazioni. Combinando gli insight delle heatmap con dati più ampi si ottiene un quadro più chiaro e accurato di come i visitatori interagiscono con il sito.

Metodo 1: Impostazione delle Heatmap di WordPress con Microsoft Clarity

Microsoft Clarity è uno strumento gratuito e facile da usare per la creazione di mappe di calore e la registrazione delle sessioni che si integra perfettamente con WordPress. È il migliore per l’analisi generale del sito, ideale per i principianti, i blogger e i proprietari di piccole imprese che vogliono capire il comportamento dei visitatori.

Ecco perché lo usiamo in alcuni siti web dei nostri partner per tracciare le heatmap e ottenere informazioni sulle interazioni degli utenti.

Passo 1: creazione di un account gratuito Microsoft Clarity

Per impostare le heatmap di WordPress con Microsoft Clarity, è necessario innanzitutto disporre di un account.

Andate sul sito web di Microsoft Clarity e fate clic su “Inizia”.

Nel popup che appare, vedrete che potete iscrivervi con un account Microsoft, Facebook o Google. Fate clic su quello che preferite.

Per questa esercitazione, selezionerò “Accedi a Google”.

Dopodiché, è possibile seguire il processo di iscrizione scegliendo l’account appropriato.

Quindi, fare clic su “Continua” nella pagina di conferma.

Al momento dell’iscrizione, vi verrà chiesto di confermare il vostro indirizzo email.

Non dimenticate di selezionare i termini d’uso di Clarity e di fare clic sul checkbox prima di continuare.

Verrà quindi richiesto di creare un nuovo progetto per il sito WordPress.

È sufficiente dare un nome al progetto, inserire l’URL del sito web e scegliere il settore dal menu a discesa.

Fatto questo, fate clic su “Aggiungi nuovo progetto” per terminare la configurazione.

Fatto questo, siete pronti a installare il plugin Microsoft Clarity WordPress per impostare le heatmap sul vostro sito web.

Passo 2: Installare Microsoft Clarity nel sito WordPress

In questa fase, installerete il plugin Microsoft Clarity e lo collegherete all’account appena creato.

Dalla dashboard di WordPress, andiamo su Plugin ” Aggiungi un nuovo plugin.

Utilizzate la barra di ricerca per trovare rapidamente il plugin Microsoft Clarity.

Basta cliccare su “Installa ora” nel risultato della ricerca e su “Attiva” quando appare.

Per istruzioni passo passo, consultate la nostra guida su come installare un plugin di WordPress.

Dopo l’attivazione del plugin, il passo successivo è la scelta di un progetto Clarity per collegare entrambi gli strumenti.

È possibile navigare in Clarity dall’area di amministrazione di WordPress e scegliere il progetto appena creato dal menu a discesa.

Nei secondi successivi, dovrebbe apparire la notifica “Progetto integrato con successo”.

Per maggiori dettagli, potete consultare la nostra guida su come installare Microsoft Clarity Analytics in WordPress.

💡 Nota: se si utilizza un plugin per la cache di WordPress, è necessario cancellare la cache di WordPress dopo aver collegato Microsoft Clarity al sito web. Questo importa perché, altrimenti, Microsoft non sarà in grado di verificare il sito per alcune ore.

Fase 3: Impostazione delle Heatmap in Microsoft Clarity

Una volta collegato a Microsoft Clarity, questo inizierà automaticamente a tracciare i visitatori, senza bisogno di incollare manualmente alcun codice o di modificare i file del tema.

All’interno della vostra Bacheca di Clarity, troverete utili report che vi daranno una panoramica di come le persone interagiscono con il vostro blog o sito WordPress.

Alcune delle metriche chiave includono:

• Sessioni – Mostra il numero di visite individuali ricevute dal sito.
• Pagine per sessione – Indica il numero di pagine visualizzate da un visitatore durante una sessione.
• Profondità di scorrimento – Mostra quanto gli utenti scorrono giù per ogni pagina.
• Tempo di attivazione: tiene traccia del tempo in cui gli utenti si impegnano attivamente sulla vostra pagina (non solo lasciandola aperta in una scheda in sfondo).

Troverete anche widget precostituiti come la “Panoramica degli utenti”, che mette in evidenza i tipi di visitatori e i dispositivi.

Inoltre, ci sono approfondimenti comportamentali come i rage click (quando gli utenti cliccano ripetutamente per frustrazione) e lo scrolling eccessivo (quando gli utenti scorrono troppo, forse alla ricerca di qualcosa).

Per vedere le mappe di calore, passare alla scheda “Heatmaps”.

Una volta entrati, vedrete un elenco di tutte le heatmap delle pagine che Clarity ha registrato automaticamente.

Basta fare clic su una pagina che si desidera analizzare.

Una volta aperta una mappa di calore, vengono visualizzate tre visualizzazioni principali: Cliccati, Scorrimento e Attenzione.

È possibile passare a “Click” per vedere dove i visitatori fanno più clic.

Per conoscere la profondità di scorrimento, basta spostarsi sulla scheda “Scorrimento”.

Qui Clarity rivela quanto gli utenti scorrono giù per la pagina. Questo aiuta a identificare se si perdono i contenuti chiave.

Infine, fate clic sul pulsante“Attenzione” per vedere il tempo medio che i visitatori trascorrono sulle diverse parti della pagina.

Le zone rosse indicano una maggiore attenzione, mentre le aree blu ne ricevono meno.

È tutto: avete impostato con successo le heatmap di WordPress utilizzando Microsoft Clarity!

Metodo 2: Impostare le Heatmap di WordPress utilizzando UserFeedback

UserFeedback di MonsterInsights combina feedback in stile heatmap con sondaggi e targeting avanzato. È un’opzione potente per siti web in crescita, negozi online e agenzie che necessitano di approfondimenti e di un maggiore controllo sulle modalità di raccolta dei feedback dei visitatori.

Noi di WPBeginner abbiamo utilizzato UserFeedback per capire cosa vogliono e si aspettano da noi i nostri clienti che si occupano di web design. Abbiamo avuto un’ottima esperienza e potete selezionare la nostra recensione completa di UserFeedback per capire perché lo raccomandiamo!

Passo 1: Installazione e attivazione di UserFeedback

Innanzitutto, è necessario impostare un account UserFeedback. Per farlo, visitate il sito web di UserFeedback e iscrivetevi a un piano.

Dopo aver firmato un account, sarete reindirizzati alla dashboard del vostro account UserFeedback, dove troverete il link per scaricare il file zip di UserFeedback e la chiave di licenza.

Ora è il momento di installare il plugin.

Dalla dashboard di WordPress, è necessario andare su Plugin ” Aggiungi nuovo.

Nella schermata successiva, cerchiamo UserFeedback.

È quindi possibile installare e attivare il plugin come qualsiasi altro plugin di WordPress.

Novità: l’installazione dei plugin? Ecco una guida dettagliata su come installare un plugin di WordPress.

Una volta attivato, è possibile inserire la chiave di licenza per sbloccare tutte le caratteristiche pro del piano.

Per farlo, si può navigare in UserFeedback ” Impostazioni. Quindi, è sufficiente copiare e incollare la chiave di licenza dalla propria UserFeedback nel campo “Chiave di licenza”.

Fate clic sul pulsante “Verifica” per avviare il processo di verifica.

In pochi secondi dovrebbe apparire un messaggio di successo della verifica.

Passo 2: Abilitare l’add-on Heatmaps

Ora andiamo su UserFeedback ” Add-on per installare l’addon Heatmaps.

È sufficiente scorrere giù la pagina per trovare l’add-on Heatmaps e fare clic su “Installa add-on” nell’apposita casella.

Una volta installato, assicurarsi che sia attivato facendo clic sul pulsante “Attiva”.

Fase 3: Creare una nuova mappa di calore

Con l’add-on Heatmaps attivato, è ora possibile creare la mappa di calore del sito.

Andiamo su UserFeedback ” Heatmaps nella vostra dashboard di WordPress e facciamo clic sul pulsante ‘Nuova Heatmap’.

Nel popup che appare, espandere il menu a discesa per selezionare la pagina specifica che si desidera monitorare. Ad esempio, è possibile creare una mappa di calore per la homepage, la landing page o la pagina pubblica.

Per impostare la mappa di calore, premere il pulsante “Crea”.

Fase 4: Visualizzare i risultati della mappa di calore

Dopo aver creato una mappa di calore, UserFeedback inizierà a raccogliere immediatamente i dati degli utenti.

Andiamo su UserFeedback ” Heatmaps e facciamo clic su una heatmap per vedere i dettagli visivi.

Nella schermata successiva, potrete visualizzare informazioni dettagliate su chi siamo, tra cui:

• Filtro dispositivi – Confronta il comportamento degli utenti su desktop, tablet e dispositivi mobili.
• Cliccati – Per vedere esattamente dove le persone fanno clic sulla vostra pagina.
• Movimenti del mouse – Traccia il modo in cui gli utenti muovono il mouse sulla schermata.

Se il sito viene promosso attraverso più canali, è possibile filtrare i dati per campagna UTM, fonte o medio. In questo modo è possibile capire come i visitatori provenienti da diverse attività di marketing interagiscono con il sito.

E questo è tutto: avete impostato con successo le heatmap di WordPress utilizzando UserFeedback!

Passi bonus: Massimizzare le intuizioni della Heatmap 🔥

Le heatmap sono utili solo se sapete come agire su ciò che vi dicono. Ecco come trasformare le intuizioni delle vostre heatmap in miglioramenti reali per il vostro sito WordPress.

Correggete il punto in cui i visitatori si fermano

È possibile utilizzare le mappe di scorrimento per vedere quanto in basso vanno i visitatori su una pagina. Se un contenuto importante è sepolto troppo in basso nella pagina, la maggior parte delle persone potrebbe non vederlo mai.

Si può provare a spostare gli elementi chiave, come le CTA o le offerte, più in alto nella pagina e a suddividere le pagine più lunghe con sezioni più piccole e headings cancellati. È inoltre possibile utilizzare filtri data per monitorare l’impatto di queste modifiche sul comportamento dei visitatori nel tempo.

Questo piccolo cambiamento può ridurre la frequenza di rimbalzo e mantenere i visitatori impegnati più a lungo.

Individuare e risolvere la confusione dell’utente

A volte i visitatori cercano di fare clic su immagini, icone o testi che non sono cliccabili. Questo dimostra che sono confusi o che si aspettano qualcosa di diverso.

È possibile esaminare le mappe dei clic e i movimenti del mouse per individuare queste aree. Se necessario, è possibile linkare le immagini o aggiungere pulsanti nelle vicinanze per facilitare gli utenti.

È anche possibile impostare un rapido sondaggio con UserFeedback per chiedere agli utenti cosa si aspettavano di trovare.

Identificare e correggere i problemi di navigazione

Se vedete che i visitatori saltano spesso da una pagina all’altra senza una direzione cancellata, è segno che la navigazione potrebbe essere confusa.

Semplificate la navigazione assicurandovi che le informazioni siano facili da trovare e correggendo tutto ciò che potrebbe causare confusione. Potete anche ripercorrere i passaggi che importano sul vostro sito come se foste un primo visitatore, per assicurarvi che tutto funzioni correttamente.

Si consiglia di consultare anche la nostra guida su come creare un menu di navigazione personalizzato in WordPress.

Rendete i vostri pulsanti CTA impossibili da perdere

Se i vostri CTA (pulsanti di invito all’azione) non fanno abbastanza clic, vi consiglio di modificarne il colore, il testo o il posizionamento per farli risaltare di più.

Utilizzate gli insight sui movimenti del mouse per individuare le esitazioni prima di fare clic e controllate i filtri dei dispositivi per assicurarvi che le CTA siano visibili e facili da cliccare su tutti i dispositivi, in particolare quelli mobili.

Spero che questo articolo vi abbia aiutato a impostare le heatmap di WordPress. A seguire, vi invitiamo a leggere i nostri consigli sulle landing page per aumentare le conversioni su WordPress e la nostra guida definitiva sul targeting geolocalizzato.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.