Comment intégrer une vidéo HTML5 dans un e-mail

HTML5 est le langage de balisage le plus récent pour la présentation et la structuration du contenu sur Internet. HTML signifie HyperText Markup Language. C'est le langage standard utilisé pour créer des documents web. HTML a bénéficié de mises à jour régulières au fur et à mesure de l'évolution des besoins des utilisateurs. HTML5, par exemple, est la dernière mise à jour de HTML. Elle permet d'intégrer des vidéos dans les documents web. HTML5 introduit notamment les fonctionnalités suivantes : élément permettant la lecture de vidéos sur Internet, remplaçant le élément.

La fonctionnalité vidéo introduite par HTML5 est essentielle, car le contenu vidéo est au cœur du marketing, de la publicité et du développement de la marque. Cela explique le succès retentissant de plateformes vidéo comme YouTube et TikTok. Aujourd'hui, tous les réseaux sociaux proposent déjà la vidéo.

Cela dit, il est tout à fait logique que les e-mails puissent également intégrer des vidéos. Les spécialistes du marketing par e-mail devraient pouvoir profiter des avantages du marketing vidéo. Cependant, certains clients de messagerie prennent en charge HTML5, tandis que d'autres non. Si cela complique l'intégration de vidéos dans les e-mails, des solutions existent. Découvrez comment intégrer des vidéos HTML5 dans vos e-mails et d'autres alternatives.

Quels sont les avantages de la vidéo dans les e-mails ?

Le contenu vidéo prend une importance croissante pour accroître la l'efficacité des campagnes de marketing par e-mailUne enquête de Wyzowl a montré que 92% de spécialistes du marketing Ils reconnaissent que la vidéo est un élément essentiel de leurs efforts. La raison est simple : en intégrant la vidéo à leurs campagnes d’emailing, les spécialistes du marketing profitent simultanément des avantages de la vidéo et de l’emailing.

Voici quelques avantages dont bénéficient les spécialistes du marketing en utilisant la vidéo dans les e-mails :

• Engagement client accru : lorsqu’on envoie un e-mail, le destinataire parcourt rapidement le texte et tente d’en extraire les points importants. En revanche, une vidéo capte immédiatement son attention. Il est plus enclin à la regarder plus longuement.

Imaginons que vous meniez une campagne pour expliquer l'utilisation d'un produit. La description du service a tendance à être longue et didactique. En revanche, si ces mêmes informations sont présentées sous forme de vidéo, elles deviennent beaucoup plus attrayantes. Un lecteur pourrait survoler le texte, mais regardera la vidéo en entier. Par conséquent, la vidéo augmente le temps d'interaction de l'abonné avec votre e-mail.

• Forte notoriété de marque : les vidéos renforcent la notoriété de votre marque. Cela réduit le taux de rebond et augmente les taux de clics et de conversion. Les vidéos intégrées aux e-mails permettent d’atteindre cet objectif, car elles facilitent l’explication et la démonstration de leur message.

Par exemple, les marques peuvent montrer comment utiliser vos produits. Vous pouvez montrer aux utilisateurs comment monter, réparer et démonter le produit si nécessaire.

• Instaurer la confiance envers la marque : Bien que la rédaction d’un e-mail uniquement textuel permette d’insuffler le ton de la marque, rien ne vaut la vidéo. En effet, une vidéo permet aux destinataires de découvrir les visages et les personnalités des marques auprès desquelles ils achètent. Cela crée ainsi une relation encore plus personnelle avec vos clients.

Une campagne efficace peut montrer les employés au travail ou les employés donner leur avis Ces témoignages sur leur expérience professionnelle renforcent l'attachement du client et créent un lien émotionnel avec votre marque. Il a l'impression de la connaître et de s'y identifier, ce qui, dans une certaine mesure, lui donne un sentiment d'appartenance.

Ce lien émotionnel et ce sentiment d'appartenance sont les moteurs de la fidélité client et de la promotion de la marque. Lorsque les clients se sentent plus proches d'une marque, ils sont plus enclins à rester fidèles, à renouveler leurs achats et même à la recommander. Par conséquent, mettre davantage en avant vos employés dans votre campagne peut être bénéfique pour votre marque.

