Donnez vie à vos e-mails avec des vidéos, des GIF animés, des comptes à rebours et des images dynamiques

Publié: 2017-11-14

Dans cet article

Mode d'emploi, avantages et inconvénients : pourquoi et comment dynamiser les messages afin d'augmenter les ouvertures et les conversions.

Selon un récent rapport de Cisco System, aux États-Unis, les vidéos représenteront 84 % du trafic Internet d' ici 2018. C'est un chiffre impressionnant qui révèle à quel point un élément dynamique sur un support numérique peut catalyser l'attention des utilisateurs mieux que tout. autre.

Cela ne veut pas dire que les contenus intéressants ne transiteront que par la vidéo – cela reviendrait à admettre que les milliards d'heures visionnées sur YouTube chaque jour sont entièrement constituées de vidéos pertinentes. Cependant, lorsqu'il s'agit d'attirer et de captiver l'utilisateur, les formats avec un élément cinétique aident les pages Web à devenir plus dynamiques en acquérant le mouvement dans une séquence d'images et de cadres.

Nous assistons à un changement important dans les comportements des utilisateurs, avec une préférence croissante pour les éléments dynamiques . Il suffit de penser au Timelapse et au Boomerang d'Instagram, ou aux fonctionnalités Live et 360° sur Facebook : le contenu des réseaux sociaux glisse également vers des vidéos et des images avec un côté dynamique. C'est une tendance qui affecte tous les canaux de communication, y compris le courrier électronique .

Le pool de contenus animés pouvant être inclus dans les e-mails comprend quatre éléments principaux :

  • GIF animés
  • Vidéos
  • Comptes à rebours
  • Images dynamiques

Dans l'article d'aujourd'hui, nous aborderons chacun de ces types de contenu, en abordant les bonnes pratiques , les erreurs à éviter et les directives pour les intégrer correctement dans les e-mails, en optimisant la visualisation.

Votre guide de conception d'e-mails

GIF animé : l'as dans la manche du marketeur

Vous ne savez peut-être pas comment le prononcer, mais vous savez certainement ce qu'est un " GIF ". Ce format présente de nombreux avantages, notamment en termes de relative facilité de création et d'utilisation. En effet, grâce au mouvement qu'ils génèrent dans les e-mails :

  • Ils attirent l'attention et attirent le regard plus efficacement qu'une image statique.
  • En conséquence, les performances des e-mails s'améliorent , notamment en ce qui concerne le taux de clics.
  • Ils permettent de raconter des histoires qui créent un lien émotionnel avec l'utilisateur, ce qui est parfait du point de vue de la narration visuelle.
  • Ils divertissent et encouragent le partage
  • Ils supportent la transparence (ainsi ils peuvent être superposés sur un fond coloré)
  • Ils sont idéaux pour les images avec du texte superposé

En revanche, il y a certains inconvénients (nous pouvons cependant vous dire comment y remédier) :

  • Ils ne prennent en charge que jusqu'à 256 couleurs
  • Ils sont lourds , ce qui signifie qu'ils peuvent augmenter le poids global de l'e-mail et ralentir les temps de chargement
  • La qualité ne convient pas aux photographies

Comment créer un GIF animé

