Créer un email est, aujourd’hui encore, une tâche délicate. Il doit être lisible aussi bien sur votre ordinateur que sur votre téléphone, et ajoutez à ça une jungle de clients mail avec des contraintes spécifiques à chacun et parfois incompatible entre eux. Certains ne supportent pas forcément tous les attributs CSS, il faut donc passer par des moyens détournés pour avoir des équivalents. Les clients historiques comme les Outlook 2008/2011, qui sont basés sur le moteur de Word pour le rendu HTML, ont des comportements encore aujourd’hui imprévisibles.
Développé par Mailjet en collaboration avec Dernier Cri, MJML est un framework open-source qui a pour but de proposer une manière élégante d’écrire des emails responsives. Les fondations de MJML et son approche orientée composant ont permis de créer l’éditeur WYSIWYG d’email Passport, qui propose aujourd’hui une vraie solution de création d’email responsive à la portée de tout utilisateur.
Aujourd’hui, plus de 50% des emails sont ouverts sur des téléphones. Il ne faut donc pas négliger leur rendu sur ces plateformes. Il faut également prendre en compte l’accessibilité d’un email : éviter de devoir zoomer sur son téléphone pour avoir accès à l’information par exemple. C’est un enjeu capital pour les campagnes marketing pour permettre aux clients de pouvoir lire les emails dans de bonnes conditions.
Une syntaxe légère
L’idée était de proposer un nouveau langage proche de l’HTML, avec une sémantique propre à l’email, et d’avoir une prise en main simple et rapide. Contrairement à l’usage courant dans la construction d’un site responsive, MJML a fait le choix de se passer d’un système de grille en découpant l’email en sections à l’horizontale et des colonnes ajustable à la verticale qui accueilleront le contenu. En mobile, les colonnes viennent s’empiler et vont prendre toute la largeur de l’écran, ce qui rend leur contenu plus lisible sur un écran de petite diagonale. Il est également possible d’avoir un rendu multi colonnes en mobile en utilisant une balise prévue à cet effet.
Et modulaire
MJML reste un langage extensible par défaut. En effet, il est constitué d’une bibliothèque de composants qui couvre une grande partie des cas d’utilisation mais elle peut être étendue grâce aux contributions de la communauté. Cela permet également d’ajouter des balises à MJML facilement.
Si le rendu d’une balise ne vous plaît pas, libre à vous de le remplacer par votre implémentation avec des nouveaux paramètres ou un nouveau rendu.
Son avenir
MJML n’a pas encore les réponses à toutes les problématiques du développement d’email. Il propose néanmoins un tooling plutôt complet : transpilation des documents à chaque modification apportée au fichier, et une application desktop est également disponible. MJML va également se doter prochainement d’une couche de validation permettant d’éviter les attributs qui n’existent pas ou les balises mal utilisées, ce qui simplifiera le quotidien des utilisateurs. Enfin, une fonctionnalité très attendue par la communauté est de pouvoir saisir du CSS pour le rendu HTML, cela arrivera également dans la prochaine version.
Vous l’aurez compris, nous cherchons à améliorer MJML pour qu’il devienne un framework incontournable pour les intégrateurs d’email. Si vous avez des remarques ou des améliorations n’hésitez pas à les soumettre sur le GitHub du projet ou rejoignez nous sur le Slack de la communauté !
Pour commencer à coder votre premier email en MJML, nous vous invitons à suivre le tutoriel sur le site de MJML ou le tutoriel plus complet sur la documentation de MJML !
