Ho appena terminato di fare un controllo sulle heatmap del mio sito web per verificare da vicino il comportamento dei visitatori. E ho scoperto dei dati interessantissimi che mi hanno permesso di vedere cosa fanno esattamente gli utenti all’interno delle mie pagine.
La mappa di calore è uno strumento che utilizzo durante il mio servizio di analisi sito web che punta sul migliorare le performance, l’user experience e i risultati del sito.
Cos’è una heatmap
Una heatmap, o mappa di calore, è una rappresentazione visiva che traccia e analizza il comportamento degli utenti su una pagina web, evidenziando con una scala cromatica le aree di maggiore interazione, come click, movimenti e scroll, per offrire un’immagine chiara di come i visitatori navigano il sito.
Grazie alla heatmap, puoi visualizzare i punti più cliccati delle pagine web. Addirittura, i tool più avanzati ti consentono anche di vedere esattamente cosa fanno gli utenti attraverso la registrazione degli schermi.
Con le mappe di calore moderne, puoi capire se gli utenti hanno difficoltà a leggere articoli lunghi e se riescono a scorrere fino in fondo alla pagina. Puoi anche vedere se si soffermano su specifiche sezioni, come un box con una call to action, oppure se interagiscono con determinati elementi.
La mappa di calore utilizza una scala cromatica per evidenziare le aree di interazione:
Le zone più calde, rappresentate da colori che vanno dal rosso all’arancione, indicano le parti della pagina con il maggior numero di click.
Le zone più fredde, evidenziate da sfumature che vanno dal blu al verde, mostrano le aree con minori interazioni.
I trigger delle heatmap
Ogni strumento ha caratteristiche specifiche, ma generalmente le mappe di calore si attivano in base a determinati eventi:
- Click: la mappa di calore evidenzia le aree più cliccate di una pagina, che possono includere link, immagini o spazi vuoti.
- Scroll: misura lo scorrimento verticale della pagina, mostrando fino a quale punto gli utenti arrivano.
- Movement: registra i movimenti del mouse, visualizzando lo spostamento del cursore (o del dito nei dispositivi touch screen) all’interno della pagina.
Perché e quando utizzare le mappe di calore
Personalmente utilizzo le heatmap come strumento aggiuntivo in una strategia di analisi di un sito web. È uno strumento che attivo all’occorrenza, quando desidero migliorare una pagina o capire se ci sono problemi di navigabilità o di conversione.
Le mappe di calore sono uno strumento aggiuntivo rispetto al tracciamento delle visite che facciamo con strumenti come Google Analytics. Mentre quest’ultimo ci indica quali pagine vengono visualizzate, per quanto tempo gli utenti rimangono su una pagina e da dove provengono le visite, le heatmap permettono un’analisi molto più dettagliata.
Per esempio, un articolo del mio blog ha una media di tempi di permenenza superiore ai 3 minuti. Il testo è abbastanza lungo e super approfondito. Grazie alle heatmap ho potuto osservare il comportamento degli utenti su quella pagina. Alcuni leggono attentamente, mentre altri mostrano periodi di inattività, probabilmente dovuti a distrazioni o multitasking.
Ecco alcuni esempi che mi vengono in mente per cui dovresti prendere in considerazione l’installazione di una heatmap:
1. La landing page non converte
Hai creato una pagina con i fiocchi, giureresti che il copy e il design siano un gioiellino, ma non c’è alcun lead all’orizzonte. Con una heatmap che registra ogni movimento, puoi verificare innanzitutto se l’utente si sofferma in una o più sezioni, poi se clicca sui pulsanti che contano e infine se abbandona la pagina in un determinato punto.
2. Gli utenti non navigano il sito
Durante il monitoraggio del sito web ti sei accorto che la frequenza di rimbalzo è ai massimi storici. Controlli il sito da tutti i dispositivi e browser possibili, per giunta anche da navigrazione anonima, ma è tutto nella norma. Eppure, nessuno va oltre la pagina di atterraggio. Con una heatmap installata sul tuo sito web, puoi verificare cosa fanno gli utenti una volta arrivati sulle tue pagine o articoli del blog.
Leggono fino in fondo, scorrono velocemente in cerca di qualcosa che non trovano, leggono le prime due righe e abbandonano immediatamente? Si soffermano sui menu, link interni, articoli correlati e poi non cliccano?
3. Il processo di acquisto si blocca in fase di Checkout
Hai una sales page ben strutturata, in cui il prezzo e le condizioni di vendita sono chiaramente visibili. Gli utenti cliccano sul pulsante “aggiungi al carrello” e raggiungono la fase di checkout, ma qui la vendita si interrompe. Considerando che, per motivi di privacy e conformità al GDPR, i tool di heatmap non registrano dati sensibili e oscurano tutti i form, inclusi quelli di pagamento, puoi comunque sfruttare le mappe di calore per analizzare il comportamento degli utenti all’interno della pagina di checkout. Questo ti permetterà di capire meglio dove si verificano le difficoltà e quali elementi possono essere ottimizzati per migliorare le conversioni.
Quali interazioni monitorare con una mappa di calore
Le heatmap ci danno in mano dei preziosi dati e ci mostrano come interagiscono gli utenti in determinate pagine, sta a noi umani incrociare i dati e trovare le soluzioni per migliorare l’UX e le conversioni del sito.
Ecco alcuni comportamenti degli utenti che tendo a monitorare maggiormente grazie alle heatmap:
- Cliccano sulle voci del menu o aprono l’hamburger menu da mobile
- Scorrono la pagina fino in fondo oppure abbandonano la pagina sin dalle prime righe
- Cliccano sulle call to action di pulsanti e link
- Scorrono la pagina velocemente senza soffermarsi, in cerca di qualcosa
- Si soffermano in determinate sezioni della pagina
- Cliccano sulle immagini per poterle ingrandire o scaricare
- Interagiscono con elementi interattivi come slider, caroselli o popup
- Utilizzano la funzione di ricerca per trovare informazioni particolari
- Guardano i video incorporati nella pagina
Ogni utente ha le proprie peculiarità, un diverso modo di leggere e un livello di consapevolezza unico. Va da sè che i dati non vanno analizzati singolarmente per ogni utente, ma è necessario identificare dei pattern comuni. Per questo motivo, è importante lasciare che la mappa di calore raccolga un numero sufficiente di visite, così da poter disporre di dati significativi su cui tirare le somme.
In pratica, se hai visto che un utente è entrato sulla tua landing page e dopo 3 secondi è scappato via, questo dato da solo non significa nulla. Ammenoché, altri 100 utenti abbiano avuto il medesimo comportamento. Allora sì che hai dei dati sufficienti e sicuri su cui intervenire.
Ti spoilero già che uno dei click più frequenti che riscontrerai all’interno delle tue mappe di calore sarà il pulsante di accettazione o di negazione presente nel Cookie Banner. Potresti anche scoprire che i visitatori abbandonano il sito proprio perché atterrano su una pagina piena di banner e popup. Guarda un po’!
Come installare una heatmap sul sito
Per tracciare il comportamento degli utenti all’interno delle pagine web è necessario ricorrere a tool esterni da implementare all’interno delle pagine da monitorare, tramite codice o plugin.
I tool più conosciuti che generano heatmap sono: Hotjar, CrazyEgg, Clarity.
Installare mille mila plugin o codici di tracciamento non ha senso, per cui oggi ti mostro come installare velocemente Clarity nel tuo sito fatto in WordPress. Se invece hai un sito in HTML, basta incollare il codice tra gli <head>.
Clarity è un tool gratuito della Microsoft e ci permette di tracciare i movimenti, i click e lo scrolling degli utenti, sia attraverso delle mappe di calore che evidenziano i punti più cliccati della pagina che tramite la registrazione dello schermo.
Come installare Clarity su WordPress
- Accedi o registrati su https://clarity.microsoft.com
- Crea un nuovo progetto compilando il nome, URL e settore
- Vai nelle impostazioni e seleziona “Installazione”
- Scegli il metodo di installazione preferito
- Per installare il codice manualmente, clicca su “Ottieni codice di tracciamento”
- Copia il codice
- Vai su WordPress ed installa WP Code
- Crea uno snippet in HTML e incolla il codice di Clarity
- Fai la prova del nove verificando che il codice sia presente nella sorgente delle pagine (CTRL+U)
Scegli se tracciare tutte le pagine oppure soltanto quelle più importanti come le landing page. Sempre tramite WP Code puoi anche scegliere di non mostrare il codice a chi è loggato. Dalla dashboard di Clarity è possibile escludere gli indirizzi IP in modo da non tracciare le tue visite.
Vuoi scoprire esattamente come i visitatori interagiscono con le tue pagine e aumentare le conversioni delle tue landing page? Prenota ora il mio servizio Website Audit per ricevere un’analisi dettagliata e personalizzata del tuo sito!
Conclusione
Utilizzare una heatmap ti consente di identificare problemi nascosti e ottimizzare il sito basandoti su dati concreti piuttosto che su intuizioni.
Con una mappa di calore visualizzi i punti più cliccati della pagina e la registrazione dello schermo per capire quali sono i punti in cui si soffermano maggiormente gli utenti e quali, invece, in cui abbandonano il sito.
- Verifica che il tuo sito sia ottimizzato
- Offri un'esperienza utente intuitiva
- Focalizzati sugli elementi che fanno la differenza