E-mailing : pourquoi il faut passer au responsive

Pour optimiser ses campagnes e-mailing, rendre ses emails adaptatifs est une première étape. Une démarche de "responsive email" sera en revanche encore plus performante, quoique plus onéreuse à mettre en place.

Avec un ROI estimé à 122% 1 en moyenne, l’e-mail confirme encore et toujours sa rentabilité comme canal de vente. Malgré une relative saturation (82 e-mails reçus par jour en moyenne), les consommateurs y restent très attachés.

Avec la part croissante du mobile dans la vie des consommateurs, la lecture des e-mails sur mobile devient une norme. Qui n’a jamais été frustré sur mobile par un e-mail qui nécessitait un dézoom pour être consulté ou bien dont la mise en page était catastrophique (police trop petite, image mal placée…) ? 37% des consommateurs déclarent s'être désinscrit aux e-mails d'une marque car ils ne s'affichaient pas correctement sur leur mobile.

‍

‍

E-mails adaptatifs : une première étape

Afin d’apporter une expérience client de qualité sur mobile et donc d’augmenter son taux de clic, le premier travail qui peut être réalisé avec un coût réduit est de rendre les e-mails adaptatifs. Un e-mail adaptatif s’affichera de la même manière sur un ordinateur, sur une tablette ou sur un mobile. Les textes et images auront les mêmes placements.

A défaut d’une grande visibilité du texte (s’il y en a beaucoup) et du Call to Action (CTA), la mise en forme restera identique d’un périphérique à l’autre.

Les recommandations pour les designers d'e-mails adaptatifs sont les suivantes :

• Penser ses CTA non comme clickable mais "pushable" : il faut en effet s’assurer qu'ils soient lisibles et suffisamment larges pour être utilisés sous mobile,
• Utiliser un template avec une seule colonne avec une largeur maximale de 600 px,
• Utiliser des images légères et avec peu de textes : cela améliorera la rapidité de chargement de l'e-mail mais aussi sa lisibilité,
• Ne pas hésiter à utiliser des tailles de police supérieures à 10.

‍

‍

Toutefois, c’est manquer l’occasion de profiter de la résolution des desktops pour afficher plus d’informations en particulier au-dessus de la ligne de flottaison.

‍

E-mails responsive : la panacée

Le responsive est naturellement l’étape suivante. Il permet d’afficher une mise en forme spécifique sur ordinateur et une autre davantage mobile-friendly sur tout périphérique à taille réduite.

‍

‍

L'expérience globale des clients, en responsive, se verra renforcée. Des tests suggèrent un impact fort : jusqu'à 130% d’augmentation des taux de clic sur un A/B test avec et sans responsive 2.

Attention, cela implique toutefois des coûts de production de campagnes plus élevés :

• 2 wireframes et maquettes par campagne : 1 version desktop et 1 version mobile,
• Une plus grande complexité dans l’intégration des e-mails avec davantage d’utilisation des CSS et des media queries.

‍

Les e-mails responsive sont-ils supportés par tous les clients e-mails et webmail ?

La réponse est malheureusement négative mais la situation évolue très rapidement. Fin 2016, Gmail annonçait le support des e-mails responsive sur son webmail et sur ses différentes applications mobile (enfin !). De son côté, Microsoft et son Outlook 2016 les supportent uniquement sous Mac et non sous PC.

Pour les webmails les plus utilisés en France :

‍

‍

Pour les clients e-mails natifs :

‍

‍
‍

Des outils d’aide à la conception d’e-mails responsive

La majeure partie des outils d’e-mailing, avec l’édition en drag-n-drop, savent générer directement des e-mails responsive. Cependant, le résultat n’est pas toujours celui attendu et demande des ajustements à l’aide de codes CSS spécifiques.

Voici quelques outils qui aideront les intégrateurs :

• Litmus : la référence sur le marché qui génère en temps réel le résultat sur la plupart des clients natifs et webmails avec une bibliothèque fournie d’exemple et un blog réputé et très actif
• EmailonAcid : un concurrent de très bonne qualité, similaire à Litmus. En revanche, la prévisualisation avec le lecteur webmail d’Orange n’est pas supportée
• mjml.io : créé par Mailjet, il s’agit d’un outil très intéressant qui propose de formater l’e-mail sous un XML normé et qui génère un code HTML d’e-mail responsive compatible avec beaucoup de clients e-mails et webmail

Pour conclure, il est impératif de penser à offrir la meilleure expérience mobile même à travers les e-mails. Toutefois, il est important d’avoir en tête le parcours de l’utilisateur après son clic sur l’e-mail. Ce parcours est-il responsive ? Adapte-t-on le contenu et le parcours au mobile ?

‍

Sources :

• Direct Marketing Association (DMA) and Demande Metric, "2016 Response Rate Report" July 28, 2016
• https://litmus.com/blog/responsive-design-ab-testing-leads-to-a-130-increase-in-clicks
• http://www.journaldunet.com/ebusiness/le-net/1190363-quels-sont-les-services-mails-preferes-des-francais/

‍