Découvrez le MJML, un langage fait pour les emails

Designer un email, est-ce si compliqué ?

En un mot : Oui ! Et la raison pour cela est très simple : il y a beaucoup trop de clients différents avec d’énormes problèmes de rétro-compatibilite. Quand vous faites un site web, vous avez à vous préoccuper de quelques versions de navigateurs, rien d’insurmontable en soi mais quand vous faites un email, vous avez à vous préoccuper de chaque navigateur, mais aussi chaque web mail, chaque messagerie bureau (outlook, thunderbird, outlook, OUTLOOK), chaque application mobile.

Voir les sujets sur l’emailing

Résultat ? Les emails, qui ne sont finalement « que » du HTML, sont fait avec un code HTML tout droit issu de 1998, où les tables font la loi et ou le CSS n’est que l’ombre de lui-même. En parlant de CSS, ai-je précisé que ce dernier doit être inséré inline pour plus de compatibilité avec Gmail . Et encore, je ne parlerais pas des ratios html/images/texte à respecter pour que les emails ne soient pas considéré comme des spams….

Heureusement, de gentils développeurs nous ont pris en pitié, et ont déjà fait pas mal d’outils pour nous simplifier la tâche. Zurb (les papas de Fondation) ont par exemple sorti Ink Fondation for email, qui propose un framework responsive, quelques templates et des outils permettant de passer le CSS inline automatiquement, sans avoir à le faire durant le développement.

Découvrez le MJML, un langage fait pour les emails

Entre un framework et carrément un nouveau langage, le MJML est une solution bien plus radicale. Son objectif est de rendre la création d’emails responsifs en retirant tout ce qui nous complique la tâche : les tables, les propriétés CSS obligatoires pour que notre email ressemble à quelque chose, et j’en passe.

Niveau language, le MJML n’est finalement que du HTML avec de nouveaux éléments, pas de quoi perdre un intégrateur. Le CSS se retrouve de nouveau inline, mais réduit au stricte minimum, et vous laisse donc une template lisible. Si vous avez envie de rester DRY et ne pas répéter votre style pour chaque element en ayant besoin, il est possible de créer ses propres éléments, mais cela demandera quelques connaissances en Javascript et un peu plus de travail.

Évidemment, il est nécessaire de compiler le résultat avant de l’envoyer, mais si vous passiez déjà votre CSS inline avec un outil, cela ne vous changera pas grand-chose. Le seule point qui ne bloquera peut-être personnes sera l’installation de Node js, mais vu le nombre d’outils l’utilisant, il serait peut-être temps de s’y mettre.

Mon avis

Simple à installer (si vous avez déjà node js sur votre poste), simple à utiliser et doté d’une bonne courbe d’apprentissage pour toute personne voulant se donner la peine de le maitriser totalement, le MJML a définitivement tout compris.

Toute personne ayant déjà eu à intégrer un email le sait, nous avions grandement besoin d’un nouvel outil pour cette tache. Le MJML fonctionne, tient ses promesses, je ne vois vraiment aucune raison de ne pas l’utiliser pour toutes vos templates emails.

Bien sur, vous vous sentirez peut-être parfois légèrement limité pour mettre en place certains effets (chevauchements, …), mais les mails ne sont vraiment pas le bon endroit pour ce genre de pirouettes de toute manière.