Modèles d'e-mails HTML pour logiciel en abonnement : 12 e-mails d'essai, d'équipe et de facturation, clair et sombre (HTML, MJML, texte brut, FR et EN)

Ces modèles s’adressent aux équipes produit, aux développeurs et aux indépendants qui construisent un logiciel vendu en abonnement et qui doivent écrire les e-mails qui accompagnent la vie d’un compte : le début et la fin d’un essai, l’invitation d’un collègue, le bilan de la semaine, le changement d’offre, la facture, la résiliation. Ils évitent de repartir de zéro dans un format où le code web habituel ne suffit pas : mise en page en tableaux, CSS en ligne, repli quand la messagerie retire les styles. Chaque modèle existe en français et en anglais, en source MJML, en HTML prêt à envoyer et en texte brut, avec un thème clair et un thème sombre dans le même fichier.

Ce pack complète les modèles d’e-mails HTML responsive, qui couvrent le compte et la boutique en ligne : bienvenue, confirmation d’adresse, mot de passe oublié, code de connexion, reçu de commande, téléchargement prêt, panier abandonné, paiement refusé, notification et newsletter. Les deux packs n’ont aucun modèle en commun. Ils sont construits de la même façon, avec la même construction MJML, la même palette et la même marque fictive : un logiciel en abonnement peut prendre l’inscription et la sécurité du compte dans le premier, puis l’essai, l’équipe et la facturation récurrente dans celui-ci, sans rupture visuelle entre les envois.

• 12 modèles, dont 9 e-mails transactionnels et des e-mails de suivi qui portent un lien de désabonnement :
  • Essai démarré (trial-started) ;
  • Fin d’essai proche (trial-ending) ;
  • Essai terminé (trial-ended) ;
  • Activation incomplète (activation-nudge), e-mail de suivi ;
  • Invitation d’équipe (team-invite) ;
  • Invitation acceptée (invite-accepted) ;
  • Rapport d’usage hebdomadaire (weekly-usage), e-mail de suivi ;
  • Changement d’offre (plan-changed) ;
  • Renouvellement à venir (renewal-upcoming) ;
  • Facture d’abonnement (subscription-invoice) ;
  • Résiliation confirmée (cancellation-confirmed) ;
  • Retour après résiliation (winback), e-mail de suivi.
• 2 langues, français et anglais, pour chaque modèle.
• 2 thèmes, clair et sombre, réunis dans chaque fichier HTML.
• 24 sources MJML et 6 fragments partagés : réglages communs, en-tête, pieds de page de service et de suivi en français et en anglais.
• 24 fichiers HTML compilés, CSS de base en ligne.
• 24 versions en texte brut, à joindre à chaque envoi.
• 24 aperçus HTML remplis avec des données d’exemple, et une page qui les rassemble.
• 48 captures PNG des modèles, à 320 et 600 px de large, en clair et en sombre.
• variables.md, la liste de toutes les variables, modèle par modèle, avec un exemple en français et en anglais, et compatibilite.md, ce qui a été mesuré et ce qui ne l’a pas été.

Aucun modèle ne contient d’image : l’en-tête affiche le nom de la marque en texte.

Organisation de l’archive :

mjml/fr/<modèle>.mjml
mjml/en/<modèle>.mjml
mjml/partials/<fragment>.mjml
html/fr/<modèle>.html
html/en/<modèle>.html
text/fr/<modèle>.txt
text/en/<modèle>.txt
preview/index.html
preview/fr/<modèle>.html
preview/en/<modèle>.html
captures/<modèle>-<320|600>-<light|dark>.png
variables.md
compatibilite.md

Le zip contient aussi le texte de la licence, un fichier LISEZMOI et les crédits.

Comment s’en servir

• Depuis le MJML, pour modifier la mise en page : chaque source inclut les fragments de mjml/partials/, si bien qu’une modification de l’en-tête ou du pied s’applique à tous les modèles. Compilez ensuite avec MJML, à installer à part (le kit a été compilé avec la version 5.4.1).
• Depuis le HTML compilé, sans MJML : les fichiers de html/ s’envoient tels quels une fois les variables remplacées. Collez-les dans votre outil d’envoi ou branchez-les dans votre code.
• Variables : le texte variable s’écrit {{nom_de_variable}}, un format lu tel quel par les moteurs de gabarits à doubles accolades. variables.md décrit chacune d’elles. Les variables de durée et de prix (trial_days, days_left, old_price, new_price) portent leur unité, pour que les accords restent justes au singulier comme au pluriel. Les lignes de la facture et du rapport hebdomadaire sont données en exemple : dupliquez la ligne ou utilisez la boucle de votre moteur.
• Marque : le nom affiché vient de {{brand_name}} ; les aperçus utilisent une marque fictive.
• Texte brut : envoyez le fichier de text/ comme partie texte du même message. Il reprend les titres, les liens des boutons et les mêmes variables que le HTML.
• Thème sombre : rien à activer. Le HTML passe en sombre quand la messagerie lit la préférence prefers-color-scheme et que le lecteur a choisi le mode sombre.
• Aperçus : ouvrez preview/index.html dans un navigateur pour voir les 12 modèles remplis.

Ce qui a été vérifié, et comment

Les mesures sont détaillées dans compatibilite.md. Elles ont été faites dans deux moteurs de navigateur, Chromium et WebKit, pas dans des messageries.

