Bonnes pratiques emailing n°1 : Création et HTML

 

La question des bonnes pratiques emailing est souvent abordée. Nous vous proposons un 1er volet sur le sujet avec la question de la création et de l’intégration HTML.

L’aspect graphique reste subjectif, chaque avis peu potentiellement être différent, mais ce qui est sûr c’est que l’email doit donner envie d’être lu et surtout d’être cliqué. Ainsi le taux de réactivité (nombre clics / nombre d’ouverture) restera le meilleur indicateur d’une créa réussie.

Essayons de détailler les bonnes pratiques en créa :

Webdesign sous photoshop

Tout le travail de webdesign doit être réalisé  sous photoshop avec une méthode de travail permettant de ranger chaque partie sous plusieurs calques. Ex : header, footer, offre…

Webdesign sous psd

 

Un ratio équilibré entre le texte et les images

L’email ne doit pas être composé uniquement d’images pour plusieurs raisons :

  • Les boites mails bloquent les images par défaut
  • Le texte qui est lu et qui attire tout de suite peu inciter à afficher les images ou consulter la version en ligne
  • Un email avec un bon ratio texte HTML / images aura moins tendance à basculer en courrier indésirable
  • A noter que le texte au format HTML sera dans une police « basique » pour assurer une bonne lecture par les différents mails : verdana, helvetica… et que les images seront au format .jpg

Images dans un emailing Bon ratio texte / image

 

Une taille optimisée pour lecture sur le mobile et en prévisualisation

  • La largeur d’un email doit être comprise idéalement en 550 et 650 px pour l’affichage desktop (ordinateur) et prendre compte une largeur de 320 px minimum sur mobile.
  • Pour une gestion en responsive l’ensemble des tables HTM seront gérées en pourcentage. Exemple ci-dessous :

<table width= »100% » border= »0 » cellpadding= »0 » cellspacing= »0 »>
    <tr>
          <td width= »30% »>…</td>
          <td width= »70% »>…</td>
     </tr>
</table>

affichage-previsualisation

arbo-systems-iphone

 

Une intégration HTML claire et détaillée

  • Plusieurs outils permettent d’intégrer l’email en HTML, dont l’utilisation dépend surtout des préférences de l’intégrateur (Dreamweaver, Sublime Text…)
  • Le code HTML doit être clair, bien structuré et respecter les bons formats et encodages afin d’assurer une bonne déliverabilité. Une analyse avant routage doit être effectuée pour optimiser si nécessaire

integration email html

Voici pour quelques bonnes pratiques emailing en création et intégration HTML, qui bien évidemment restent évolutives en même temps que les nouveaux usages et supports de lecture.

Nous évoquerons dans un prochain billet les bonnes pratiques d’envois (plateforme, heure et dates, nom et adresses d’expéditeur), qui sont également très importantes pour l’efficacité d’une campagne email

N’hésitez pas à partager vos bonnes pratiques email ou nous contacter pour plus d’informations.

 

Ensemble, développons votre projet

Contactez-nous