Gerarchia visiva: come guidare gli utenti a compiere obiettivi

gerarchia visiva e psicologia percettiva

Hai scritto un testo lungo, di quelli che ne sei fiero, ma nessuno lo legge fino in fondo? O magari hai notato che i visitatori della tua pagina web non si soffermano? Ti capisco, anche a me succedeva agli inizi. Ma oggi ti racconto un metodo che puoi applicare e che ti aiuterà a catturare l’attenzione dei tuoi visitatori: la gerarchia visiva e la Gestalt psychologie.

Cerchiamo intanto di capire che cosa succede tra i lettori e il testo che hanno di fronte.

Cosa succede tra i lettori e il testo che hanno di fronte

Questa è la prima informazione che ti raccomando di tenere bene in mente:

le persone valutano gli elementi della pagina senza seguire un percorso lineare e senza leggere le parole in successione.

In pratica, saltano in vari punti secondo una determinata “gerarchia visiva”.

Ecco, ti ho già svelato la chiave per far leggere un testo sino alla fine:

capire quali elementi attirino l’attenzione dei visitatori di una pagina web (e di un testo!) e con quale priorità visiva.

Oltretutto, questa è anche una tecnica per creare una pagina web che converta.

Ma quali strumenti ci permettono di determinare il focus dell’attenzione?

Strumenti che ci permettono di determinare il focus dell’attenzione

La Gestaltpsychologie, conosciuta anche come Psicologia della Gestalt, ci offre le basi per comprendere il comportamento degli utenti di fronte alle forme e alle rappresentazioni – Gestalt in tedesco.

Immagina quanto sia potente per la nostra architettura dell’informazione, sapere come le persone raggruppino gli oggetti a livello inconscio.

Potremmo organizzare tutti i nostri elementi in modo che catturino l’attenzione delle persone che li guardano!

Insomma,

  • vogliamo o no che i visitatori vedano il nostro modulo contatti?
  • Vogliamo che vedano il carrello per gli acquisti o il numero di telefono per chiamarci?
  • E le nostre offerte?
  • E i messaggi che ci stanno particolarmente a cuore?

Ecco, questi sono dei validi motivi per continuare a leggere l’articolo e scoprire cosa ci dice la psicologia della Gestalt.

E poi metterlo in pratica!

Psicologia della Gestalt e fondamento della gerarchia visiva

Ora fai attenzione a quello che ti dirò perchè è molto importante.

Il concetto guida della Gestalt è che dal punto di vista percettivo “il tutto è diverso dalla somma delle sue parti” [rif. Kohler, Wertheimer, Koffka].

Cosa significa in sostanza?

Che le persone interpretano il modo in cui gli elementi sono distribuiti nello spazio e tendono a organizzarli per dar loro un senso.

Ti faccio un esempio: cosa vedi in questa immagine?

Il perimetro di quel triangolo è illusorio ma lo percepiamo ugualmente: è la nostra mente che riempie gli spazi
Il perimetro del triangolo è illusorio ma lo percepiamo ugualmente

Riesci a vedere il triangolo capovolto tra i kiwi?

Ebbene, il perimetro di quel triangolo è illusorio ma lo percepiamo ugualmente: è la nostra mente che riempie gli spazi!

Te lo ripeto:

le persone interpretano il modo in cui gli elementi sono distribuiti nello spazio e tendono a organizzarli per dar loro un senso.

Il senso dell’immagine con i kiwi è un triangolo e la nostra mente ha costruito questa forma anche se di fatto non c’è.

Senza rendercene conto abbiamo riempito quello spazio perchè vediamo gli elementi di un gruppo nel loro insieme.

Bene.

Il nostro obiettivo ora è trovare la disposizione perfetta di tutti i componenti di una pagina web (o di un testo lungo).

In sostanza, dobbiamo costruire una gerarchia visiva.

Una gerarchia che faccia vedere ai visitatori quello che interessa a noi, mano mano che scorrono la pagina.

Immagina poterci riuscire davvero… , quanto sarebbe potente?

Ora ci arriviamo, non preoccuparti.

Somiglianze e Dissomiglianze

La psicologia Gestalt ci aiuta a costruire la nostra gerarchia visiva in questo modo:

  • le somiglianze: gli elementi simili vengono percepiti come raggruppati insieme;
  • le dissomiglianze: gli elementi dissimili dal gruppo vengono percepiti e quindi notati.

Ti faccio un esempio sulla somiglianza: nell’immagine qui sotto, cosa vedi?

La maggior parte delle persone vede 3 file di cerchi neri e 3 file di cerchi bianchi
La maggior parte delle persone vede 3 file di cerchi neri e 3 file di cerchi bianchi

La maggior parte delle persone vede 3 file di cerchi neri e 3 file di cerchi bianchi… non “36 cerchi” o “6 file di cerchi” o “6 colonne di cerchi”.

Ricordi?

Le persone interpretano il modo in cui gli elementi sono distribuiti nello spazio e tendono a organizzarli per dar loro un senso.

Adesso ascoltami bene perchè ti dico come far fruttare queste informazioni.

Metti vicino gli elementi con aspetto simile: le persone li assoceranno tra loro considerandoli come stesse funzionalità, o come stesse argomentazioni.

Faccio un esempio sulla dissomiglianza: cosa vedi nell’immagine sotto?

l’elemento anomalo dissomigliante attira la nostra attenzione
l’elemento anomalo dissomigliante attira la nostra attenzione

Cos’è successo?

La mente ha raggruppato insieme tutti gli elementi simili per forma e colore.

L’elemento dissomigliante è anomalo, è ha attirato la tua attenzione perché diverso dal resto del gruppo che hai costruito a livello mentale.

