Comment optimiser son kit HTML ?

Comment optimiser son kit HTML ?



Introduction

Les campagnes email sont un excellent moyen de communication de nos jours, avec de nombreux avantages. En effet, elles peuvent répondre à bon nombre de vos objectifs, qu’ils soient commerciaux ou marketing. Mais il est important de s’investir davantage dans le travail en amont quant à la conception de votre kit pour optimiser la délivrabilité sans négliger les règlementations.

Tout d’abord, un kit HTML est un visuel email qui a déjà été conditionné et prêt à être envoyé. Le kit peut être fournit par nos clients que nous allons intégrer sur notre plateforme d’envoi. Nous pouvons également prendre en charge la conception de votre visuel HTML de A à Z.

Pour optimiser les chances de réussite de votre campagne, il est préférable de respecter un certain processus prenant en compte plusieurs étapes lors de la conception du kit.



Définition des objectifs

Dans un premier temps, il est important de savoir quels sont les objectifs que vous souhaitez atteindre via votre campagne d’emailing. Comme par exemple générer du trafic sur votre site ? Augmenter votre chiffre d’affaire ? Ou encore fidéliser vos clients ?

Selon vos objectifs marketing, plusieurs types de campagnes pourront être mis en place :

  • Les campagnes d’acquisition ayant pour objectif de recruter de nouveaux prospects.
  • La location de fichier ciblée ayant pour objectif de générer du trafic sur votre site et augmenter votre chiffre d’affaire.
  • La réactivation de vos adresses inactives.
  • L’enrichissement de votre base de donnée.

Nous allons donc voir ci-dessous quelles sont les principales étapes :



Identification de la cible

Lors d’un envoi de campagne, il est important de bien identifier les cibles pour répondre correctement aux besoins des prospects à qui nous allons envoyer vos offres. Il faut alors en savoir plus sur la manière de consommer des internautes, pour être capable de stimuler au maximum leur intention.

Le plus important dans l’identification de la cible, est de connaitre les problématiques des utilisateurs en s’intérrogeant sur leur centre d’intérêts. Chez Pawnee, nous nous occupons de votre segmentation via notre base de donnée en vous fournissant un ciblage qui correspond à votre secteur d’activité. Nous mettons en avant notre expertise et notre écoute pour que votre campagne soit une réussite.



Trouver un contenu pertinent

Le contenu de votre mail doit mettre en avant vos objectifs marketing ou commerciaux, vous devez rester axé sur le message que vous voulez transmettre aux internautes. Plus le contenu sera travaillé, plus il reflètera l’intérêt pour le message que vous voulez faire passer.

Lors de la conception de votre kit, vous ne devez négliger aucun aspect. Hormis le visuel en lui même, il y plusieurs éléments que vous ne devez pas oublier de travailler en abondance dans votre contenu :

  • L’expéditeur : Mettez votre Nom d’entreprise ou votre marque, votre notoriété est un atout pour la lecture de votre e-mail
  • L’objet : Rédiger un objet efficace est extrêmement important, en effet, une fois dans la boîte de réception, votre objet sera en concurrence avec d’autres messages, il devra alors être pertinent, attrayant et susciter la curiosité.
    Les mots d’ordre sont : Attention, Intérêt, Désir, Action
    Des études montrent que plus l’objet est succinct plus le taux d’ouverture est élevé, nous vous conseillons donc de ne pas aller au-delà de 6 mots.
    Les mots à éviter : les signes tels que point d’interrogation, d’exclamation ou encore €, &…, évitez les termes liés à la religion ou au sexe, évitez les majuscules.
  • Le preheader : il permet de se démarquer de la concurrence, il vient en complément de l’objet.
  • Un contenu clair : il se doit d’être lisible avec un vocabulaire compréhensible. Votre visuel doit être dans l’ère du temps pour conserver l’intention du lecteur et ne pas être négligé.


Conception du visuel

Dans un premier temps, votre visuel doit être adapté à toutes les plateformes, c’est à dire qu’il doit être adapté aux différents supports sur lesquels l’internaute est susceptible de recevoir l’offre (ordinateur, portable, tablettes…).

De nos jours les visuels HTML sont tous conçu en responsive design, vous devez adapter votre visuel en fonction du thème ou de la période (fête des mères, Noël, Saint-Valentin…). Mais n’oubliez pas de garder votre charte graphique pour conserver une certaine cohérence.



Insertion d’images dans le code HTML :

Pour inciter vos destinataires à lire le contenu de votre message, nous vous conseillons de répartir de façon équilibrée les parties dédiées au texte et les parties graphiques intégrant images ou illustrations. Une créa bien équilibrée est plus à même de séduire visuellement, d’être donc lue par votre cible et surtout diminue considérablement le risque de spam.

Les deux formats d’image les plus reconnus sur le Web sont les formats GIF et JPEG. Ils donnent des résultats assez équivalents, bien que le JPG soit plutôt recommandé pour des images avec des tons nuancés ou dégradés.
Une image de grande taille prend beaucoup plus de temps à s’afficher que celle de petite taille. Si votre newsletter contient des images volumineuses, elle risque d’être ignorée par l’internaute. Veillez à utiliser des images de taille réduite, en 16 couleurs ou d’insérer des petites images munies de liens dirigeant vers une version plus grande.



De plus en plus de clients de messagerie utilisent des panneaux de prévisualisation et bloquent les images par défaut. Prévoir un texte alternatif qui s’affiche en « alt » pour vos images est alors préférable pour que l’internaute ne perde pas le fil de l’exposé et peut-être active l’affichage et découvre votre image.
Assurez-vous de toujours inclure la largeur et la hauteur (width et le height) dans les balises « img » de toutes les images. Cela garantit que les images vides de calage ne seront pas étirées, détruisant votre mise en page.