Bien que les inclure dans les e-mails soit simple et intuitif, la création de GIF animés nécessite un effort supplémentaire par rapport aux images statiques normales. Voici les options :

  • Utilisez Photoshop pour créer des GIF animés 100% originaux. Cette option nécessite plus de compétences, mais garantit de meilleurs résultats.
  • Utilisez des outils en ligne tels que moi, ezgif.com, makeagif.com, imgur.com, giphy.com ou gifbrewery.com (mais il y en a beaucoup d'autres) pour convertir des photos et des vidéos en GIF.
  • Profitez des riches galeries de GIF prêts à l'emploi, comme com et makeagif.com. Ce ne sera pas aussi original, mais cela contribuera à la facilité d'utilisation.

Comment incorporer des GIF animés dans des e-mails

Les GIF sont des fichiers image, similaires aux PNG et aux JPEG , ils peuvent donc être insérés dans des messages comme toutes les autres images « normales ».

  • Si vous utilisez l'éditeur glisser-déposer de MailUp, vous pouvez télécharger le GIF exactement de la même manière que les autres images.
  • Si vous travaillez en HTML , saisissez la chaîne de code correspondante.

Accompagnement par les clients

Les GIF animés sont désormais affichés par la grande majorité des clients de messagerie , y compris les versions de bureau et mobiles. Les principales exceptions sont Microsoft Outlook 2007, 2010 et 2013, car ces versions bloquent l'animation et n'affichent que la première image.

Rappelles toi! Le fait que les clients prennent en charge les GIF animés en théorie ne garantit pas automatiquement qu'ils seront affichés. Si des utilisateurs individuels ont bloqué les téléchargements d'images ou si le fichier image est trop lourd pour un téléchargement simple, vous vous heurterez à des échecs de visualisation.

Gestion des vidéos par les clients

GIF animés : 4 erreurs à éviter

1. Être trop lourd
S'ils sont surdimensionnés, les GIF animés peuvent être lents à s'animer et consommer trop de trafic de données depuis les mobiles. Essayez de garder votre GIF en dessous de 50 Ko et assurez-vous de ne jamais dépasser 200-250 Ko . Voici quelques astuces pour diminuer la lourdeur :

  • Réduire le nombre de couleurs (tout en faisant attention à ne pas trop compromettre la qualité de l'image)
  • Animer uniquement la partie de l'image qui nécessite un mouvement (en utilisant la technique du cinémagraphe par exemple)
  • Supprimez les images : l'illusion de mouvement reste même avec quelques images bien choisies.

2. Oublier d'optimiser la première image
Certains clients limitent l'affichage des GIF à la première image de l'animation. Partant du principe qu'il pourrait être le seul que tous les utilisateurs verront, il est conseillé de s'assurer que le tout premier cadre est complet et complet, et jamais vide . De cette façon, le message arrivera toujours à destination et ne sera pas complètement perdu, même en cas de visionnement limité.

3. Ne pas définir le texte alternatif
Cela ne s'arrête pas là : les GIF animés peuvent être complètement bloqués par les paramètres du destinataire ou du client, comme dans le cas de la visualisation d'images normales. En tant que tel, il est important d'utiliser des chaînes de texte alternatives (appelées Alt Text) pour rendre le contenu GIF utilisable pour ceux qui ne l'affichent pas.

4. Ne pas lier l'image
La grande valeur ajoutée des GIF animés est qu'ils peuvent être liés à une page web, comme n'importe quelle autre image statique et contrairement aux vidéos intégrées. N'oubliez pas d'ajouter un lien d'atterrissage pour emmener les personnes qui cliquent sur l'animation où vous voulez qu'elles aillent.

Vidéo dans les emails : oui ou non ?

Pour répondre à cette question, il est utile de jeter un œil de l'autre côté de l'océan, où, selon un article du Content Marketing Institute, 76% de ceux qui mettent de la vidéo dans leur email obtiennent des taux de clics bien plus élevés . De plus, ils ont également enregistré une plus grande propension à faire un achat de la part des prospects, chiffrée en pourcentage de 72%.

En réalité, la problématique était déjà apparue et se heurtait à la fois à l'impossibilité de prendre en charge la vidéo pour de nombreux clients et à l'absence d'alternative valable. Heureusement, la situation a maintenant changé et, selon des recherches approfondies, nous pouvons enfin dire que les vidéos peuvent être utilisées avec succès dans les campagnes de marketing par e-mail .

On parle d' embedding d' une vidéo, c'est-à-dire de sa saisie dans le code HTML . La balise <video> nous permet d'inclure une vidéo dans le HTML des messages envoyés à nos destinataires et, par conséquent, leur permet de la visualiser directement dans le message au sein de leur boîte aux lettres, sans utiliser d'autres plugins ou services tels que YouTube.

AVANTAGES

  • En moyenne, les vidéos intégrées sont vues 40 % de plus que celles qui sont simplement liées.
  • Les vidéos intégrées offrent une expérience dynamique directement dans la boîte aux lettres du destinataire.
  • Les vidéos intégrées sont un outil efficace. Ils génèrent environ 55% de chiffre d'affaires pour chaque email envoyé (A/B testing, retail).
  • Ils sont faciles à mettre en œuvre.

LES INCONVÉNIENTS

  • Les vidéos intégrées ne s'affichent pas dans tous les clients de messagerie. Les expéditeurs B2C atteignent environ 60% des boîtes de réception des destinataires et peuvent y être consultés. Dans le secteur B2B, ce chiffre est d'environ 40 %.
  • Les vidéos intégrées ne peuvent pas être liées à une URL ou à une image.
  • Il n'est pas possible de retracer les heures de visionnage de chaque destinataire.
  • Il n'est pas possible de tracer les clics pour la vidéo intégrée (lecture, pause, etc.).

Vidéo embarquée : un guide pratique

En plus de mettre à jour de nouveaux clients de messagerie et de navigateur, l'arrivée du HTML5 a permis d'insérer des vidéos dans les e-mails, d'afficher le contenu dans différents clients et navigateurs et de choisir les meilleurs.

Historiquement, l'utilisation d'Adobe Flash a toujours été déconseillée en raison de l'impossibilité de prendre en charge un client de messagerie et, en tant que tel, ce qui signifie qu'il n'y avait pas de prise en charge de la vidéo dans les e-mails. HTML5 offre cependant une meilleure prise en charge et les vidéos peuvent être visionnées directement dans la boîte de réception avec Apple Mail et Outlook (anciennement Hotmail). Les nouveaux éléments ne s'arrêtent pas là, cependant. Sur les clients où il n'est pas possible de visionner la vidéo, une autre image apparaît - l' image de secours spécifiée dans le code HTML - qui est liée à une page Web pour afficher le clip dans le navigateur.

Maintenant que HTML5 propose une solution pour insérer des vidéos dans les e-mails, voyons comment procéder.

  1. Préparez le fichier vidéo dans les formats suivants : MP4, OGG et WEBM.
  2. Créez une image de secours alternative qui sera affichée si la vidéo ne peut pas être affichée immédiatement.
  3. Utilisez un service tel que Video for Everybody Code Generator pour générer le code HTML.
  4. Saisissez le code dans l'éditeur HTML de votre fournisseur de messagerie, tel que MailUp.
  5. Liez l'image de secours alternative à la version Web de votre e-mail ou, si vous préférez, à une autre page.

Comment préparer des fichiers vidéo

Copier et coller du code à partir de YouTube (et similaire) n'est pas la solution idéale. L'ajout d'une vidéo à un e-mail nécessite quelques étapes supplémentaires. C'est là que HTML5 vient à notre secours, car ce code permet de visualiser les fichiers dans différents formats , et le client (que ce soit la messagerie ou le navigateur) peut choisir celui qui convient. Par exemple, Firefox préfère le ogv. format vidéo.

Comment préparez-vous ces fichiers vidéo et combien de temps cela prend-il ? Heureusement, vous pouvez convertir votre vidéo en deux formats différents à l'aide d'outils de conversion comme Online Convert . Dans de nombreux cas, les étapes sont susceptibles d'être :

  1. Trouvez le fichier vidéo d'origine : il doit s'agir d'un fichier MP4 (ou peut être enregistré en tant que fichier MP4)
  2. Si la vidéo a déjà été téléchargée sur YouTube, connectez-vous à votre compte et téléchargez la version MP4.
  3. Utilisez le fichier MP4 comme base pour générer des fichiers au format *.ogv et *.webm. Ces trois versions de la vidéo sont requises pour le code HTML
  4. Créez une image de secours vidéo alternative, avec l'extension JPG, par exemple. Dans notre test, l'image utilisée est la suivante :
L'image de secours vidéo alternative

5. Téléchargez les fichiers dans une zone Web accessible (par exemple, un dossier sur votre site Web)

Une alternative aux vidéos

Bien que relativement « sûres », les vidéos dans les e-mails peuvent toujours causer des problèmes potentiels de visualisation, de téléchargement et d'expérience. De nombreuses marques choisissent donc de remplacer les vidéos intégrées par l'une des options alternatives suivantes, qui sont plus sûres, plus légères et ont des effets secondaires beaucoup plus contrôlables.

  • GIF animé . Il est possible de simuler l'animation d'une vidéo avec un GIF animé, qui montre un aperçu du contenu en quelques images. Comme ils sont liés, les GIF peuvent vous amener à la vidéo complète sur la page de destination.
  • Faux joueur . Nous sommes maintenant tellement habitués à associer instinctivement l'icône du lecteur à une vidéo réelle, que lorsque nous voyons l'icône superposée à une image statique, nous percevons à peine la différence. Utilisez cette astuce pour simuler la première image d'une vidéo et envoyer ceux qui cliquent dessus vers la page de destination avec la vidéo elle-même.
Le faux joueur dans l'e-mail

3.2.1, allez : le compte à rebours

Le compte à rebours ajouté dans l'e-mail de Teavana

Passons des vidéos à une autre forme de contenu animé disponible pour les marketeurs : les horloges de compte à rebours , un puissant outil de narration visuelle qui peut transmettre l'urgence, inciter à l'action immédiate et attirer l'attention de manière plus incisive que les images statiques classiques.

Comme pour les GIF, il est sage d'utiliser les comptes à rebours dans les e-mails avec parcimonie, afin de ne pas diluer leur effet. Les comptes à rebours peuvent être utilisés à de nombreuses fins : d' encourager la participation à un événement à la promotion de l' expiration d'une offre , de la sollicitation de dons à des appels à l'action plus génériques. Vous pouvez explorer ces possibilités dans un récent article de blog dédié. Si vous avez besoin d'un guide pratique pour ajouter des minuteurs à vos e-mails, lisez notre guide pratique.

Contenu pour chaque destinataire : images dynamiques

Il s'agit d'un élément qui allie animation et personnalisation . Dans ce cas, l'élément dynamique reste dans les coulisses, représentant l'entrée avec laquelle les images sont animées dynamiquement en fonction des données de chaque destinataire – de manière entièrement automatique.

L'intégration d'images dynamiques dans les e-mails comporte essentiellement trois étapes :

Étape 1
Concevoir l'email dans l'éditeur BEE

Étape 2
Créez et personnalisez l'image avec NiftyImages.

Étape 3
Ajouter l'image personnalisée à l'e-mail

Nous vous donnerons les détails de chaque étape opérationnelle dans cet article. L'ajout d'images personnalisées à vos emails vous donne la possibilité d'envoyer des campagnes qui s'adressent personnellement à votre destinataire , non seulement dans le texte (grâce aux champs dynamiques), mais aussi dans la boîte à outils iconographique .

Le potentiel des images dynamiques

Pour résumer

Conception d'emails et éléments dynamiques : cette synergie est ce qui conduit au potentiel de conversion de l'email marketing. Nous vous avons accompagné à travers un aperçu des avantages, des inconvénients et des astuces pour que vous puissiez implémenter ce type de contenu dans votre stratégie. Il ne vous reste plus qu'à le mettre en pratique. N'oubliez pas que si vous n'avez pas encore de plateforme de marketing par e-mail et SMS, vous pouvez demander un essai gratuit de 30 jours de MailUp.

Essayez MailUp !