Email Builder : créez des emails professionnels en drag-and-drop

Qu’est-ce qu’un email builder ?

Un email builder (aussi appelé éditeur email, constructeur d’email ou email template builder) est un outil qui permet de concevoir des emails marketing ou transactionnels visuellement, sans maîtriser le code HTML ou CSS. L’interface propose des blocs glissables (texte, image, bouton, séparateur, colonnes) que vous assemblez par drag-and-drop pour composer la structure de votre message.

Définition et différence avec un éditeur HTML pur

Un éditeur HTML email pur demande d’écrire le code source en HTML avec du CSS inline, de gérer manuellement les contraintes des clients de messagerie (Outlook, Gmail, Apple Mail) et de tester chaque rendu. C’est un outil réservé aux développeurs. Un éditeur email drag-and-drop ou WYSIWYG (What You See Is What You Get) génère ce code à votre place : vous voyez directement le rendu final pendant la conception, sans jamais toucher au HTML sous-jacent.

MJML se situe entre ces deux approches. Il s’agit d’un framework open source dédié à la création d’emails responsives. Il permet aux développeurs de concevoir des emails à partir d’une syntaxe simplifiée, puis de générer automatiquement le code HTML nécessaire à leur affichage sur les principales messageries. MJML facilite ainsi le développement d’emails compatibles avec différents environnements, sans nécessiter l’écriture manuelle de tout le HTML spécifique à l’emailing.

Email builder vs MJML vs code custom

Les email builders hybrides combinent les deux : une interface drag-and-drop pour les non-techniciens et un accès au code HTML pour les développeurs qui souhaitent affiner. Foundation for Emails et AMP for Email sont des frameworks avancés pour des cas spécifiques (interactivité dans l’email), mais ils restent réservés aux équipes techniques.

Pourquoi utiliser un email builder

Dans la plupart des organisations, les équipes marketing sont rarement composées de développeurs. Un outil de création email visuel permet à chacun de produire des campagnes sans dépendre de la DSI : modification d’un template, mise à jour d’un visuel, ajout d’un bloc promotionnel. Le gain de temps est immédiat. La cohérence de marque est également plus facile à maintenir via les couleurs de charte graphique partagées au niveau du compte et les blocs sauvegardés, que si chaque email était recodé à la main.

Quelles fonctionnalités essentielles attendre d’un email builder ?

Blocs en drag-and-drop visuel (sans coder)

Le coeur d’un bon email builder responsive est son interface de composition. Les blocs prédéfinis (texte, image, bouton CTA, séparateur, colonnes) se glissent dans la structure de l’email par simple cliquer-déposer. Les sections et colonnes définissent la grille du message. Tout ajustement de style (couleur, police, espacement, bordure) se fait via des panneaux de propriétés, sans toucher au CSS. L’aperçu WYSIWYG reflète en temps réel le rendu final.

Bibliothèque de templates et blocs prêts à l’emploi

Une bibliothèque de templates préconstruits accélère la production : newsletter, email promotionnel, invitation événement, email de bienvenue, relance panier. La fonctionnalité de blocs sauvegardés permet de conserver des éléments récurrents (header, footer, bloc produit, signature) et de les réinjecter en un clic dans n’importe quel email. Un bloc sauvegardé peut être verrouillé (seul son propriétaire peut le modifier, et toute mise à jour se répercute automatiquement sur tous les emails qui l’utilisent) ou non verrouillé (modifiable librement dans chaque email, sans impact sur les autres). Les couleurs de votre charte graphique sont enregistrées au niveau du compte et accessibles à tous les utilisateurs depuis l’éditeur.

Personnalisation et merge tags

Les merge tags permettent d’insérer des données dynamiques dans le contenu de l’email : prénom du destinataire, entreprise, offre personnalisée, date d’expiration. Un bon email template builder expose ces variables directement dans l’interface de composition, sans obliger à éditer le HTML. Le contenu conditionnel (afficher un bloc uniquement si le contact appartient à un segment donné) est la version avancée de cette personnalisation.

Preview multi-clients et dark mode

