Migliori pratiche per l'immagine dell'eroe: 6 cose da considerare

L'immagine dell'eroe è il banner principale sul sito Web, solitamente posizionato in modo prominente, above the fold, davanti e al centro.

L'immagine dell'eroe è la prima immagine che il tuo pubblico vedrà quando entra nell'universo del tuo sito web. Quindi, il compito di reperire e selezionare la tua immagine di eroe non è un compito da prendere alla leggera.

In questo post, ho evidenziato alcuni degli aspetti più cruciali e delle migliori pratiche che dovresti considerare quando scegli un'immagine di eroe.

1. Usa immagini pertinenti

Mentre trascorriamo più tempo online che mai, la nostra capacità di attenzione sta diminuendo rapidamente. Uno studio dell'Università tecnica della Danimarca conclude che la nostra capacità di attenzione collettiva si sta riducendo (sciencedaily.com). Mentre il tempo medio trascorso su una pagina in media, in tutti i settori, è di 62 secondi, oltre il 50% dei visitatori ha trascorso meno di 15 secondi attivamente su una pagina (time.com).

La tua immagine di eroe deve amplificare la tua proposta di valore: ciò che stai cercando di comunicare. Porsi le seguenti domande:

• Quali emozioni stai cercando di scatenare?
• In che modo la tua immagine si collega al tuo USP / ESP?
• L'immagine contestualizza il contenuto del sito?

Abbiamo raccolto alcuni esempi di seguito per mostrare come un'immagine di eroe può farlo.

HubSpot: utilizzando un'illustrazione come sfondo dell'eroe, HubSpot esemplifica sia l'aspetto della crescita sia il fatto che si rivolgono sia alle PMI che alle aziende.

Save the Children: usare l'immagine di un bambino sullo sfondo del loro eroe per esemplificare uno dei tanti bambini che stanno cercando di salvare e quindi (si spera) creare una connessione emotiva con il pubblico.

Riverford Organic Farmers: un buon esempio di come sfruttare un'immagine autentica relativa al prodotto delle verdure biologiche. L'immagine è strettamente correlata ai prodotti e all'USP.

2. Il contrasto è fondamentale

Gli elementi di design dovrebbero distinguersi per far risaltare l'elemento più importante. Quindi, oltre a scegliere una buona immagine, dovresti anche considerare come quell'immagine potrebbe funzionare rispetto al colore del carattere desiderato, all'invito all'azione e alla combinazione di colori del marchio.

L'uso di una semplice sovrapposizione di solito può fare un'enorme differenza, facendo risaltare il tuo testo. Inoltre, l'ottimizzazione della saturazione, della temperatura e del contrasto con uno strumento di modifica può dare vita alla tua immagine.

3. Usa il formato giusto

Non utilizzare immagini di bassa qualità. Immagini pixelate o sfocate possono rovinare la prima impressione. Tuttavia, poiché l'immagine dell'eroe è un elemento critico della CX, dovresti assicurarti che l'immagine venga renderizzata il più velocemente possibile.

Usa immagini di larghezza compresa tra 1500 e 2500 pixel e comprimi l'immagine per ridurre le dimensioni del file e quindi aumentare la velocità di caricamento.

Perché il formato PNG di solito produce file di grandi dimensioni e ti consigliamo di utilizzare questo formato solo se hai linee nette e aree chiaramente separate di colori piatti e testo.

Diversi strumenti online possono aiutarti a comprimere la tua immagine:

• Tinyjpg.com: Fino a 20 immagini, max 5 MB ciascuna.
• Compressor.io: supporta jpg, png, gif, svg, webp. Massimo 10 MB
• Imagify.io: limite di caricamento della dimensione del file di 2 MB
• Shortpixel.com: fino a 50 file e massimo 10 MB.

4. Crea una connessione emotiva

Un recente studio pubblicato su Frontiers ha scoperto che le immagini emotive influenzano le persone più delle parole emotive. Quindi, scegliendo un'immagine con un alto livello di emotività, puoi innescare una reazione emotiva nello spettatore.

Quando osserviamo un'espressione facciale di emozione, spesso la imitiamo. Secondo un articolo pubblicato sulla rivista Trends in Cognitive Sciences, non sono solo i nostri sorrisi o sorrisi, ma tutte le nostre espressioni facciali a essere contagiose.

In effetti, il cervello elabora le immagini 60.000 volte più velocemente del testo e il 90% delle informazioni trasmesse al cervello sono visive (t-sciences.com). Siamo creature visive e sfruttando stimoli emotivi inclusi volti emotivi e immagini evocative possiamo innescare non solo sentimenti e associazioni positive, ma anche aiutare il tuo pubblico a decodificare il messaggio desiderato in modo più rapido e accurato.

5. Sii autentico e realistico

I consumatori sono travolti da stimoli, pubblicità e rumore. L'autenticità del marchio può aiutare a superare il rumore e farti distinguere. Messaggi genuini e immagini realistiche risuonano in modo più potente con le persone e ti aiutano a creare una connessione più forte con il tuo pubblico.

Sempre più aziende utilizzano "persone reali" per commercializzare i propri prodotti. Dove ha iniziato la sua "Campagna per la vera bellezza" nel 2004 celebrando le differenze fisiche naturali personificate da tutte le donne. Oltre a vincere numerosi premi, il marchio ha creato un forte legame emotivo con il proprio pubblico di destinazione con conseguente aumento significativo delle vendite.

Marchi come Dove e successivamente Target hanno utilizzato con successo "persone reali" nella loro pubblicità nell'ultimo anno e per una buona ragione: essere autentici ripaga.

Ciò non significa che devi scattare tutte le foto da solo, né che dovresti utilizzare immagini e video a bassa risoluzione. Dovresti, tuttavia, utilizzare foto di persone, luoghi ed esperienze reali e trasmettere una storia in modo reale piuttosto che utilizzare immagini che sembrano messe in scena.

6. Testare e ottimizzare

La scelta di una (nuova) immagine dell'eroe non dovrebbe essere considerata la fase finale, ma piuttosto l'inizio del processo di ottimizzazione. Come affermato in precedenza, l'immagine dell'eroe è forse uno degli elementi di design più importanti sul sito Web e può avere un impatto significativo sulle prestazioni complessive.

Per assicurarti che l'immagine del tuo eroe funzioni come previsto, dovresti implementare un monitoraggio delle prestazioni adeguato prima di impostarla live. A tal fine, considera l'utilizzo di uno strumento di test A/B per testare varianti alternative e per testare la tua variante originale rispetto alla tua nuova immagine.

In un test implementato da Crazyegg, la versione vincente ha aumentato le vendite degli acquirenti globali del 29,7%. In passato ho utilizzato i seguenti strumenti per testare le variazioni dell'immagine:

• Ottimizzazione di Google (gratuito)
• In modo ottimale
• Uovo pazzo

Ricorda, il fallimento è il primo passo verso il successo e non tentare è peggio che tentare e fallire. Potresti non farlo bene la prima volta, ma prova, prova nuove varianti e continua a ottimizzare, e sarai ricompensato di conseguenza.