Dai vita alle tue e-mail con video, GIF animate, conti alla rovescia e immagini dinamiche

How-to, pro e contro: perché e come dare una spinta dinamica ai messaggi per aumentare aperture e conversioni.

Secondo un recente report di Cisco System, negli Stati Uniti i video rappresenteranno l' 84% del traffico internet entro il 2018. Si tratta di un dato impressionante che rivela la reale misura in cui un elemento dinamico su un supporto digitale può catalizzare meglio di ogni altra cosa l'attenzione dell'utente. altro.

Questo non vuol dire che i contenuti interessanti viaggeranno solo attraverso i video, ciò significherebbe ammettere che i miliardi di ore visualizzate su YouTube ogni giorno sono costituiti interamente da video rilevanti. Quando si tratta di attrarre e affascinare l'utente, tuttavia, i formati con un elemento cinetico aiutano le pagine Web a diventare più dinamiche acquisendo movimento in una sequenza di immagini e frame.

Stiamo assistendo a un cambiamento significativo nei comportamenti degli utenti, con una preferenza crescente per gli elementi dinamici . Basti pensare a Timelapse e Boomerang di Instagram, o alle funzionalità Live e 360° su Facebook: anche i contenuti dei social media scivolano nella direzione di video e immagini dal taglio dinamico. È una tendenza che sta interessando tutti i canali di comunicazione, compresa la posta elettronica .

Il pool di contenuti animati che possono essere inclusi nelle e-mail include quattro elementi principali:

• GIF animate
• Video
• Conto alla rovescia
• Immagini dinamiche

Nel post di oggi approfondiremo ciascuna di queste tipologie di contenuti, toccando best practice , errori da evitare e linee guida per integrarli correttamente nelle email, ottimizzando la visualizzazione.

GIF animate: l'asso nella manica del marketer

Potresti non essere sicuro di come pronunciarlo, ma sicuramente sai cos'è una " GIF ". Ci sono molti vantaggi in questo formato, soprattutto in termini di relativa facilità di creazione e utilizzo. Infatti, grazie al movimento che generano nei messaggi di posta elettronica:

• Attirano l'attenzione e catturano l'attenzione in modo più efficace di un'immagine statica.
• Di conseguenza, le prestazioni della posta elettronica migliorano , soprattutto per quanto riguarda la percentuale di clic.
• Consentono di raccontare storie che creano un legame emotivo con l'utente, perfetto dal punto di vista della narrazione visiva.
• Intrattiene e incoraggiano la condivisione
• Supportano la trasparenza (quindi possono essere sovrapposti su uno sfondo colorato)
• Sono ideali per immagini con testo sovrapposto

D'altra parte, ci sono alcuni svantaggi (possiamo dirti come porvi rimedio, però):

• Supportano solo fino a 256 colori
• Sono pesanti , il che significa che possono aumentare il peso complessivo dell'e-mail e rallentare i tempi di caricamento
• La qualità non è adatta per le fotografie

Come creare una GIF animata

Sebbene includerli nelle e-mail sia semplice e intuitivo, la creazione di GIF animate richiede uno sforzo aggiuntivo rispetto alle normali immagini statiche. Queste sono le opzioni:

• Usa Photoshop per creare GIF animate originali al 100%. Questa opzione richiede più competenze, ma garantisce risultati migliori.
• Utilizza strumenti online come me, ezgif.com, makeagif.com, imgur.com, giphy.com o gifbrewery.com (ma ce ne sono molti altri) per convertire foto e video in GIF.
• Approfitta delle ricche gallerie di GIF già pronte, come com e makeagif.com. Non sarà così originale, ma aiuterà con facilità d'uso.

Come incorporare GIF animate nelle e-mail

Le GIF sono file di immagine, simili a PNG e JPEG , quindi possono essere inseriti nei messaggi proprio come tutte le altre immagini "normali".

• Se utilizzi l'editor drag & drop di MailUp, puoi caricare la GIF esattamente come le altre immagini.
• Se stai lavorando in HTML , inserisci la stringa di codice corrispondente.

Supporto da parte dei clienti

Le GIF animate vengono ora visualizzate dalla stragrande maggioranza dei client di posta elettronica , comprese le varietà desktop e mobili. Le principali eccezioni sono Microsoft Outlook 2007, 2010 e 2013, poiché queste versioni bloccano l'animazione e mostrano solo il primo fotogramma.

Ricordare! Il fatto che i client supportino in teoria le GIF animate non garantisce automaticamente che verranno visualizzate. Se i singoli utenti hanno bloccato i download di immagini o se il file di immagine è troppo pesante per il download diretto, ti imbatterai in visualizzazioni non riuscite.

GIF animate: 4 errori da evitare