1. Confiance et authenticité : en montrant vos employés au travail et leurs témoignages sincères, vous instaurez un climat de transparence et d’authenticité. Les clients apprécient de voir des personnes réelles et passionnées par leur travail, ce qui renforce la confiance et la crédibilité de votre marque. Cette confiance est essentielle pour établir des relations durables avec vos clients.
2. Humaniser la marque : Mettre en avant vos employés dans votre campagne humanise votre marque. Cela donne un visage aux noms et permet aux clients de voir les personnes qui se cachent derrière les produits ou les services. Cette dimension humaine aide les clients à s’identifier à votre marque et à créer un lien émotionnel plus fort.
3. L’engagement des employés : lorsqu’ils participent à la campagne et partagent leur expérience professionnelle, les employés deviennent eux-mêmes des ambassadeurs de la marque. Leur enthousiasme et leurs commentaires positifs peuvent inspirer les clients et susciter un sentiment de fierté et de fidélité chez les employés. Il en résulte une motivation et un engagement accrus, qui se traduisent en fin de compte par une meilleure expérience client.
4. Opportunités de narration : Intégrer les témoignages et les expériences de vos employés à votre campagne offre de riches opportunités de narration. Partager des anecdotes sur leur parcours, leurs défis et leurs réussites peut captiver votre public et créer un récit autour de votre marque. Ce récit aide les clients à comprendre les valeurs et la mission de votre marque, renforçant ainsi leur lien émotionnel avec elle.
5. Amélioration de la mémorisation de la marque : Lorsque les clients voient des employés mis en avant dans votre campagne, cela crée une impression mémorable. On retient davantage les histoires et les visages que les publicités génériques. En associant votre marque aux personnes qui la représentent, vous augmentez les chances que les clients se souviennent de votre marque au moment de leurs achats.
6. Preuve sociale : Intégrer les témoignages et les expériences des employés constitue une forme de preuve sociale. Lorsque des clients potentiels voient des employés parler positivement de votre marque, ils sont plus enclins à faire confiance à vos produits ou services et à les choisir. Cela renforce votre crédibilité et conforte l’idée que votre marque mérite d’être choisie.

Pensez à intégrer des points de vue variés et à mettre en valeur les différents rôles au sein de l'entreprise afin d'optimiser l'impact de votre campagne. Cette inclusivité peut toucher un public plus large et témoigner de votre engagement en faveur de la diversité et de l'égalité. Veillez à ce que la représentation des employés soit en accord avec les valeurs de votre marque et à ce que leur expérience reflète les aspects positifs de travailler dans votre entreprise.

En mettant davantage en avant vos employés dans votre campagne, vous créez un lien émotionnel qui dépasse le simple cadre publicitaire. Ce lien favorise la fidélité, la recommandation et un sentiment d'appartenance chez les clients, contribuant ainsi à la réputation et au succès à long terme de votre marque. Cependant, pour tirer pleinement parti de la vidéo dans les e-mails, les spécialistes du marketing doivent savoir comment l'intégrer correctement. Comme je l'ai mentionné, certains formats ne sont pas pris en charge par certains clients de messagerie. Mais il existe une solution.

Formats vidéo pris en charge par e-mail

Vous devez d'abord savoir quels formats vidéo sont pris en charge dans les e-mails. Si votre format vidéo n'est pas compatible, votre stratégie d'e-mailing risque de se retourner contre vous. Si vos abonnés ne peuvent pas lire la vidéo, leurs expérience client est gâchée. Cela dit, voici les formats vidéo pris en charge par différents clients de messagerie.

Le problème, c'est que convertir une vidéo en différents formats et l'intégrer ensuite aux e-mails peut s'avérer fastidieux. C'est pourquoi il est préférable d'intégrer une vidéo HTML5 directement dans vos e-mails. L'intégration d'une vidéo HTML5 simplifie la compatibilité entre les appareils, les navigateurs et les plateformes. Elle permet également le partage et la personnalisation. En ajoutant un hébergement web performant pour le référencement naturel (SEO), vous garantissez une expérience utilisateur optimale à vos abonnés.