Le rendu d’un email varie significativement selon le client de messagerie utilisé par le destinataire : Outlook desktop (versions 2016, 2019, 2021), Gmail web et mobile, Apple Mail sur iOS et macOS, Yahoo Mail. Un email builder sérieux propose un preview en temps réel pour les principaux clients, ainsi qu’une prévisualisation dark mode : de nombreux utilisateurs lisent leurs emails en thème sombre, et un design non adapté peut rendre le texte illisible ou les images sans fond blanc invisibles.

Test de rendu (Litmus / Email on Acid)

Les outils de render testing comme Litmus et Email on Acid capturent des screenshots réels du rendu de votre email dans des dizaines de clients de messagerie et versions (Outlook 2016, OWA, Gmail Android, Apple Mail macOS Sonoma, Samsung Mail, etc.). Ils identifient les bugs d’affichage avant l’envoi. Certains email builders intègrent nativement ces tests dans leur workflow de création.

Blocs accessibles et accessibilité numérique

Un email accessible permet à chaque destinataire de consulter et de comprendre votre message, quelles que soient ses capacités ou les technologies qu’il utilise. L’accessibilité numérique constitue ainsi un enjeu important pour concevoir des campagnes plus inclusives. Welkom Editor propose une vingtaine de blocs accessibles préconfigurés, identifiés dans la bibliothèque par la mention « Bloc accessible ». Leur paramétrage (taille de texte, interlignage, contrastes de couleur) respecte d’emblée les recommandations d’accessibilité numérique (WCAG), pour que vos emails soient correctement lus par l’ensemble de votre audience, y compris par les personnes utilisant des lecteurs d’écran.

Comment créer un email avec l’email builder Campaign

Welkom Editor est l’éditeur email intégré à la plateforme Campaign. Voici le flux de création complet.

Étape 1 : choisir un template ou partir de zéro

Sélectionnez un template dans la bibliothèque préconstruite (newsletter, email transactionnel, invitation, relance) ou démarrez depuis une page blanche. Les templates de Welkom Editor intègrent déjà les bonnes pratiques de structure, ce qui réduit significativement le temps de production.

Étape 2 : construire la structure (sections et colonnes)

Composez la structure de votre email en ajoutant des sections (rangées horizontales) et des colonnes (divisions verticales au sein d’une section). Une colonne unique convient pour les emails transactionnels épurés ; deux ou trois colonnes permettent des mises en page plus riches pour les newsletters et emails promotionnels.

Étape 3 : ajouter du contenu (texte, image, CTA)

Glissez vos blocs de contenu dans les colonnes : texte formaté, images optimisées (PNG, JPG, WebP servies via CDN), boutons CTA, vidéos miniaturisées, icônes SVG. Chaque image doit peser le moins possible et être optimisée pour le web. Le poids total du HTML doit rester sous 100 ko pour éviter la troncature Gmail et préserver la délivrabilité. Consultez nos bonnes pratiques pour optimiser la visibilité des images.

Étape 4 : personnaliser avec merge tags et contenu dynamique

Insérez des merge tags (variables) pour personnaliser le message (prénom, nom de l’entreprise, offre sur mesure). Ajoutez du contenu conditionnel pour afficher des blocs différents selon le segment du destinataire.

Étape 5 : tester le rendu et envoyer

Avant envoi, vérifiez le rendu sur les principaux clients de messagerie (Outlook, Gmail, Apple Mail, Yahoo Mail) via la preview intégrée. Envoyez un email test à votre boîte personnelle. Vérifiez les mentions obligatoires (désabonnement, identité de l’expéditeur, etc.). Lancez ensuite l’envoi depuis Campaign, avec les ciblages et plannings configurés.

7 bonnes pratiques de design email