Le blocage des images peut engendrer, dans certains cas, une déformation de votre créa. Il serait alors préférable de procéder à des tests de votre message en mode image ON (images affichées) et en mode Image OFF (images bloquées par défaut).

Intégrer un lien vers une page miroir, une page hébergée qui contient le contenu de votre message, pour assurer l’affichage correct de vos images.

Il faut impérativement respecter le ratio texte image, 50% de texte, 50% image. Les textes doivent être pertinents mais pas trop long afin de susciter l’envie de l’internaute de se rendre sur votre site internet.

Les Call to Action sont primordial, vous ne devez pas oublier de promouvoir une offre alléchante pour le consommateur. Ella va vous permettre de l’attirer sur la page de votre site que vous le souhaitez selon vos objectif marketing.



Les feuilles de styles :

Il est important de noter que l’interprétation des feuilles de style diffère d’un webmail à l’autre. Pour éviter qu’une partie de votre cible ne puisse manquer votre message, il est préférable de suivre ces recommandations :
Déclaration des polices, couleurs… dans <HEAD>

La plupart des webmails ont tendance à supprimer tout ce qui se trouve à l’extérieur de la balise <body>…</body>, signifiant ainsi que l’e-mail reçu sera vide si cette balise n’existe pas. Certains éditeurs éliminent toute la créa si celle-ci ne contient pas la balise <body>…</body>. C’est pourquoi, afin de garder la feuille des styles sur la plupart des webmails, il faut alors, pour toutes les créas HTML, s’assurer que les balises <style>…</style> soient dans la balise <body>…</body> et non pas dans <head>…</head>.
Interprétation du style CSS par les webmails / clients mails:

CSS en ligne :

Pour avoir la meilleure compatibilité possible de vos emails au format HTML, il est recommandé d’utiliser le style CSS dit “en ligne”. Certains clients mail suppriment les balises d’entête qui peuvent contenir les définitions de style CSS. Il est donc préférable de préciser le style détaillé dans les attributs de chaque balise le nécessitant lors de sa création.


Style de body ignoré :

Etant basés sur une structure HTML, Les web mails contiennent déjà une balise <body>. Pour afficher votre message, ils procèdent donc à la suppression de cette balise existante dans votre créa ou ils la renomment en <xbody>, et dans les deux cas le style de body serait inapplicable. La solution consiste à envelopper le contenu de tout le <body> dans une balise <div> et de donner à cette dernière les propriétés de style, que vous comptiez donner au body.

Emails sans aucun style :

Les webmails effacent les « . » précédents les noms des classes par exemple : « .ClasseX » devient « ClasseX ». Par conséquent, elle ne peut plus être appliquée. Pour y remédier, il est préférable d’utiliser les sélecteurs de classe, qui préfixent les classes par la balise concernée. Ainsi « .ClasseX » devient « div.Classe ».
Le “background:url(http://…./img.gif) top left no-repeat;”
Cette fonction spéciale permet de gérer la répétition horizontale et verticale de l’image d’arrière plan (image de fond). Elle est utilisée dans les feuilles de style mais est souvent mal interprétée par les webmails. Elle n’est donc pas recommandée.

Il est vivement recommandé d’insérer des display bloc et des balise Alt. Le visuel HTML ne doit pas contenir plus de 10 liens. Le visuel HTML ne doit pas dépasser 600 pix de large. Respecter la taille des messages : Il est important d’optimiser la taille du message e-mailing (créa HTML sans images) qui est en moyenne inférieur à 50 Ko afin que celui-ci ne soit pas bloqué lors de sa réception. Intégrer des liens valides : vérifier que les liens intégrés ne sont pas cassés et qu’ils ramènent bien vers les pages souhaitées. En effet, des liens cassés ou pointant vers des sites malicieux augmentent le risque de SPAM.



Optimisez vos emails afin d’éviter d’être spammé.


Afin d’éviter que les mails frauduleux ou suspicieux atteignent les boîtes de réception des internautes, les webmails et les fournisseurs d’accès ont instauré des filtres anti-spams qui permettent de les identifier et de les bloquer. C’est pourquoi il est important d’optimiser le contenu de son email, pour cela, plusieurs leviers sont à respecter pour diminuer les chances de voir son email se diriger dans les spams.

  • Dans un premier temps, il faut exclure l’utilisation de mots que les services d’accès web ne tolèrent pas, comme par exemple : “gratuit”, “gagner”, “promotion”, ou encore “exceptionnel”, les caractères spéciaux, les pourcentages…
  • Bien vérifier le code HTML : Assurez vous que votre code HTML est propre (Syntaxiquement correct) et respectant toutes nos recommandations. Un code HTML correct diminue le risque de SPAM.
  • Il faut éviter les mots écrits entièrement en majuscule.
  • Il est important de bien optimiser le visuel pour qu’il soit adapté à toutes les plateformes (ordinateur, portable, tablette…).
  • Il est conseillé d’inclure une adresse physique au pied de page (pour gagner en crédibilité).
  • Il est impératif d’intégrer un lien de désinscrpition fonctionnel à la fin de votre de mail. Notamment pour mettre en avant votre preuve de sérieux et surtout en terme de règlementation concernant la loi RGPD.

Enfin, il est important d’encoder les caractères spéciaux :
Au niveau du contenu de vos mailings, l’idéal est d’encoder les caractères spéciaux de la manière
suivante : é “&eacute” ; ê “&ecirc” ; è “&egrave” ; à “&agrave” ; € “&euro”