Vous trouverez ci-dessous une liste indiquant où les vidéos HTML5 fonctionnent et où elles affichent l'image de repli.

Bien que les clients de messagerie comme Gmail ne prennent pas en charge la vidéo HTML5, celle-ci reste très répandue. C'est pourquoi il est essentiel de trouver une solution de remplacement pour l'affichage.

Présentation de la vidéo HTML5 dans un e-mail

Mais pourquoi intégrer une vidéo HTML5 dans votre e-mail, l'un de vos canaux marketing essentiels pour le commerce de détail, le B2C et le SaaS, alors que vous pouvez l'ajouter en pièce jointe ou la lier par un hyperlien ?

Tout d'abord, la taille des vidéos que vous pouvez joindre à un courriel est limitée. Certaines vidéos sont longues et contiennent des graphismes complexes. Or, les clients de messagerie ne prennent généralement pas en charge ce type de format. Cette limitation vous contraint et peut même vous obliger à compresser votre vidéo au point d'en altérer la qualité. Vos destinataires risquent de ne pas apprécier.

Deuxièmement, lorsqu'une vidéo est accessible par un lien hypertexte utilisant un texte d'ancrage, le lecteur n'est pas incité à cliquer pour être redirigé vers un autre site et visionner la vidéo. Il lira le texte d'ancrage sans cliquer sur le lien. Certains pourraient même reporter le visionnage de la vidéo après avoir terminé leur lecture. Distraits, ils pourraient ne jamais revenir la regarder.

Intégrer une vidéo HTML5 est idéal car cela permet au destinataire de l'e-mail de la visionner facilement. Le lecteur n'aura rien à cliquer : la vidéo se lance automatiquement tant que l'e-mail est ouvert. Si elle est captivante, l'abonné sera plus enclin à la regarder jusqu'au bout. Vous pouvez utiliser Stack Overflow pour intégrer des vidéos HTML5 dans vos e-mails. Voici un aperçu de la marche à suivre :

Comment intégrer une vidéo HTML5 dans un e-mail

L'intégration d'une vidéo via HTML5 peut se faire de différentes manières. Vous pouvez définir l'image de remplacement et ses paramètres grâce à ces méthodes.

Utilisation de l'élément objet

Le L'élément <video> est l'une des façons d'intégrer une vidéo dans votre e-mail. Il est utilisé pour intégrer différents types de médias dans les documents HTML. L'élément intègre des contrôles ActiveX.

Les contrôles ActiveX sont de petits programmes utilisés sur Internet pour améliorer l'expérience utilisateur. Lorsque vous interagissez avec l'élément objet, vous activez les technologies d'intégration ActiveX sur le Web. L'élément suivant décrit les spécifications des médias que vous souhaitez intégrer à votre document HTML5. Il peut s'agir d'images, de fichiers audio, de fichiers PDF, d'animations Flash et, dans ce cas précis, de fichiers vidéo.

Vous pouvez utiliser ce code pour intégrer une vidéo en utilisant

<object data="video.mp4"></object>

Cependant, en utilisant le Cette fonctionnalité n'est pas toujours très bien prise en charge. Son efficacité dépend de l'objet intégré.

Utilisation de l'élément vidéo

HTML5 L'élément `<video>` a été récemment lancé. Il s'agit d'une méthode plus standard pour intégrer des fichiers vidéo sur Internet, notamment par e-mail. De plus, il est beaucoup mieux pris en charge par les navigateurs web modernes.

Vous pouvez utiliser le code suivant pour intégrer votre vidéo en utilisant élément.

<!--[if !mso]--><!-->
<a href="Link to the video" target="_blank" style="mso-hide:all;display:block;width:inherit;height:inherit;max-height:inherit;">
    <img src="GIF URL" border="0" alt=" " style="mso-hide:all;display:block;width:inherit;height:inherit;max-height:inherit;" />
</a>
<!--<![endif]-->

<video autoplay="autoplay" loop="loop" clipID="em_4566" poster="GIF POSTER" controls="controls" src="VIDEO_MP4" style="mso-hide:all;display:block;width:100%;height:auto;max-height:none;"></video>

