Modèles d’e-mails AWS SES – Guide complet

Apprenez à créer, tester et déployer des modèles professionnels pour Amazon Simple Email Service

Voir des exemples de modèles Commencer avec l’éditeur gratuit →

Comprendre les modèles AWS SES

Tout sur le système de modèles de SES

Qu’est-ce qu’un modèle SES ?

Les modèles AWS SES sont des mises en page d’e-mails réutilisables, stockées dans votre compte AWS. Ils prennent en charge le contenu dynamique via la syntaxe Handlebars, ce qui permet des e-mails personnalisés à grande échelle.

  • Store up to 10,000 templates per AWS account
  • Maximum template size: 500KB
  • Support for HTML and plain text versions
  • Built-in versioning and update capabilities

Syntaxe Handlebars

SES utilise le templating Handlebars pour insérer du contenu dynamique :

Hello {{name}},

Your order #{{orderNumber}} totaling {{total}} has been confirmed.

{{#each items}}
  - {{this.name}}: {{this.price}}
{{/each}}

{{#if isPremium}}
  Thank you for being a premium member!
{{/if}}

Types de modèles courants

Des modèles pour tous les besoins métiers

E-mails transactionnels

  • Order confirmations
  • Password resets
  • Account notifications
  • Payment receipts
  • Shipping updates

E-mails marketing

  • Newsletters
  • Product launches
  • Promotional offers
  • Event invitations
  • Survey requests

Notifications système

  • Security alerts
  • System status updates
  • Error notifications
  • Backup confirmations
  • Usage reports

Exemples de code de modèles

Des modèles prêts pour la production à utiliser dès aujourd’hui

Basic SES Template Structure

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>{{subject}}</title>
    <style>
        body { font-family: Arial, sans-serif; }
        .container { max-width: 600px; margin: 0 auto; }
        .header { background: #007bff; color: white; padding: 20px; }
        .content { padding: 20px; }
        .footer { background: #f8f9fa; padding: 20px; text-align: center; }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <h1>{{companyName}}</h1>
        </div>
        <div class="content">
            <p>Hello {{customerName}},</p>
            <p>{{messageBody}}</p>
            {{#if ctaButton}}
            <a href="{{ctaLink}}" style="background: #007bff; color: white; padding: 10px 20px; text-decoration: none; border-radius: 5px;">{{ctaButton}}</a>
            {{/if}}
        </div>
        <div class="footer">
            <p>© {{year}} {{companyName}}. All rights reserved.</p>
        </div>
    </div>
</body>
</html>

Défis courants des modèles d’e-mails

Problèmes rencontrés par les développeurs et comment les résoudre

⚠️

Problèmes d’affichage sur Outlook

Outlook utilise le moteur de rendu de Microsoft Word, ce qui peut casser le CSS moderne.

Solution :
  • Use table-based layouts
  • Inline CSS styles
  • Conditional comments for Outlook
  • Test with Litmus or Email on Acid
⚠️

Coupure Gmail à 102 Ko

Gmail coupe les e-mails de plus de 102 Ko et masque du contenu.

Solution :
  • Minimize HTML and CSS
  • Remove comments and whitespace
  • Host images externally
  • Use CSS shorthand properties
⚠️

Compatibilité en mode sombre

Les clients e-mail gèrent différemment le dark mode, ce qui peut casser les designs.

Solution :
  • Use transparent PNGs
  • Add dark mode meta tags
  • Test color contrast
  • Use @media (prefers-color-scheme)
⚠️

Blocage des images

De nombreux clients e-mail bloquent par défaut les images.

Solution :
  • Always use alt text
  • Design for images-off viewing
  • Use HTML/CSS for buttons
  • Include text-based CTAs

Bonnes pratiques pour les modèles d’e-mails

Liste de contrôle essentielle pour des modèles professionnels

Conception et mise en page

  • Single column layout for mobile
  • 600px maximum width
  • 14px minimum font size
  • 44px minimum touch targets
  • High contrast colors (4.5:1 ratio)

Exigences techniques

  • Inline CSS styles
  • Table-based layout
  • UTF-8 character encoding
  • Preheader text included
  • Plain text version provided

Conformité et aspects juridiques

  • Unsubscribe link present
  • Physical address included
  • GDPR compliance
  • CAN-SPAM compliance
  • Accessible design (WCAG 2.1)

Tests et validation

  • Cross-client testing completed
  • Spam score checked
  • Links verified
  • Mobile preview tested
  • Dark mode tested

Rationalisez votre workflow de modèles avec Semplates

L’éditeur de modèles professionnel, spécialement conçu pour AWS SES

Gérer des modèles directement dans AWS SES peut être difficile. La console manque d’édition visuelle, le versioning est manuel et les tests multi-clients nécessitent des outils externes. Semplates change ce flux de travail.

Éditeur visuel de modèles

Concevez des e-mails avec un éditeur drag-and-drop. Pas de code requis, avec accès complet au HTML si nécessaire.

Intégration avec les comptes AWS

Connectez plusieurs comptes AWS en toute sécurité. Déployez en un clic vers SES.

Collaboration d’équipe

Collaborez avec des rôles et permissions. Partagez des modèles, révisez les changements et gardez la cohérence.

Tests en temps réel

Prévisualisez les modèles dans 90+ clients e-mail. Assurez un rendu parfait avant déploiement.

Commencez avec l’offre gratuite à vie — créez jusqu’à 5 modèles sans frais, idéal pour petits projets et tests.

Essayer Semplates gratuitement →