Cette semaine, je vous propose une trilogie au sujet de la création emailing côté technique. Nous décortiquerons ensemble le code source de votre emailing. Le HTML dans un email est assez complexe puisqu’en fonction des clients mail il n’est pas toujours interprété de la même façon. En effet, les clients mails lourds comme Thunderbird ou Outlook fonctionnent très différemment des webmails. L’interprétation du code HTML n’est donc pas identique. Sachez que si vous ne voulez pas perdre la raison, il faut de suite vous mettre en tête que vous n’arriverez jamais à avoir un affichage identique sur tous les clients et sur tous les supports. Néanmoins, vous pouvez optimiser votre code pour favoriser un affichage lisible.
Du CSS inline
Le premier gros problème de l’email est qu’il ne gère pas les propriété CSS display et float qui permettent d'agencer l’email, vous devez donc utiliser des tableaux. Par ailleurs, toujours côté CSS, certains clients mails ne prennent pas en compte la balise style qui contient votre code CSS, il faudra donc écrire les propriétés de style en ligne.
Peu de HTML5
Concernant le HTML en lui-même, là aussi les clients mail ne dont pas preuve de modernité. Utilisez donc un Doctype XHTML 1.0 Strict afin d’éviter les erreurs d’interprétation. Vous trouverez ici les particularités de ce doctype. Pour savoir qui interprète quoi et choisir au mieux votre méthode de création, utilisez Campaign Monitor qui liste tous les éléments CSS et indique pour chacun l’interprétation avec des navigateurs et clients mails connus. Enfin, ne sautez pas sans parachute et prévoyez une alternative à l’affichage de votre mail en remplissant les attributs alt de vos balises images et en proposant un lien pour consulter l’email en ligne ou une version au format texte brut. ➙ A suivre partie 2 : la mise en page avec les tableaux