Le Heatmaps e il loro ruolo nella progettazione dell’interfaccia utente
La storia di un sito è anche una storia d’amore, ti innamori dell’aspetto anche estetico del tuo sito è difficile a volte dopo tanto lavoro fare autocritica. Ma è necessario. E’ del tutto naturale sentirci proprietari della nostra stessa storia, ed intendiamo divulgala al mondo, ma un sito professionale non è un libro, e se lo fosse tu non ne saresti il protagonista, lo è il tuo potenziale cliente. Pena la perdita di qualità e di resa del sito stesso!
Non esiste un’interfaccia “perfetta” e, se esistesse, non puoi cavartela progettandola e non guardandola mai più. Hai bisogno di dati per capire cosa funziona e cosa no e quali modifiche devi apportare per ottenere conversioni.
Ma come fare per capire se ciò che abbiamo di fronte sia davvero un sito che piaccia a navigatori?
Hai un’arma che ti viene in aiuto, sono le Heatmaps.
In questo articolo imparerai perché e come utilizzare le mappe di calore per ottimizzare i progetti dell’interfaccia utente e come ottenere ulteriori informazioni combinando le mappe di calore con altri comportamenti dell’utente e strumenti di feedback.
Ma prima Cerchiamo di capire cosa sono.
[lwptoc depth=”2″ numeration=”none” title=”Indice dell\’Articolo” labelHide=”nascondi” hideItems=”1″ smoothScrollOffset=”24″]
Cosa sono le Heatmaps?…
Le mappe di calore sono il modo visivo per capire come le persone interagiscono con le tue pagine e interfacce, in modo da poter progettare e riprogettare versioni più efficaci di esse.
Le mappe di calore vengono generate quando gli utenti interagiscono con un sito Web o un’app utilizzando un mouse o toccando un touchscreen. Perché si chiamano mappe? Perché sovrappongono dei colori alla tua pagina generando un’immagine che in definitiva assomiglia ad una mappa.
I colori vanno dal blu al rosso, dove il rosso sta per zona calda cioè la zona più vista o cliccata.
Puoi usare le heatmaps di Hotjar e Smartlook con una prova gratuita. Se invece hai WordPress puoi provare ad usare il plugin Smartlook Visitor Recording.
I tipi di Mappe di calore:
I dati utili da raccogliere sull’interazione del navigatore con il tuo sito sono: cosa legge, dove si sofferma di più, cosa clicca, quanto tempo ci resta, quali e quante pagine visita.
Esistono tre tipi principali di heatmaps che i progettisti dell’interfaccia utente (l’aspetto grafico del sito) possono utilizzare per ottenere informazioni dettagliate:
- Le mappe di scorrimento mostrano la percentuale esatta di persone che scorrono verso il basso in qualsiasi punto della pagina: più rossa è l’area, più visitatori la vedono. Scoprire fino a che punto scorrono gli utenti ti aiuta anche a capire se l’argomento trattato è abbastanza interessante per chi lo legge.
- Le mappe dei clic mostrano dove i visitatori fanno clic con il mouse sui dispositivi desktop e toccano il dito sui dispositivi mobili (in questo caso, sono noti come mappe di calore tattili). La mappa è codificata a colori per mostrare gli elementi che sono stati cliccati e toccati di più (rosso, arancione, giallo)
- Mappe di spostamento mostrano dove gli utenti spostano il cursore del mouse
Desktop & mobile heatmaps ti aiutano a confrontare le prestazioni del tuo sito Web su diversi dispositivi. Ad esempio, il contenuto che è prominente in una pagina del desktop potrebbe trovarsi molto più in basso di un telefono, e devi vedere se l’interazione differisce e come.
Come possono esser utili le heatmaps?
Le Heatmaps aiutano a trovare le risposte a domande cruciali come “perché i miei utenti non si convertono?” o “come posso spingere più visitatori del mio sito ad agire?” Ecco perché.
Una mappa di calore ti aiuterà a trovare idee per riprogettare e identificare elementi di design con prestazioni inferiori da eliminare dal prossimo schema grafico.
Intendo dire che se un elemento come un pulsante per esempio non raggiunge il suo scopo nella posizione in cui è stato inserito, è possibile spostarlo in un’area per così dire più calda e vedere cosa accade.
Gli elementi di design che ti aiutano a testare, ripetere e migliorare includono:
Pulsanti: posizionamento e stile
Navigazione: menu, pangrattato, collegamenti
Immagini: posizionamento, dimensioni, collegamenti, tipo
Testo: formattazione, lunghezza, posizionamento
Layout generale: gerarchia delle informazioni
Inoltre, è possibile raccogliere questi dati senza interrompere il percorso di lettura o navigazione dell’utente; a differenza dei sondaggi o dei pop-up on-page, le mappe di calore funzionano silenziosamente in background senza interrompere l’esperienza dell’utente.
Le migliori pagine su cui raccogliere i dati delle mappe di calore
Le mappe di calore ti consentono di fare un tuffo più profondo in una qualsiasi delle pagine del tuo sito Web, ma ha senso logico partire da quelle più importanti per te in termini di traffico, usabilità e obiettivi aziendali.
1. Pagina iniziale e pagine di destinazione
2. Pagine principali
3. Pagine con performance insufficienti
4. Nuove pagine
Suggerimento professionale
Se e quando cambia il design della tua pagina, avvia una nuova mappa di calore in modo da poter rivisitare la vecchia versione e confrontarla con quella nuova.
Affiancando le mappe di calore ai dati che hai sul tuo account Analytics e tra di loro avrai un quadro chiaro di cosa fare e come migliorare il tuo sito per renderlo uno strumento di successo!
Se vuoi approfondire gli aspetti chiave di un sito di successo leggi qui
Se ti è piaciuto quest’articolo diffondi, condividi, “Newsletterati” cliccando qui! 😉
