Come aggiungere un'immagine di sfondo a un modello di e-mail o a una sezione
Cosa imparerai
Scopri come sovrapporre testo, immagini e altri contenuti delle e-mail su immagini di sfondo. Puoi aggiungere un'immagine di sfondo a un'intera e-mail o a una singola sezione. Usando questa funzionalità, puoi sovrapporre un'immagine sopra un'altra o aggiungere un pulsante o del testo sopra un'immagine.
Informazioni sulle immagini di sfondo
Puoi aggiungere un'immagine di sfondo dietro un intero modello di e-mail o dietro una sezione specifica nel modello. Gli sfondi del modello vengono aggiunti utilizzando la scheda Stili del modello e, in genere, si estendono per l'intera larghezza e altezza dell'e-mail.
Tuttavia, gli sfondi delle sezioni sono isolati in aree specifiche dell'e-mail. Ti consentono di creare immagini e call-to-action dinamiche e accattivanti. Puoi anche includere più call-to-action su 1 immagine (ad esempio, "Acquista scarpe" e "Acquista accessori"). Queste immagini di sfondo specifiche della sezione possono essere aggiunte tramite la scheda Stili di una sezione.
Usare un’immagine di sfondo con testo e altri contenuti sovrapposti può migliorare l’accessibilità della tua e-mail rispetto all’inserimento di una singola immagine che contiene testo. Se il tuo messaggio contiene principalmente contenuti di immagini con poco testo, i destinatari che usano lettori di schermo e altri dispositivi di accessibilità che non mostrano immagini fanno affidamento sul testo alternativo per comprendere il contenuto del messaggio.
Inoltre, i destinatari che usano caselle di posta in testo normale o impostano la casella di posta in modo da nascondere le immagini per impostazione predefinita non riusciranno a comprendere facilmente il tuo messaggio. Quando usi blocchi di testo standard con un'immagine dietro, è più facile per i destinatari con esigenze di accessibilità o dispositivi alternativi comprendere il tuo messaggio.
Selezione di immagini di sfondo
Quando selezioni un'immagine da usare come sfondo di una sezione o di un modello, scegline una con una risoluzione sufficientemente alta da apparire nitida e professionale nella casella di posta in arrivo. Assicurati però di non usare un file inutilmente grande, perché potrebbe causare tempi di caricamento lenti per le tue e-mail. In generale, usa immagini da 1 MB o meno come sfondi delle sezioni.
Imposta un’immagine di sfondo della sezione
Dopo aver scelto un’immagine da usare, aggiungi una nuova sezione al modello di e-mail.
- Nella scheda Stili della sezione, individua la sezione Sfondo.
- Fai clic su + per aggiungere un'immagine.
- Fai clic su Sfoglia libreria immagini, quindi carica l’immagine.
- Dopo aver configurato lo stile dell'immagine di sfondo, aggiungi contenuti alla sezione. Puoi aggiungere qualsiasi tipo di blocco (ad es. blocco di testo, blocco di pulsante, blocco di tabella) e qualsiasi numero di blocchi alla sezione.
Dopo aver impostato un’immagine di sfondo, scegli anche un colore di sfondo. Questo colore verrà visualizzato se, per qualsiasi motivo, l’immagine di sfondo non riesce a caricarsi.
- Apri la scheda Stili della sezione.
- Attiva/disattiva Colore della sezione.
- Scegli un colore che corrisponda il più possibile al colore dell'immagine che hai scelto.
Opzioni di stile dello sfondo della sezione
Per scegliere se l'immagine si estende per tutta la larghezza della tua e-mail o è contenuta nel contenuto dell’e-mail, scegli tra Contenuto o Sezione nell'impostazione Mostra su.
Nella sezione Formato, scegli tra le seguenti opzioni:
- Dimensioni originali
La tua immagine verrà visualizzata nelle sue dimensioni originali e non verrà vincolata in alcun modo. - Adatta
La tua immagine si adatterà interamente all’area della sezione e potrebbe mostrare il colore di sfondo sottostante se non è esattamente della stessa dimensione dell’area della sezione. - Riempi
La tua immagine riempirà completamente l’area della sezione e una parte dell’immagine potrebbe essere ritagliata. - Affianca
L’immagine verrà ripetuta per riempire l’intera area della sezione e puoi attivare/disattivare Dimensione affiancamento per scegliere la scala.
Imposta un’immagine di sfondo del modello
Per aggiungere un'immagine di sfondo a un modello e-mail:
- Vai alla scheda Stili del modello.
- Fai clic su + per aggiungere un'immagine.
- Scegli un'immagine dalla libreria di immagini o caricane una nuova.
Dopo aver aggiunto l'immagine, puoi modificare come è posizionata e se deve ripetersi (o essere affiancata) orizzontalmente e verticalmente.
Le immagini impostate come immagini di sfondo per un modello possono coprire l'intera larghezza dell'area del modello. Potresti voler impostare un colore Sfondo del modello in una tonalità simile a quella della tua immagine, poiché il colore di sfondo potrebbe essere visibile durante il caricamento dell'immagine o se un destinatario ha le immagini nelle e-mail disabilitate.
Supporto della Posta in arrivo per le immagini di sfondo
Anche se la maggior parte delle caselle di posta supporta le immagini di sfondo, in alcune situazioni potrebbero non essere visualizzate. In questi scenari, verrà visualizzato invece il colore di sfondo.
Le seguenti caselle di posta in arrivo non supportano le immagini di sfondo:
- Outlook per Windows
- Yahoo! Mail (supporto parziale)
- AOL (supporto parziale)
Inoltre, se un destinatario ha un accesso a Internet limitato o lento, l’immagine di sfondo potrebbe caricarsi lentamente o non caricarsi affatto, mostrando invece il colore di sfondo.
Risorse aggiuntive
- Informazioni sulle procedure consigliate per le immagini nelle e-mail
Scopri le best practice per l’uso delle immagini nelle Klaviyo Email, incluse le dimensioni consigliate e come aggiungere immagini.
- Procedure consigliate per la progettazione di e-mail in modalità scura
Scopri di più sulla modalità scura, un'impostazione del dispositivo che alcuni utenti attivano per scurire i display. Questa impostazione influisce sul modo in cui le e-mail vengono visualizzate. La modalità scura è un'impostazione utente finale selezionata a livello di dispositivo e Klaviyo non ha un controllo diretto su come la modalità scura viene implementata su ciascun dispositivo.
- Codifica degli sfondi delle e-mail HTML