<!--[if !mso]--><!-->
<a href="Link to the video" target="_blank" style="mso-hide:all;display:block;width:inherit;height:inherit;max-height:inherit;">
    <img src="GIF URL" border="0" alt=" " style="mso-hide:all;display:block;width:inherit;height:inherit;max-height:inherit;" />
</a>
<!--<![endif]-->

<div class="vid_em_4566" style="mso-hide:all;width:0px;max-height:0px;height:0px;overflow:hidden;text-align:center;">
    <video autoplay="autoplay" loop="loop" clipID="em_4566" poster="GIF POSTER" controls="controls" src="VIDEO_MP4" style="mso-hide:all;display:block;width:100%;height:auto;max-height:none;"></video>

    <!--[if !mso]--><!-->
    <a href="Link to the video" target="_blank" style="mso-hide:all;display:block;width:inherit;height:inherit;max-height:inherit;">
        <img src="GIF URL" border="0" alt=" " style="mso-hide:all;display:block;width:inherit;height:inherit;max-height:inherit;" />
    </a>
    <!--<![endif]-->
</div>

Matériau

Le code comporte quatre parties. La première configure les paramètres multimédias de l'e-mail, qu'il s'agisse de la vidéo ou d'une image de remplacement. La deuxième partie définit une ancre d'image que les clients de messagerie appelleront pour l'affichage. La troisième partie masque le contenu multimédia lorsque le client de messagerie ne prend pas en charge le format, afin de garantir une expérience utilisateur optimale. La quatrième partie configure la vidéo pour qu'elle se lance automatiquement à l'ouverture de l'e-mail.

Alternatives à la vidéo HTML5 dans les e-mails

Même si l'idéal pour intégrer une vidéo dans un e-mail est de l'utiliser via HTML5, comme je l'ai mentionné, cette technologie n'est pas compatible avec tous les clients de messagerie et navigateurs. Cela représente un défi pour les spécialistes du marketing souhaitant utiliser la vidéo dans leurs campagnes. Ils devraient en effet développer un code complexe pour prendre en compte toutes les variables et prévoir une solution de repli visuelle. Heureusement, il existe d'autres alternatives pour intégrer une vidéo dans un e-mail. Ces alternatives nécessitent un clic supplémentaire pour accéder au lecteur vidéo ou à la plateforme d'hébergement. Elles captent l'attention du destinataire et sont plus efficaces que l'ajout d'une pièce jointe ou d'un lien hypertexte. En voici un aperçu :

Ajouter un faux bouton de lecture à l'image

Ne vous inquiétez pas du mot « faux ». Le bouton « faux » n'est pas destiné à tromper. Il sert simplement à indiquer la présence d'une vidéo dans le courriel.

Réfléchissez-y. Si les lecteurs ne voient pas le bouton de lecture, ils pourraient croire qu'il s'agit simplement d'une image. Vous ne pouvez pas laisser le taux de clics de votre e-mail au hasard.

Matériau

Observez l'exemple ci-dessus. Le bouton « Lecture » ​​attire l'attention et incite le lecteur à cliquer. En cliquant, il est automatiquement redirigé vers la vidéo, l'image étant un lien hypertexte. Cette vidéo peut être hébergée sur YouTube, Vimeo ou votre site web. Pour créer l'image avec le faux bouton « Lecture », vous pouvez faire une capture d'écran de la vidéo dans un lecteur ou demander à un graphiste de créer une vignette avec ce bouton.

Lorsque vous utilisez le faux bouton de lecture, assurez-vous que lorsque l'abonné clique sur l'image, la vidéo se lance sur la plateforme d'hébergement. Il serait illogique que l'utilisateur clique sur « Lecture » ​​puis doive se rendre sur un autre site, rechercher la vidéo et la relancer. Il risquerait alors de quitter la page sans la regarder.

Utiliser des GIF

Vous pouvez aussi aller plus loin. Au lieu d'une image fixe avec un bouton de lecture, optez pour un GIF plus attrayant. Ce format vidéo donne un avant-goût de la vidéo et incite le lecteur à cliquer.

