E-mail HTML : comment faire la synthèse entre délivrabilité et ergonomie

Alors que toutes les technologies progressent, on constate que le code HTML utilisé dans l'emailing est encore à l’âge de pierre. Les designers ou développeurs d’e-mails HTML limitent la création pour aboutir à un e-mail qui puisse passer correctement dans chaque messagerie: gmail, yahoo, outlook…

A bien y réfléchir, nous constatons que le code HTML d’e-mails marketing utilise essentiellement une technologie ancienne agrémentée de peu de nouveauté et ce pour conserver le bonheur des masses. 

Le volume d’e-mails échangés étant tellement important, les fournisseurs de messagerie ont des politiques très strictes et pour atteindre une délivrabilité maximale, mieux vaut parfois limité l’aspect créatif (graphisme).
Pour illustrer cela, penchons-nous sur les meilleures pratiques en matière de codage d’emailing :

1) Les tables
Oui pour certains, ce mot est synonyme de fléau mais pour d’autres, les tables restent le meilleur moyen de s’assurer que les éléments de leurs emails soient affichés dans l’ordre. Pour tous les adeptes du « New Age » ou pour les nouveaux codeurs, c’est un concept difficile à saisir d’autant plus qu’il ne permet pas de faire « un changement pour l’ensemble » comme c’est le cas avec un codage standard web (CSS, par exemple). 

C’est pourtant le seul moyen de faire en sorte que les emails s’affichent correctement à chaque fois, quel que soit le fournisseur de messagerie (Lotus Notes exclus). Les tables imbriquées, ou la méthode d’utilisation des tables dans les tables (parfois au 10eme degré), est encore une méthode très délicate à utiliser pour placer le contenu et le risque est relativement élevé en raison de sa complexité et de la quantité de zones qui doivent être changées si vous avez besoin d’éditer une section. 


2) Pas de CSS

  • Tandis que le monde commence lentement à accepter de passer à HTML5 et CSS3, l’e-mail, a bien des égards, n’a pas progressé vers ces nouvelles tendances. Pour des raisons de limitations techniques de la part des fournisseurs de messagerie, les e-mails ne peuvent pas vraiment appeler des fichiers et des commandes externes pour afficher le contenu. L’utilisation de quelques balises CSS a été ajouté dans les guides de bonnes pratiques des certains fournisseurs de messagerie dans le but d’afficher les e-mails correctement.
  • Pour illustrer ce propos, nous pouvons citer l’exemple de Gmail qui dépouille de ses attributs les balises, et donc des choses simples comme la couleur de fond d’un e-mail ou une image sont supprimées. Donc, pour contourner cela, il est conseillé d’utiliser soigneusement des attributs CSS sélectionnés dans le code HTML lui-même.

3) Pas d’image de fond

  •  Les « best practices » recommandent de ne pas utiliser d’images de fond, ce qui limite fortement l’aspect créatif des e-mails marketing envoyés. En effet certains fournisseurs de messagerie tels que Outlook 2007 et 2010 ne permettent pas l’affichage des images de fond sur des sections ou des tables. Une restriction de cette ampleur oblige les expéditeurs soit à utiliser une image avec du texte ou soit à mettre en berne leur créativité.

  •  Les concepteurs et les développeurs doivent être conscients de cela avant de commencer le travail de création d’e-mails. Le but premier est de trouver des solutions esthétiques qui fonctionnent avec tous les fournisseurs de messagerie afin d’assurer la meilleure délivrabilité des e-mails.