• Responsive : rendus à 320, 600 et 1 024 px, en clair et en sombre, sans débordement, dans une colonne de 600 px au plus ; les boutons font au moins 44 px de haut.
• Repli sans style : une fois tous les blocs <style> retirés, comme le font certaines messageries, les 24 fichiers HTML restent lisibles, sans débordement à 600 ni à 320 px. À 320 px, aucun mot n’est coupé, hors adresses web.
• Contraste : chaque texte, en clair, en sombre et en repli, atteint au moins 5,69:1.
• Espacements : marges, retraits, tailles de texte et interlignes suivent une même grille, vérifiée à 600 et 320 px.
• Poids : chaque fichier HTML reste sous le seuil de 102 Ko au-delà duquel certaines messageries coupent le message.
• Validité : HTML validé ; sources MJML en validation stricte, recompilées et comparées octet pour octet au HTML livré.
• Accessibilité : audit axe sur les 24 aperçus, en clair et en sombre, sans violation sérieuse ni critique. Les tableaux de mise en page portent role="presentation" ; les tableaux de données, comme celui de la facture, ont des en-têtes et une légende.

Outlook pour Windows, mode sombre et autres messageries

Le rendu réel dans chaque messagerie n’a pas été capturé : aucun service de captures multi-clients n’a servi. La compatibilité repose sur des règles de construction et sur la base publique caniemail, dont compatibilite.md reprend 58 entrées, avec le repli prévu pour chaque propriété mal prise en charge.

• Outlook pour Windows : son moteur de rendu n’a pas été testé, seules ses règles de construction connues sont appliquées. Les modèles lui fournissent des tableaux de largeur fixe dans des commentaires conditionnels écrits par MJML, et doublent fonds et largeurs par des attributs HTML.
• Messageries qui affichent le thème sombre, d’après la base et non d’après des captures : Apple Mail (macOS, iOS), Outlook (macOS, Outlook.com, iOS, Android) et Samsung Email (Android). Les versions d’Outlook de cette liste peuvent aussi ajuster les couleurs elles-mêmes.
• Messageries qui ne l’affichent pas : Gmail (web, iOS, Android), Outlook (Windows, Windows Mail), Yahoo! Mail (web, iOS, Android) et Thunderbird (macOS). Elles affichent la version claire, ou appliquent leur propre inversion des couleurs, qui n’a pas été mesurée.
• Sans media queries : l’e-mail s’affiche en clair, dans une colonne fluide, lisible à toute largeur.
• Montants sur une ligne : certaines messageries ignorent la règle qui garde les montants sur une seule ligne ; sur un écran étroit, ils peuvent alors passer à la ligne, sans que rien soit masqué.

E-mails de suivi

L’activation incomplète, le rapport d’usage hebdomadaire et le retour après résiliation sont des e-mails de suivi, plus proches d’un envoi marketing que d’un message de service. Ils supposent en général le consentement préalable du destinataire, ou une relation client existante selon les cas, et un moyen de se désabonner à chaque envoi. Leur pied fournit un lien de désabonnement ({{unsubscribe_url}}) et l’identité de l’expéditeur, mais il ne remplace ni la gestion des désabonnements par votre outil d’envoi, ni l’en-tête de désabonnement en un clic que demandent les grandes messageries pour les envois en volume. Adaptez la phrase qui explique pourquoi le destinataire reçoit l’e-mail. Ces modèles ne garantissent pas à eux seuls la conformité de vos envois.

À savoir

• Testez vos envois avec votre outil d’envoi avant une campagne : aucune capture n’a été faite dans une messagerie.
• La délivrabilité (filtres de courrier indésirable, authentification de l’expéditeur) dépend de votre outil d’envoi et de votre domaine, pas des modèles.
• Les phrases qui décrivent un fonctionnement (conservation des projets, fin d’un essai, prélèvement, résiliation) sont des exemples neutres : adaptez-les à votre produit.
• La facture d’abonnement ne contient aucune mention légale : le libellé « Taxes », le calcul et les mentions que doivent porter vos factures dépendent de votre situation et restent à votre charge.
• Seule l’invitation d’équipe porte un lien en clair sous le bouton, parce que son lien contient un jeton ; les autres boutons mènent à des pages du compte, accessibles aussi depuis l’application.
• Ni MJML ni outil d’envoi ne sont inclus, et le kit ne contient pas de fichier de maquette pour un logiciel de design.

Fabrication et IA

Les textes en français et en anglais, les sources MJML, le HTML compilé et les scripts de génération et de contrôle ont été produits avec un assistant d’IA (Claude Code), puis relus et contrôlés : empreinte de chaque fichier, recompilation des sources comparée au HTML livré, rendus dans deux moteurs à plusieurs largeurs, contrastes, audit d’accessibilité, relecture des textes, planches relues à l’œil. Aucune image n’a été produite par un générateur d’images : les captures sortent des scripts du kit.

• MJML : 24 sources et 6 fragments, à compiler avec MJML.
• HTML : 24 fichiers, une colonne de 600 px au plus, fluide en dessous, CSS de base en ligne, polices système, à coller dans un outil d’envoi ou à brancher dans votre code.
• Texte brut : 24 fichiers .txt en UTF-8, lignes de 78 caractères au plus.
• PNG : 48 captures.
• Variables au format {{…}}, pour les moteurs de gabarits à doubles accolades.

Les modèles sont vendus avec la licence commerciale : vous pouvez les modifier et les utiliser pour vos envois comme pour ceux de vos clients, dans vos projets personnels et professionnels, mais pas les revendre, les redistribuer ni les publier comme modèles réutilisables (galerie de modèles, dépôt public), même gratuitement.

• Modèles d’e-mails HTML responsive : newsletter et e-mails transactionnels : le compte et la boutique (bienvenue, confirmation d’adresse, mot de passe, code de connexion, reçu, paiement refusé), construits de la même façon que ce pack et sans modèle en commun avec lui.

1.0.0 (11 novembre 2026) : première version.