Ecco.

Hai capito che abbiamo la tendenza a notare le differenze tra i gruppi di elementi.

Ma c’è molto di più!

Riusciamo a trarre conclusioni sull’importanza che hanno queste differenze e a dare quindi priorità a quelle che percepiamo come più significative.

Ti faccio un esempio: che importanza dai ai cerchi di questa immagine?

la grandezza determina la percezione di importanza
la grandezza determina la percezione di importanza

Anche se non hai alcuna informazione su questo gruppo di oggetti, è probabile che andrai a classificarli così:

Il cerchio più grande attira maggiormente l'attenzione
Il cerchio più grande attira maggiormente l’attenzione

E’ corretto?

Il cerchio più grande attira maggiormente l’attenzione, poi il secondo più grande, e così via.

Ti faccio un altro esempio: a cosa dai priorità in questa frase?

Questa è la frase più importante. Questa è la frase più importante. Questa è la frase più importante. Questa è la frase più importante. Questa è la frase più importante. Questa è la frase più importante

I tuoi occhi sono stati attratti dall’anomalia, la frase in grassetto?

Ora hai un’altra informazione che puoi mettere in pratica per realizzare la tua gerarchia visiva:

rendi differenti dimensioni e forme degli elementi in un gruppo per richiamare l’attenzione delle persone.

Le differenze che creiamo nell’architettura della pagina, o di un testo, svolgono un ruolo strategico nel catturare lo sguardo dei visitatori.

Ottimo, penso che a questo punto ti sia chiaro.

Se non lo fosse, parliamone, sono sempre disponibile a confronti costruttivi sui miei articoli.

A questo punto ti faccio una domanda (anzi tre).

  1. Sul tuo sito o testo hai differenziato i tuoi inviti all’azione?
  2. Sui tuoi testi Hai messo in risalto i vantaggi del tuo prodotto?
  3. Hai formattato i testi lunghi per creare una gerarchia visiva tra i vari paragrafi?

Tieni in mente.

Una gerarchia è fatta di elementi prioritari e di sequenze disposte in ordine di importanza:

  • metti l’informazione più importante dove cade lo sguardo dei visitatori appena arrivano sulla tua pagina web, o sul testo
  • la seconda informazione in ordine gerarchico mettila dove gli occhi si posano subito dopo
  • e così via.

Ascolta bene quello che ti dico adesso.

I tuoi lettori classificheranno come cruciali o superflui gli elementi della gerarchia visiva che hai costruito con tanto impegno, unicamente sulla base delle differenze tra essi.

Scrivitelo e appendilo:

Sulla sola base delle differenze tra essi.

Quindi?

Se vuoi progettare una gerarchia visiva efficace, lavora sugli elementi chiave della pagina:

  • titoli,
  • foto (e secondariamente le didascalie),
  • elenchi puntati,
  • paragrafi brevi,
  • grassetti e dimensione del font

Un testo lungo e senza formattazione è invisibile.

Ti faccio un esempio: quale di queste 2 pagine leggeresti meglio ?

L’immagine a sinistra non organizza il suo contenuto
L’immagine a sinistra non organizza il suo contenuto

Siamo sicuramente in grado di organizzare meglio, a livello mentale, il contenuto a destra piuttosto che quello a sinistra.

Hai capito l’importanza dell’organizzazione dell’informazione?

Se qualcosa ti sfugge o vuoi altri esempi di gerarchia visiva applicata, puoi chiamarmi e fissiamo una call per discuterne.

Non è ancora finita!

Non ti ho ancora detto una cosa importante.

Prima di iniziare a creare una gerarchia visiva con gli elementi del tuo sito web o del tuo testo lungo, hai bisogno di definire un obiettivo.

Progettare la gerarchia con un obiettivo

Prima di iniziare a creare una gerarchia visiva con gli elementi del tuo sito web o del tuo testo lungo, hai bisogno di definire un obiettivo.

Solo così puoi capire capire quali priorità assegnare.

Guarda questa immagine: com’è strutturata la gerarchia visiva?

lavoro di progettazione a livello strutturale con obiettivo
lavoro di progettazione a livello strutturale con obiettivo

Come potrai immaginare, l’obiettivo della pagina è accendere il desiderio di mangiare quel piatto.

L’obiettivo del proprietario del sito è invece quello di vendere quel piatto.

Per raggiungere questi obiettivi l’architettura dell’informazione costruisce un percorso visivo gerarchico ben preciso:

  1. mostra il piatto con dimensione talmente grande da sovrastare qualsiasi altro elemento della pagina e nello stesso tempo crea un desiderio
  2. usa un titolo grande per il nome del piatto con un carattere più grande rispetto a tutti quelli presenti nella pagina ed in posizione vicina al primo elemento gerarchico (la foto del piatto)
  3. sotto il titolo c’è l’invito all’acquisto (l’obiettivo) con un colore ben visibile.

Ti posso confermare, per esperienza, che queste strutture non sono improvvisate: l’architettura dell’informazione e della gerarchia visiva sono frutto di un lavoro accurato che risponde ad obiettivi precisi.

Ora prova tu.

Bene.

Sei arrivato in fondo all’articolo e hai imparato cose nuove.

Prova a ristrutturare il tuo lungo testo o la tua pagina web e misurarne l’efficacia tenendo sotto controllo la frequenza di rimbalzo e il tempo di permanenza sulla pagina.

Se invece conosci già la Gestalt già vuol dire che condividi il mio entusiasmo per l’architettura dell’informazione!
siti wordpress Site Inside

Fammi sapere come va la revisione dei tuoi articoli o della tua pagina web dopo che metterai in atto la tua strategia di gerarchia visiva.

Ci conto!