C’est la suite logique de votre processus de conception de message. Vous avez rédigé votre e-mail, il a été designé ; maintenant, pour qu’il soit utilisable, il va falloir transformer ce design en fichier HTML.
Comprenez les limites de l’intégration HTML pour un e-mail
Dans un e-mail, on utilise de l’HTML (HyperText Markup Language) comme sur le Web. Mais l’histoire de l’HTML pour l’e-mail est truffée d'embûches, et l’une d’entre elles commence en 2007, lorsque Microsoft a mis à jour son application Outlook, et a créé dans la foulée de nombreuses années de cheveux arrachés par les intégrateurs e-mail !
En effet, avec Outlook 2007, Microsoft décide d’utiliser comme moteur de rendu HTML (le logiciel qui traduit le code HTML en contenu graphique) celui de la suite Office, au lieu de celui d’Internet Explorer qui était utilisé jusque là. Des éléments aussi basiques que les gifs animés ne sont plus lus, de nombreux bugs font sauter l’affichage de codes pourtant totalement valides.
Mais la complexité de l’intégration HTML pour l’e-mail ne vient pas que de Microsoft et d’Outlook. Sur le Web, vous vous rendez volontairement sur un site. Avec l’e-mail, c’est l’inverse, c’est le message qui vient à vous. Cela pose un important problème de sécurité. Des pirates pourraient essayer de vous envoyer des messages avec des codes malicieux afin de vous installer des virus, de vous espionner… et plein d’autres idées du même style.
Les messageries ont donc besoin de limiter les risques. C’est pour cela par exemple qu’il est impossible d’exécuter du JavaScript dans un e-mail. Mais ça va plus loin. Entre le code que vous envoyez via votre e-mail et celui qui sera effectivement reçu par le destinataire, il y a souvent une différence. Parfois, une partie de celui-ci sera ignoré, quand ce n’est pas simplement supprimé.
C’est pourquoi il est malheureusement obligatoire d’utiliser des tableaux pour assembler un e-mail en HTML. Une technique déjà sur le déclin pour le Web… dans la première moitié des années 2000…
Si l’on mixe cette réalité avec le fait qu’aujourd’hui on ne peut plus se permettre d’envoyer un e-mail qui ne s’affiche pas parfaitement en version responsive sur un terminal mobile… on comprend la complexité de l’exercice.
Heureusement, il existe de nombreuses ressources permettant de connaître le support des différentes fonctionnalités de l’HTML dans les différentes messageries.
Citons :
caniemail.com: Can I email rassemble toutes les balises HTML et les propriétés CSS ; pour chacune d’elles, le site vous présente le pourcentage de compatibilité en fonction des parts de marché des clients e-mail, et vous donne le détail du support ;
Campaign Monitor : le routeur australien maintient un guide des différentes propriétés CSS avec le support associé à chaque client e-mail (liens en anglais).
Quoi qu’il arrive, connaître votre audience vous permettra de mieux cibler les techniques d’intégration HTML dont vous aurez besoin.
Choisissez un email builder pour aller plus vite ou industrialiser la production
On vient de le voir, l’intégration HTML pour l’e-mail n’est pas une discipline évidente. De plus, tout le monde n’a pas les compétences pour y arriver. La bonne nouvelle, c’est qu’il existe une grande quantité d’outils qui vous permettront d’éviter de mettre les mains dans du code.
Leurs avantages, c’est qu’ils sont souvent simples à prendre en main et que dans bien des cas, ils vous feront gagner beaucoup de temps. La contrepartie, c’est que vous vous sentirez parfois limité au niveau créatif, et que dans certains cas vous risquez d’avoir des e-mails qui ressemblent à ce que tout le monde fait. Pas toujours évident pour vous démarquer de la concurrence.
L’email builder de votre solution de routage
Un grand nombre de solutions de routage d’e-mails ont conçu des email builders au sein de leur environnement. Bien souvent, ce sont les plateformes dédiées aux PME-TPE qui ont les solutions les plus abouties.
Par contre, les solutions plus pointues, utilisées plutôt par de grandes entreprises, ont rarement un email builder performant et ergonomique. Leurs clients préférant la plupart du temps passer par des agences ou des solutions spécialisées.
Dans les solutions de routage fréquemment utilisées en France et qui ont un email builder simple à utiliser, on citera par exemple :
Sendinblue ;
MailChimp ;
Mailjet ;
Sarbacane ;
Message Business.
Des solutions dédiées et souvent gratuites
Outre les routeurs, il existe plusieurs start-up qui se sont mises à créer des e-mail builders, plus simples encore, plus performants, plus riches. Ils sont dédiés aux entreprises et e-mail marketers qui ont besoin de créer des e-mails depuis zéro, ou en utilisant des gabarits proposés par les plateformes.
On retrouve par exemple dans ces solutions :
Des solutions pro, destinées à l’industrialisation
Pour les entreprises ayant les besoins les plus pointus en matière de design, de respect des chartes graphiques, d’industrialisation de la production, de traduction des gabarits… il existe aussi quelques solutions d’email builders qui leur sont dédiées. On notera par exemple :
Intégrez votre e-mail directement en HTML pour maîtriser vos créations
L’autre solution, qui en fait est la plus classique, est de coder l’HTML “à la main”. C’est-à-dire de prendre (ou de concevoir) un design, de le découper, et de le développer en HTML de A à Z. Malheureusement, nous n’aurons pas l’occasion de traiter cet aspect dans ce cours : il mériterait un cours à lui seul.
Pour y parvenir, il vous faudra évidemment avoir les bases du code HTML, mais aussi acquérir de solides compétences spécifiques à l’e-mail. Heureusement, il existe de nombreuses ressources sur Internet qui vous permettront d’évoluer.
Testez l'intégration HTML d’un e-mail
Une fois que vous avez le code HTML de votre e-mail, il faut absolument tester son rendu dans les différents environnements.
Pour cela, vous pourriez vous envoyer des e-mails de test à différentes boîtes e-mail afin d’essayer de tester le plus d’environnements différents. Malheureusement, c’est un travail fastidieux, et il est compliqué de réussir à tester l’ensemble des clients e-mail.
Il y a donc des entreprises qui se sont spécialisées dans les tests d’e-mail rendering (tests de rendu e-mail). Nous allons en citer deux qui constituent les outils les plus utilisés sur le marché :
L’idée est simple : sur ces plateformes, vous allez charger votre code HTML, et celles-ci se chargent de générer des captures d’écran sur une quarantaine des clients e-mail. Vous pouvez aussi envoyer un e-mail de test depuis votre routeur e-mail directement à ces solutions qui, à nouveau, vous proposeront les fameuses captures d’écran.
En résumé
L'e-mail n'est pas le Web.
Le codage d'un e-mail est rarement apprécié par les développeurs web.
Plusieurs solutions d'email builders existent, afin de vous éviter de coder en HTML.
Il vous faudra acquérir des compétences spécifiques si vous désirez coder en HTML pour l'e-mail.
Il faut tester votre code dans les différents clients e-mail.
Il existe des solutions d'email rendering pour automatiser les tests de rendu.
Dans la prochaine partie de ce cours, nous allons aborder l’envoi de vos messages. Mais avant d’en arriver là, nous explorerons les différentes solutions d’envoi d’e-mail.