1. Essere troppo pesanti
Se di grandi dimensioni, le GIF animate possono essere lente da animare e consumare troppo traffico dati dai cellulari. Cerca di mantenere la tua GIF al di sotto dei 50 KB e assicurati di non superare mai i 200-250 KB . Ecco alcuni trucchi per diminuire la pesantezza:

• Ridurre il numero di colori (facendo attenzione a non compromettere troppo la qualità dell'immagine)
• Animare solo la parte dell'immagine che richiede movimento (usando la tecnica del cinemagraph, ad esempio)
• Rimuovi fotogrammi: l'illusione del movimento rimane anche con pochi fotogrammi ben scelti.

2. Dimenticare di ottimizzare il primo fotogramma
Alcuni client limitano la visualizzazione delle GIF al primo fotogramma dell'animazione. Partendo dal presupposto che potrebbe essere l'unico che tutti gli utenti vedranno, è opportuno assicurarsi che il primissimo frame sia esaustivo e completo, e mai vuoto . In questo modo il messaggio arriverà comunque a destinazione e non andrà completamente perso, anche in caso di visione limitata.

3. Non impostare il testo alternativo
Non finisce qui: le GIF animate possono essere completamente bloccate dalle impostazioni del destinatario o del client, come nel caso della visualizzazione di immagini normali. Pertanto, è importante utilizzare stringhe di testo alternative (il cosiddetto Alt Text) per rendere i contenuti GIF utilizzabili per coloro che non li visualizzano.

4. Non collegare l'immagine
Il grande valore aggiunto delle GIF animate è che possono essere collegate a una pagina web, proprio come qualsiasi altra immagine statica e diversamente dai video incorporati. Non dimenticare di aggiungere un link di destinazione per portare le persone che fanno clic sull'animazione ovunque tu voglia che vadano.

Video nelle e-mail: sì o no?

Per rispondere a questa domanda è utile dare uno sguardo dall'altra parte dell'oceano, dove, secondo un articolo del Content Marketing Institute, il 76% di chi inserisce video nella propria email ottiene percentuali di clic molto più elevate . Inoltre, hanno registrato anche una maggiore propensione all'acquisto da parte dei prospect, quantificata in una percentuale del 72%.

In realtà il problema era già emerso e si scontrava sia con l'impossibilità di supportare il video per molti clienti, sia con l'assenza di una valida alternativa. Per fortuna ora la situazione è cambiata e, secondo approfondite ricerche, possiamo finalmente affermare che i video possono essere utilizzati con successo nelle campagne di email marketing.

Si parla di incorporare un video, cioè di inserirlo nel codice HTML . Il tag <video> ci consente di includere video nell'HTML dei messaggi inviati ai nostri destinatari e, di conseguenza, consente loro di visualizzarlo direttamente nel messaggio all'interno della loro casella di posta, senza utilizzare altri plugin o servizi come YouTube.

PROFESSIONISTI

• In media, i video incorporati vengono visualizzati il ​​40% in più rispetto a quelli semplicemente collegati.
• I video incorporati offrono un'esperienza dinamica direttamente nella casella di posta del destinatario.
• I video incorporati sono uno strumento efficace. Generano circa il 55% di fatturato per ogni email inviata (test A/B, vendita al dettaglio).
• Sono facili da implementare.

CONTRO

• I video incorporati non vengono visualizzati in tutti i client di posta. I mittenti B2C raggiungono circa il 60% delle caselle di posta dei destinatari e possono essere visualizzati lì. Nel settore B2B, questa cifra è di circa il 40%.
• I video incorporati non possono essere collegati a un URL o a un'immagine.
• Non è possibile risalire ai tempi di visione di ciascun destinatario.
• Non è possibile tracciare i clic per il video incorporato (riproduzione, pausa, ecc.).

Video incorporato: una guida pratica

Oltre ad aggiornare nuovi client di posta e browser, l'arrivo di HTML5 ha permesso di inserire video nelle e-mail, visualizzare i contenuti in diversi client e browser e permetterci di scegliere i migliori.

Storicamente, l'uso di Adobe Flash è sempre stato scoraggiato a causa dell'impossibilità di supportare qualsiasi client di posta e, in quanto tale, significa che non c'era supporto per i video nelle e-mail. HTML5 offre un supporto migliore, tuttavia, e i video possono essere visualizzati direttamente nella posta in arrivo con Apple Mail e Outlook (precedentemente noto come Hotmail). I nuovi elementi, però, non finiscono qui. Sui client in cui non è possibile visualizzare il video, viene visualizzata un'immagine alternativa, l'immagine di fallback specificata nell'HTML, che è collegata a una pagina Web per visualizzare la clip nel browser.

Ora che HTML5 offre una soluzione per l'inserimento di video nelle e-mail, vediamo come farlo.

1. Prepara il file video nei seguenti formati: MP4, OGG e WEBM.
2. Crea un'immagine di fallback alternativa che verrà mostrata se il video non può essere visualizzato immediatamente.
3. Utilizza un servizio come Video for Everybody Code Generator per generare il codice HTML.
4. Inserisci il codice nell'editor HTML del tuo provider di posta elettronica, come MailUp.
5. Collega l'immagine di fallback alternativa alla versione web della tua email o, se preferisci, a un'altra pagina.

Come preparare i file video

Copiare e incollare codice da YouTube (e simili) non è la soluzione ideale. L'aggiunta di un video a un'e-mail richiede alcuni passaggi aggiuntivi. È qui che viene in nostro soccorso HTML5 , poiché questo codice consente di visualizzare i file in diversi formati e il client (che sia la posta o il browser) può scegliere quello appropriato. Ad esempio, Firefox preferisce il file ogv. formato video.

Come si preparano questi file video e quanto tempo ci vuole? Fortunatamente, puoi convertire il tuo video in due diversi formati utilizzando strumenti di conversione come Online Convert . Per molti casi, è probabile che le fasi siano:

1. Trova il file video originale: dovrebbe essere un MP4 (o può essere salvato come file MP4)
2. Se il video è già stato caricato su YouTube, accedi al tuo account e scarica la versione MP4.
3. Usa il file MP4 come base per generare file in formato *.ogv e *.webm. Queste tre versioni del video sono necessarie per il codice HTML
4. Crea un'immagine di fallback video alternativa, ad esempio con l'estensione JPG. Nel nostro test, l'immagine utilizzata è la seguente:

5. Carica i file in un'area web accessibile (ad esempio, una cartella sul tuo sito web)

Un'alternativa ai video

Sebbene relativamente "sicuri", i video nelle e-mail possono ancora causare potenziali problemi con la visualizzazione, il caricamento e l'esperienza. Molti marchi scelgono quindi di sostituire i video incorporati con una delle seguenti opzioni alternative, che sono più sicure, leggere e hanno effetti collaterali molto più controllabili.

• GIF animate . È possibile simulare l'animazione di un video con una GIF animata, che mostra un'anteprima del contenuto in pochi frame. Poiché sono collegabili, le GIF possono portarti al video completo sulla pagina di destinazione.
• Giocatore falso . Siamo ormai così abituati ad associare istintivamente l'icona del giocatore a un video reale, che quando vediamo l'icona sovrapposta a un'immagine statica difficilmente percepiamo la differenza. Usa questo trucco per simulare il primo fotogramma di un video e manda chi ci clicca sulla landing page con il video stesso.

3.2.1, vai: il conto alla rovescia

Passiamo dai video ad un'altra forma di contenuto animato a disposizione dei marketer: i countdown clocks , un potente strumento di narrazione visiva in grado di trasmettere urgenza, incitando all'azione immediata e attirando l'attenzione in modo più incisivo rispetto alle classiche immagini statiche.

Come con le GIF, è consigliabile utilizzare i timer per il conto alla rovescia nelle e-mail con parsimonia, in modo da non diluire il loro effetto. I conti alla rovescia possono essere utilizzati per molti scopi: dall'incoraggiare la partecipazione a un evento alla promozione della scadenza di un'offerta , dalla sollecitazione di donazioni agli inviti all'azione più generici. Puoi esplorare queste possibilità in un recente post sul blog dedicato. Se hai bisogno di una guida pratica per aggiungere timer alle tue e-mail, leggi il nostro how-to.

Contenuto per ogni destinatario: immagini dinamiche

Questo è un elemento che unisce animazione e personalizzazione . In questo caso, l'elemento dinamico rimane dietro le quinte, rappresentando l'input con cui le immagini vengono animate dinamicamente in base ai dati di ciascun destinatario, in modo completamente automatico.

Ci sono essenzialmente tre passaggi coinvolti nell'integrazione di immagini dinamiche nelle e-mail:

Passo 1
Progetta l'e-mail nell'editor BEE

Passo 2
Crea e personalizza l'immagine con NiftyImages.

Passaggio 3
Aggiungi l'immagine personalizzata all'e-mail

Ti forniremo i dettagli per ogni fase operativa in questo post. L'aggiunta di immagini personalizzate alle tue email ti dà la possibilità di inviare campagne che parlano personalmente al tuo destinatario , non solo nel testo (grazie ai campi dinamici), ma anche nel toolkit iconografico .

Per riassumere

Email design ed elementi dinamici: questa sinergia è ciò che porta al potenziale di conversione dell'email marketing. Ti abbiamo accompagnato attraverso una panoramica dei pro, dei contro e delle procedure per implementare questo tipo di contenuto nella tua strategia. Ora non ti resta che metterlo in pratica. Ricorda che se non possiedi già una piattaforma di Email & SMS Marketing puoi richiedere una prova gratuita di 30 giorni di MailUp.