Forger un lien mailto: avec des paramètres

Une façon facile d’ajouter de l’interactivité dans une page Web ou une infolettre est de mettre un lien mailto: qui, une fois activé, ouvrira une fenêtre de courriel souvent préadressée. Il est possible cependant d’aller plus loin et de préremplir le sujet et le corps du courriel, ce qui peut permettre de contrôler une partie du message qui sera envoyé. Voyons un peu comment ça fonctionne...

Une demande de dernière minute

L’été dernier une de mes amies me demande de mettre un message dans l’infolettre de notre club de natation pour inviter les membres à lui envoyer un courriel pour commander les t-shirts prévus pour les championnats qui approchaient à grands pas. Dans son message original elle demandait aux gens de mettre comme sujet « Commande de t-shirt ACC pour Montréal 2014 », et d’indiquer dans le corps du courriel le nom pour la commande, le nombre de t-shirts voulus et la taille pour chacun.

Comme c’est souvent le cas, c’était une demande de dernière minute et urgente, alors rapidement je vais insérer l’article dans MailChimp, un outil de création et d'envoi d’infolettres. J’ai mis le texte de son message et initié la création d’un lien mailto:. J’ai alors vu dans MailChimp que dans la boîte de paramètres j’avais la possibilité de mettre un sujet et un corps de message (voir Figure 1). J’ai alors changé de stratégie et au lieu d’écrire dans l’article quelle information mettre, j’ai mis directement le bon sujet et un corps de message avec ce que mon amie avait besoin comme information de la part de ceux qui voulaient passer une commande. De cette façon les chances étaient beaucoup plus grandes d’obtenir l’information nécessaire du premier coup. Voir dans la Figure 2 le résultat de ce qui se passe lorsque nous activons le lien à partir de l’infolettre.

Comment ça se fait?

Il s’agit de mettre les paramètres subject et body dans le URL après le ?. Par exemple :

<a href="mailto:achille@exemple.com?subject=sujet_du_courriel
  &body=corps_du_courriel">achille@exemple.com</a>

Ce qui est important cependant est de banaliser le URL : certains caractères doivent être encodés pour que le URL soit valide. Nous pouvons forger le URL côté client ou côté serveur. Si nous le faisons côté client, nous utiliserons la fonction JavaScript encodeURIComponent() pour banaliser les morceaux critiques du URL :

var sujet = "Commande de t-shirts ACC pour Montréal 2014";
var message = "Nom :\nNombre de t-shirts :\nTaille pour chacun :";
var courriel = 'achille@exemple.com';
var url = 'mailto:' +  courriel + '?'  
    + 'subject=' + encodeURIComponent(sujet)
    + '&body=' + encodeURIComponent(message);
var lien = '<a href="'+url+'">'+courriel+'</a>'; 

Ce morceau de code produira le URL suivant pour l'hyperlien :

mailto:achille@exemple.com?
  subject=Commande%20de%20t-shirts%20ACC%20pour%20Montr%C3%A9al%202014
  &body=Nom%20%3A%0ANombre%20de%20t-shirts%20%3A%0ATaille%20pour%20chacun%20%3A

Si nous voulons le faire côté serveur, il faudra utiliser des fonctions de banalisation dans le langage de programmation pour notre application ou système de gestion de contenu (PHP, C#, Java, Ruby, Python, ...). En PHP, il faut utiliser la fonction rawurlencode() et voici comment ça serait fait :

$recipiendaire = "achille@exemple.com";
$sujet = "Commande de t-shirts ACC pour Montréal 2014";
$message = "Nom :\nNombre de t-shirts :\nTaille pour chacun :";
$url = "mailto:$recipiendaire?subject=" . rawurlencode($sujet) . 
    "&body=" . rawurlencode($message);
echo '<a href="' . $url . '">' . $recipiendaire . '</a>';

Dans MailChimp, nous avons vu que l’outil pour faire cette banalisation est déjà intégré dans l’éditeur. Un CMS pourrait offrir la fonctionnalité aussi. Sinon, il n’est pas difficile de trouver sur Internet des outils qui feront le travail.

Aller plus loin...

Mettre un lien mailto: est facile à faire. Il est important de connaître les limites et les désavantages de cette méthode cependant. Un lien mailto: implique que le client courriel est configuré pour l’internaute : ce n’est pas toujours le cas, surtout si l’internaute est sur un système qui n’est pas le sien. Plus important encore est que mettre des liens mailto: dans une page Web expose des adresses courriel aux agents malveillants qui eux moissonnent les sites pour bâtir des bases de données de courriels qui serviront éventuellement à envoyer des pourriels en masse. Une des solutions et de trouver des outils, un peu comme ceux mentionnés dans cet article, mais qui vont aussi chiffrer le courriel au lieu de le mettre en clair. Ce n’est pas à toute épreuve car les agents malveillants peuvent utiliser un interpréteur JavaScript et récupérer le courriel, mais c’est un peu plus compliqué à faire.

La technique que nous avons mentionnée, utilisée pour mettre dans une infolettre que nous envoyons à une communauté fermée est tout à fait pertinente et il n’y a pas lieu ici de chiffrer le courriel. Un autre usage peut être pour faire un lien mailto: où l’internaute remplit lui-même l’adresse courriel du destinataire comme nous avons souvent dans les liens de propagation virale pour permettre d’envoyer à un ami comme nous avons sur le site des Itinéraires musées (voir Figure 3). Le sujet et le corps du message seront pré-remplis, mais le courriel sera mis par celui qui veut envoyer le URL de la page à un ami qui serait potentiellement intéressé par le contenu.

Conclusion

Nous venons de voir une petite astuce pour créer des URL mailto: sympathiques qui, en 2 minutes, permettront de guider ce que nous attendons de celui qui recevra le courriel où d’y insérer un contenu qui sera un appel à l’action. Le truc est de préremplir les paramètres subject et body d’un courriel en s’assurant de bien banaliser les caractères.