Plus de temps pour l’essentiel : Le modèle optimal pour chaque email
Nous vous montrons quels sont les éléments indispensables dans le modèle d'email et ce à quoi il faut faire attention lors de la conception du modèle optimal !
Rédiger des textes, segmenter les groupes cibles, choisir des images, procéder à des ajustements et à des validations internes, apporter des modifications de dernière minute parce qu’un produit est épuisé : Dans leurs activités quotidiennes, la plupart des responsables de l’email marketing ont suffisamment à faire avec le contenu du courrier pour ne pas vouloir prendre des décisions de base sur la conception de l’email. Il faut trouver un modèle standard, un “template”, qui convienne à la plupart des occasions de communication : de la newsletter au mail d’anniversaire, en passant par l’invitation à un événement, la campagne d’abandon de panier, etc. Il est préférable d’investir une seule fois dans un tel modèle afin de ne plus avoir à le faire ensuite et de pouvoir se consacrer à son véritable travail. Dans CleverReach, on peut soit adapter les modèles de design gratuits à son propre Corporate Design, soit utiliser le langage de modèles CleverReach pour créer soi-même – ou par l’intermédiaire d’un prestataire de services – un modèle avec tous les éléments nécessaires dans son propre design. Cela nous amène à la question suivante : de quels éléments de base a besoin un modèle d’email que l’on peut utiliser pour les types de mailing les plus divers ?
De quels éléments un modèle d’email optimal a-t-il besoin ?
Pour pouvoir construire différentes newsletters et mailings, réfléchissez si votre template a besoin des éléments suivants :
- Une barre de menu. Comme les éléments du menu sont disposés sur plusieurs lignes dans l’affichage mobile, le texte ne doit pas être trop long et doit rester facilement cliquable même dans le réarrangement mobile. Au lieu de reproduire l’ensemble du menu de votre site, concentrez-vous sur les 3 à 6 catégories principales au maximum. Vous pouvez également afficher dans CleverReach différentes barres de menu pour différents groupes cibles, par exemple pour les utilisateurs qui s’intéressent à la mode féminine ou masculine.
- Grandes zones de bannières d’images. Si vous intégrez du texte dans les bannières d’images, utilisez un titre activant et créez un lien vers l’image. Si l’image est “purement décorative”, elle devrait prendre moins de place qu’une image avec un message et un Call-To-Action. Combinez les bannières d’images avec des titres de texte qui s’affichent même lorsque l’affichage de l’image est désactivé.
- Des blocs pour l’image et le texte: Ce que les lecteurs* perçoivent comme le “contenu”. C’est justement là qu’il vaut la peine d’investir dans un bon template avec les définitions de style correspondantes : Pensez tout de suite aux prix affichés, aux prix à biffer, à l’espace pour les informations sur les produits (par ex. les tailles) et aux boutons Call-To-Action – vous vous épargnerez ainsi beaucoup de travail à long terme. Les images peuvent être des icônes ou des produits.
Sur les appareils mobiles, les éléments de texte et d’image doivent être disposés les uns en dessous des autres plutôt que côte à côte, afin de rester bien visibles et lisibles. Prévoyez plusieurs variantes pour différents formats d’image : par exemple ¼ d’image pour ¾ de texte, 50/50 d’image et de texte, 2/3 d’image pour 1/3 de texte, etc.
- Dans les mailings B2B, prévoyez plus de place pour les textes et utilisez les images plutôt en complément (par exemple, des résumés d’articles faciles à lire avec des images de produits, des photos de stock ou des diagrammes). Les éditoriaux avec des espaces réservés pour une photo (portrait) et la signature de l’expéditeur sont également souvent utilisés dans les e-mails commerciaux.
- Des éléments de mise en valeur: Utilisez des éléments de texte sur fond coloré – éventuellement centrés – avec ou sans Call-To-Action. Cela permet d’alléger le design, d’attirer l’attention sur les contenus importants et fonctionne même si les images sont bloquées par le programme de messagerie.
- Éléments sur plusieurs colonnes: les éléments sur deux, trois ou quatre colonnes pour les textes et les images avec des accents de couleur ou des cadres sont un module particulièrement utile. Il est ici possible de juxtaposer plusieurs choses comme dans un petit tableau.
- Dans le contexte B2B, des éléments de tableau sont souvent nécessaires pour présenter clairement des informations sur des événements ou des téléchargements de documents, par exemple, qui peuvent également être classés les uns sous les autres de manière mobile.
- Des boutons qui attirent l’attention et qui sont faciles à taper sur les appareils mobiles. Recommandation : aligner à gauche ou centrer.
Bien sûr, il y a aussi des éléments structurels qui ont la même importance pour tous les mailings :
- Pre-Header (les premiers caractères de texte qui s’affichent dans la boîte de réception), souvent avec un lien vers la version en ligne (aperçu web)
- Barres de médias sociaux avec icônes liées des canaux actifs
- Zone pour les liens de service et d’interaction
- Un élément indispensable et prescrit par la loi est en outre le lien permettant de se désabonner de la newsletter (opt-out). Il est souvent placé dans le pied de page avec des informations sur l’expéditeur.
À quoi faut-il faire attention lors de la conception du template ?
Dans les emails, on a toujours moins de contrôle sur la mise en page que sur le web et les imprimés. Ce qui semble bien dans vos e-mails de test dans Outlook peut être très différent dans Gmail ou dans l’application GMX. Le cas échéant, vous devriez accepter de faire des concessions en matière de design pour les éléments suivants :
- Plusieurs colonnes: Les contenus qui se trouvent côte à côte dans plusieurs colonnes ne s’harmonisent pas automatiquement en termes de longueur. Les couleurs de fond se terminent généralement à la fin du texte. Et la manière dont le texte s’écoule et se brise chez le lecteur dépend fortement de la police de caractères choisie, du style de police et du terminal. Solution : soit vous acceptez un certain “flottement”, soit vous consacrez des efforts à l’optimisation du nombre de caractères et de la longueur des mots dans chaque mail, toutes colonnes confondues.
- Les textes justifiés ne fonctionnent pas dans les clients d’email, d’autant plus qu’il n’y a pas de césure automatique. Il est recommandé d’aligner les textes à gauche.
- Les coins arrondis des boutons peuvent paraître élégants, mais ils ne sont pas recommandés pour Outlook. Outlook n’affiche des “coins arrondis” que si l’ensemble du bouton est une image – mais les destinataires* qui n’affichent pas d’images ne voient alors pas du tout le bouton. Réfléchissez donc bien à l’importance que vous accordez aux “coins arrondis”.
- Images d’arrière-plan et, en général, images sur lesquelles du texte est écrit: pendant des années, elles ont été déconseillées, mais elles fonctionnent désormais dans la plupart des clients d’email. Chaque fois que vous utilisez de tels éléments, assurez-vous que les textes placés sur les images correspondent exactement. Avant chaque envoi, testez sur plusieurs terminaux et clients d’email si la police et la taille de la police s’affichent partout comme vous le souhaitez et si les dimensions de l’image et du texte ne sont pas “explosées” dans la version mobile. Cela peut s’avérer si fastidieux qu’il est préférable de sauvegarder le texte avec l’image.
Particularités à prendre en compte pour le modèle
Il faut également utiliser le Le mode sombre (dark mode) doit être pris en compte lors de la conception :
- Créez des éléments d’image, des entretoises et des boutons avec des fonds transparents, le mail aura alors un bel aspect lorsque les couleurs seront “inversées”.
- Vous pouvez ajouter un “glow” aux icônes ou logos noirs sur fond blanc/transparent afin que votre beau logo n’apparaisse pas “noir sur noir” en mode sombre.
- Si des boîtes colorées sont utilisées pour mettre en valeur des contenus, leur changement de couleur en mode sombre devrait être pensé en même temps. Ici aussi, il vaut mieux consacrer un peu plus de temps à la création du modèle et économiser ainsi du temps, de l’argent et des nerfs pour tous les futurs emails
Les éléments suivants ne fonctionnent que dans quelques clients d’email, réfléchissez donc bien si cela en vaut la peine.
- Table des matières (avec des liens “ancre”) : certains clients web ne supportent pas cette fonction.
- Propres polices (de marketing). Il est certes possible d’intégrer ses propres polices de caractères et polices web dans les emails, mais elles s’affichent différemment dans les différents clients. Elles ne sont pas affichées dans Gmail et Outlook. Vous êtes toujours en sécurité avec les polices dites “email-safe”, avec lesquelles vous gardez le contrôle de votre design.
- Tableaux avec de nombreuses colonnes: Un tableau de carreaux de 5 x 5 produits a l’air top sur l’écran d’un PC. Mais sur les appareils mobiles, soit les contenus sont mis à l’échelle – et sont alors à peine visibles – soit ils sont disposés les uns sous les autres – ce qui fait 25 lignes ! 4 colonnes est le maximum pour la plupart des résolutions (selon le motif). Et si le design est important pour vous, déplacez le papier peint sur une landing page !
Qui va travailler avec le template ?
Avant même de choisir un modèle, réfléchissez aux personnes qui rempliront plus tard les newsletters avec des contenus. Les templates programmés par l’utilisateur peuvent intégrer de nombreuses fonctions spéciales – mais il est tout à fait possible qu’elles ne soient pas faciles à remplir dans l’éditeur Drag&Drop de CleverReach ou que des utilisateurs copient et collent involontairement des formats dans des zones qui nuisent au design. Il peut donc être intéressant, lors de la programmation du modèle, d’exclure certaines zones de l’édition ou, par exemple, de laisser certains champs se remplir uniquement de texte, sans autoriser le formatage. Cela limite certes un peu le créateur de l’email au quotidien, mais cela garantit également que tous les destinataires* reçoivent des emails de qualité cohérente.
Notre conclusion
Les templates sont une chose merveilleuse pour se créer un modèle très flexible dans son propre design – qui peut ensuite être réutilisé encore et encore. Ils présentent également un avantage décisif pour l’organisation : lors du choix du modèle, vous et votre équipe pouvez prendre de nombreuses décisions fondamentales en une seule fois et réduire ainsi les ambiguïtés et les efforts de concertation futurs. Ceux qui n’ont pas encore d’expérience en la matière peuvent commencer directement avec les CleverReach Design Templates gratuits – pour les exigences plus élevées, des agences spécialisées aident à créer et à optimiser des séries de templates. À long terme, l’effort en vaut vraiment la peine !
À propos de l’auteur
Marion Krohn est responsable du conseil et du développement commercial auprès de l’agence Publicare Marketing Communications GmbH, partenaire de CleverReach.