1. Mobile-first : plus de 60 % des emails sont ouverts sur mobile. Concevez d’abord le rendu mobile, puis adaptez au desktop. Vérifiez que les boutons CTA sont suffisamment grands (minimum 44 px de hauteur) et que la taille de police reste lisible (minimum 14 px pour le corps de texte).
2. Dark mode : prévisualisez systématiquement votre email en thème sombre. Utilisez des images avec fond transparent (PNG) plutôt que des fonds blancs durs. Testez les couleurs de texte pour garantir le contraste en mode clair et en mode sombre. L’accessibilité (normes WCAG et recommandations W3C) inclut ce point.
3. Hiérarchie visuelle et CTA contrasté : un email efficace a un seul CTA principal, visuellement isolé, avec un contraste de couleur suffisant. Évitez les emails surchargés avec plusieurs boutons de même importance.
4. Poids HTML sous 100 ko : Gmail tronque les emails au-delà de 102 ko, ce qui cache le pied de page (y compris le lien de désabonnement) et nuit à la délivrabilité. Allégez le code généré par votre email builder et optimisez vos images.
5. Alt text systématique : renseignez l’attribut alt (texte alternatif) de toutes les images. Certains clients de messagerie (notamment Outlook en environnement corporate) bloquent les images par défaut : votre email doit rester lisible et compréhensible sans elles.
6. Cohérence avec la charte graphique : couleurs, typographies et ton doivent être identiques à votre site et vos autres supports. Une charte graphique centralisée dans votre email builder garantit cette cohérence sans effort supplémentaire.
7. Test sur Outlook : Outlook desktop (2016, 2019, 2021) est le client le plus capricieux du marché : il utilise le moteur de rendu de Word, pas un moteur web. Certains CSS ne sont pas supportés. Testez toujours sur Outlook avant envoi, surtout si votre audience est en environnement Microsoft 365.

Email Builder Dolist : ce qui le différencie

Intégration native avec Campaign et la délivrabilité

Welkom Editor est l’email builder directement intégré à la plateforme Campaign. Il n’y a pas d’export/import entre l’éditeur et la plateforme d’envoi : votre email est créé, testé et envoyé dans le même environnement. Les données de délivrabilité email (réputation d’expéditeur, gestion des bounces, désabonnements) sont nativement connectées à chaque envoi. Contrairement aux email builders SaaS indépendants (Stripo, BEE Free, Unlayer, Mosaico) qui nécessitent une intégration tierce avec votre routeur, Campaign est un outil tout-en-un.

Bibliothèque de templates

La bibliothèque de templates de Welkom Editor est pensée pour les usages les plus courants en France : newsletters institutionnelles, invitations à des webinaires et événements, emails d’onboarding client, relances commerciales, alertes et notifications. Ces templates intègrent les mentions légales obligatoires et les bonnes pratiques de structure dès le départ.

Couleurs de charte graphique et blocs sauvegardés

Les couleurs de votre charte graphique s’enregistrent au niveau du compte Campaign et sont accessibles à tous les utilisateurs depuis le builder, via la catégorie « Blocs sauvegardés ». Code hexadécimal ou sélecteur visuel : toute couleur ajoutée est immédiatement disponible pour tous les emails et landing pages du compte. Les blocs sauvegardés permettent de partager des composants récurrents entre utilisateurs (header, footer, signature) : les blocs verrouillés sont maintenus centralement, les mises à jour se propagent automatiquement à tous les emails qui les utilisent.

Hébergement français et RGPD natif

Toutes les images hébergées dans Welkom Editor et les données de tracking sont stockées en France, sans transfert vers des pays tiers. La plateforme Campaign intègre nativement la gestion des consentements, des désabonnements et des préférences de contact, conformément au RGPD. Consultez notre guide conformité RGPD pour les équipes email marketing.

Tarifs Email Builder Dolist

Inclus dans Campaign

Welkom Editor, l’email builder de Dolist, est inclus dans la plateforme Campaign. Il n’y a pas de coût additionnel pour accéder à l’éditeur, aux templates ou aux blocs réutilisables. Le tarif de Campaign dépend du volume d’envoi et du nombre de contacts gérés. Contactez l’équipe Dolist pour obtenir un devis adapté à votre volumétrie et votre secteur.

Démo gratuite et accompagnement design

Une démonstration personnalisée de Welkom Editor est disponible sur demande : un consultant Dolist vous montre l’interface et répond à vos questions techniques. Des formations à l’utilisation de Campaign, certifiées Qualiopi, sont également disponibles pour autonomiser vos équipes rapidement.