Attention, cet article a désormais quelques années… Il se peut que toutes les informations qu’il contient ne soient plus pertinentes.
Gmail a fait une annonce très intéressante il n’y a pas très longtemps. Ils ont mis en place un système qui copie sur leurs propres serveurs les images contenues dans les mails. Comme ils les copient, j’imagine qu’ils les analysent pour être sûr qu’elles ne contiennent pas de choses méchantes (vilains virus, etc.). Et ensuite, ils les affichent dans les mails directement, de façon donc sécurisée.
Le gros avantage est qu’on a plus besoin d’appuyer sur « afficher les images de ce mail ».
Le deuxième gros avantage, plus pour les gens comme moi, c’est qu’on est sûr qu’un joli mail qu’on a construit en HTML s’affichera correctement dans la boite mail, sans action préalable de l’utilisateur, et ça, c’est plutôt cool !
Pour le moment, c’est cool que dans Gmail mais sans doute que les autres suivront prochainement. A noter que plusieurs méthodes existent pour que les images s’affichent bien selon les boites mails, mais elles nécessitent le plus souvent une action de la part de l’utilisateur.
Pour envoyer des mails jolis et qui arrivent bien dans la boite mail de l’utilisateur, je voudrais vous présenter deux outils, qui, utilisés ensemble, permettent de faire des choses vraiment chouettes : Mandrill et Ink.
Mandrill, pour envoyer des emails transactionnels
Les emails transactionnels sont ces emails que vous recevez lorsque vous effectuez une action sur un site web, comme vous inscrire, demander à récupérer votre mot de passe, recevoir une confirmation d’achat par mail, un rappel, etc. Pour synthétiser, ce sont tous ces mails envoyés automatiquement par les sites web (outils en ligne, sites e-commerce, réseaux sociaux, etc.).
Mandrill est un outil très puissant qui permet de gérer l’envoi de ce genre d’emails. C’est à dire qu’il met à disposition tout un tas de fonctionnalité, au travers d’une API, qui permettent de créer, personnaliser, envoyer et suivre un email.
Il sera donc possible, en vrac, de choisir un template pour son mail, le personnaliser avec le nom de l’utilisateur, lui envoyer et de savoir s’il l’a reçu, ouvert et même s’il a cliqué sur les liens à l’intérieur.
Toutes ces fonctionnalités sont très pratiques si vous voulez interagir avec vos utilisateurs et suivre de près comment ils visualisent vos mails.
D’un point de vue fiabilité et robustesse du système, j’ai tendance à leur faire bien confiance étant donné que Mandrill est développé par la même équipe que MailChimp et qu’il utilise la même architecture de serveurs pour les envois.
C’est un outil très complet, gratuit jusqu’à 12.000 mails par mois et compatible avec plusieurs langages. Je vous conseille de le découvrir : site de Mandrill
Ink, framework pour emails
On connaissait les outils pour construire les emails et pour les envoyer comme MailChimp ou autre mais je n’avais jamais vu de Framework pour emails…
Ink est un ensemble d’outils HTML et CSS qui vont permettre de créer des structures HTML de mails qui seront compatibles dans (presque) toutes les boites mails. Je marque « presque » mais la liste de compatibilité est vraiment longue.
En suivant les indications, on créé alors sa structure HTML à base de classes précises (row, columns, etc.) et de nombreuses balises <table> ou <center>. Cela peut paraître déconcertant au premier abord mais le résultat est très convaincant.
Le problème avec les mails en HTML, c’est que l’attribut class ne fonctionne pas ou très rarement. Il faut que le CSS soit « inliné » (mis dans les lignes).
Si vous aviez une jolie classe p.rouge {color: red;}, il faudra écrire :
<p style= »color: red; »> au lieu de <p class= »rouge »>
Faire ça pour toutes ses balises en faisant attention à toutes ses classes, etc. c’est très long et quasi impossible dans des cas complexes. Heureusement, Ink a pensé à tout et propose donc un outil en ligne qui permet de le faire ! Vous lui passez en paramètre votre code HTML (il doit contenir une balise <style> avec votre CSS) et il vous retourne le même code avec le CSS « inliné ».
Avec Ink, je vous conseille de faire des choses simples et propres : Un cadre avec dedans un logo, un petit texte avec un ou deux liens et un footer bien fait. Vous y arriverez très vite et le résultat sera vraiment impeccable dans toutes les boites mails. Découvrez-le : site de Ink
Peut être que les classes « row » ou « columns » vous ont mis la puce à l’oreille mais Ink a été développé par Zurb, la société qui a développé Foundation, le célèbre Framework d’intégration HTML/CSS/JS qui fait la course en tête avec Twitter Bootstrap pour être sacré meilleur Framework d’intégration du monde et de l’univers. Donc autant dire qu’une belle équipe de spécialistes se trouve sans doute derrière Ink !
Et quand on mélange tout ça, qu’est que ça donne ?
Nous avons donc sous la main deux outils puissants, gratuits (dans une certaine mesure pour Mandrill) et développés par des pointures du web.
Je vous invite donc à créer un template d’email avec Ink et à l’intégrer dans Mandrill. Vous pourrez alors gérer des variables pour paramétrer, par exemple, le nom du destinataire ou le message, etc.
Vous pourrez donc envoyer des emails de qualité, à travers un système robuste vous permettant également de suivre vos emails (ouverture, clics, etc.). Et forcément, si vos destinataires ont Gmail, les images s’afficheront tout de suite et là l’effet est garanti !