L'avantage des GIF est qu'ils sont largement compatibles avec de nombreux fournisseurs de messagerie et navigateurs. Ils constituent ainsi un compromis entre les vidéos HTML5 intégrées aux e-mails et les images statiques. Le GIF se lance dès l'ouverture de l'e-mail. Voici un exemple de GIF dans un e-mail :

Matériau

Vous pouvez créer un GIF à l'aide de divers outils en ligne comme Giphy.com ou EZGif. De plus, pour exploiter pleinement le potentiel du GIF, vous pouvez ajouter un bouton de lecture.

Mais ce n'est là qu'un des avantages des GIF. Leur intégration ne nécessite aucune connaissance en HTML, ce qui est un atout majeur pour les marketeurs qui ne maîtrisent pas le développement. En effet, ils peuvent ainsi profiter des fonctionnalités des e-mails vidéo sans se soucier de la programmation.

Il est toutefois important de faire attention à la taille du GIF que vous incluez dans votre e-mail. Les GIF volumineux peuvent prendre du temps à charger, ce qui serait contre-productif. Ils risquent également de consommer le forfait de données de votre destinataire. Veillez donc à ce que le GIF soit de taille raisonnable, idéalement autour de 1 Mo.

Tirez parti du bouton de lecture animé

Un bouton de lecture animé est une nette amélioration par rapport à un bouton factice. Il existe de nombreuses façons créatives de le réaliser : apparition et disparition progressives, déplacement à l’écran, animations plus sophistiquées… Quel que soit votre choix, privilégiez la sobriété pour ne pas importuner vos lecteurs. Vous trouverez ci-dessous un exemple de bouton de lecture animé simple.

Matériau

Vous pouvez également utiliser le bouton de lecture animé seul ou le superposer à une image fixe ou à une vignette. Si vous choisissez d'utiliser uniquement le bouton de lecture animé, veillez à décrire la vidéo dans votre e-mail afin que les abonnés sachent ce qu'ils vont regarder. La présence d'un bouton de lecture indique au consommateur qu'une vidéo est disponible. Cependant, s'il ignore le sujet de la vidéo, il risque de ne pas y prêter attention.

Associer le bouton de lecture animé à une vignette est une meilleure option. La vignette donne un aperçu de la vidéo que l'abonné s'apprête à regarder. Cependant, il est important de veiller à ce que l'ensemble soit visuellement harmonieux. Évitez un rendu chaotique qui risquerait de rebuter le lecteur. L'association du bouton de lecture animé et d'un GIF est également envisageable, mais elle risque de semer la confusion plutôt que de captiver l'attention.

Il est essentiel d'intégrer correctement une vidéo, mais cela ne doit pas être votre seule action en tant que marketeur. N'oubliez pas que votre rôle est aussi de susciter l'intérêt des lecteurs pour la vidéo. Votre objectif ultime est, après tout, qu'ils cliquent et la regardent. Par conséquent, ne vous contentez pas de vérifier que votre vidéo fonctionne. Vous devez également tout mettre en œuvre pour obtenir le clic. Sinon, toute votre campagne de marketing vidéo risque de s'effondrer.

En clôture

Lors d'une campagne d'emailing, il est essentiel d'exploiter toutes les astuces disponibles pour en maximiser l'impact. L'emailing vidéo est une solution pour accroître l'efficacité de votre campagne. Cependant, intégrer une vidéo dans un email n'est pas chose aisée.

L'idéal serait d'intégrer une vidéo directement dans l'e-mail, sans rediriger le destinataire vers un nouveau site web. Malheureusement, les clients de messagerie ne prennent pas en charge tous les formats vidéo. De plus, tous ne sont pas compatibles avec les vidéos HTML5.

Grâce à HTML5, vous pouvez intégrer une vidéo qui s'affichera parfaitement dans certains clients de messagerie. Vous pouvez également définir une image de remplacement qui apparaîtra si la vidéo ne se lance pas, évitant ainsi au lecteur de voir une image cassée ou un écran noir.

Il existe cependant d'autres façons d'intégrer votre vidéo à votre e-mail sans utiliser HTML5. Vous pouvez utiliser un faux bouton de lecture, un GIF animé avec un bouton de lecture, ou un bouton de lecture animé. Toutes ces options vous permettent de trouver la solution idéale pour vous et vos abonnés.