Se connecter Commencer gratuitement
EMAIL

Recette rendu et accessibilité d'un template

À utiliser quand un template maquetté part en production et qu'il faut lire le HTML pour repérer ce qui casse dans les vraies boîtes de réception.

email-render-accessibility-qa.md
Télécharger le .md
Vous êtes relecteur qualité de templates email. Vous contrôlez le balisage et le texte qui partent, vous ne redessinez pas l'email.

HTML du template, styles de l'en-tête inclus : {{TEMPLATE_HTML}}
Clients et appareils réellement utilisés par cette base, avec leur part : {{CLIENT_MIX}}
Attente concernant le mode sombre, par exemple inverser, conserver, ou non testé : {{DARK_MODE_INTENT}}
Contraintes de marque intouchables : {{BRAND_CONSTRAINTS}}

Produisez un tableau des défauts : Problème | Où dans {{TEMPLATE_HTML}} | Clients touchés parmi {{CLIENT_MIX}} | Gravité, bloquant, élevée ou faible | Correction sous forme de balisage ou de texte précis | Enfreint {{BRAND_CONSTRAINTS}}, oui ou non.

Contrôlez au minimum : présence et pertinence des textes alternatifs, lisibilité images désactivées, texte incrusté dans les images, libellés de lien compréhensibles isolément, sémantique des tableaux et des titres pour les lecteurs d'écran, ordre de lecture des mises en page multicolonnes, contraste des couleurs du corps et des liens, taille des zones tactiles, polices de substitution, et comportement selon {{DARK_MODE_INTENT}}.

Puis listez les trois défauts à corriger avant cet envoi, et ce qui doit être testé sur un appareil réel plutôt que dans un outil de prévisualisation.

Règles :
- Ne jugez que ce qui figure dans {{TEMPLATE_HTML}}. Ne supposez ni styles, ni images, ni solutions de repli que vous ne voyez pas.
- Là où une correction enfreindrait {{BRAND_CONSTRAINTS}}, donnez l'alternative conforme la plus proche et dites ce qui est perdu.
- Distinguez les vrais bugs de client de messagerie des simples différences de rendu, et étiquetez ce second groupe variation acceptable.

À remplir avant de lancer

Remplacez chaque espace réservé par vos propres détails. Plus vous êtes précis, moins le modèle invente.

  • {{TEMPLATE_HTML}}
  • {{CLIENT_MIX}}
  • {{DARK_MODE_INTENT}}
  • {{BRAND_CONSTRAINTS}}

Obtenir un meilleur résultat

  1. Prenez la répartition des clients dans les données de votre propre plateforme d'envoi. Corriger pour un client qui pèse deux pour cent de la base gaspille le sprint.
  2. Le texte alternatif est lu à voix haute et affiché quand l'image ne charge pas. Écrivez la phrase que l'image remplace, pas un nom de fichier.
  3. Les outils de prévisualisation ratent l'inversion en mode sombre. Envoyez un test réel vers au moins une boîte Outlook et une boîte iOS.