Vous aimeriez créer votre toute nouvelle signature HTML ? Celle qui fera dire « MA-GNI-FIQUE » à tous vos destinataires pendant qu'ils se roulent la moustache du bout des doigts en lisant vos mails ? Alors, vous êtes au bon endroit ! Grâce à notre guide complet, découvrez comment réaliser votre propre signature HTML, en la codant tel un hacker, ou à l'aide d'outils de signature mail créés justement pour vous simplifier la tâche.
Que vous utilisiez Outlook, Gmail ou Apple Mail, apprenez à créer, puis à insérer votre signature HTML en quelques clics !
La signature HTML, c'est un morceau de code HTML inséré dans l'espace signature de votre application de messagerie et qui s'affiche en format visuel une fois votre mail envoyé à votre destinataire. Comme elle est créée en code, vous pouvez y intégrer un peu ce que vous voulez, en ayant bien sûr une petite base de connaissances en code. Votre nom, nom de l'entreprise, logo, photo de profil, image additionnelle ; vous avez la possibilité d'y intégrer une foule d'éléments, de façon à créer une signature encore plus engageante et professionnelle.
Voici par exemple à quoi pourrait ressembler le code d'une signature HTML basique :
<div>
<p>Nom de l'entreprise</p>
<p>Nom de l'employé | Titre du poste</p>
<p>Numéro de téléphone</p>
<a href="lien du site internet">Site internet</a>
</div>Le HTML, ça vous parle, mais vous ne savez pas VRAIMENT ce que c'est ? Alors, repartons de la base :
Le HTML (HyperText Markup Language) est un langage de balisage utilisé pour structurer le contenu sur le web. Dans le contexte des signatures mail, le HTML permet de formater le texte, d'ajouter des images ou des logos, et de créer des liens vers des pages web ou des profils de réseaux sociaux. C'est tout simple, non ?
Pour éditer ou créer une signature HTML, on vous suggère d'utiliser un éditeur de texte, comme Notepad++ sur Windows, TextEdit sur iOS ou Gedit sur Linux. Et si vous avez envie de faire comme les pros, vous pouvez aussi bien passer par Visual Studio Code ou Sublime Text.
Mais, d'abord, vous pouvez légitimement vous demander à quoi cela peut bien servir, une signature HTML personnalisée ? Et bien celle-ci vous offre de nombreux avantages, notamment de :
Alors, vous avez choisi de mettre les mains dans le cambouis et de créer votre propre signature mail par vous-même ? Voici donc les étapes que vous devriez suivre.
Que souhaitez-vous inclure parmi les informations suivantes :
Puis, vous n'avez qu'à intégrer dans votre éditeur de code HTML les éléments qui vous intéressent. Ici, l'idéal est d'avoir quelques bases HTML. Sinon, vous pouvez copier cet exemple de code et le modifier à votre guise :
<!DOCTYPE >
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.signature {
font-family: Arial, sans-serif; color: #333;
}
.signature a {
color: #1a0dab; text-decoration: none;
}
.signature img {
max-width: 100px; height: auto; vertical-align: middle;
}
.signature .social-icons img {
max-width: 20px; height: auto; margin-right: 5px;
}
</style>
</head>
<body>
<div class="signature">
<p><strong>Steve Letsignit</strong>
<br>
Chef suprême de la signature HTML
<br>
<a href="mailto:stevesignature@letsignit.com">stevesignature@letsignit.com</a>
<br>
<a href="tel:+330444444444">04 44 44 44 44</a>
</p>
<p><a href="https://letsignit.com/fr/"><img src="https://cdn.prod.website-files.com/64776c074f7606e5a4101c65/64776c084f7606e5a4101f34_642edc5c8d1257656775ab18_Vector.svg" alt="Letsignit">
</a></p>
<p class="social-icons"><a href="https://www.linkedin.com/company/letsignit/"><img src="https://cdn-icons-png.flaticon.com/512/174/174857.png" alt="LinkedIn">
</a>
<a href="https://twitter.com/letsignit/"><img src="https://cdn-icons-png.flaticon.com/512/733/733579.png" alt="Twitter">
</a>
<a href="https://www.facebook.com/letsignit/"><img src="https://cdn-icons-png.flaticon.com/512/733/733547.png" alt="Facebook">
</a>
</p>
</div>
</body>
</html>
Ce qui vous donnera une signature du genre :
Ou, option encore plus facile : vous avez la possibilité de passer par un générateur de signature mail.
Voici quelques options des options populaires :
Chaque générateur a ses propres avantages. Prenez le temps d'explorer différentes options pour trouver celle qui répond le mieux à vos besoins.
Alors, ce n'est pas très compliqué. Chaque générateur de signature à ses propres procédés, mais ils sont pour la plupart conçus de façon à être très visuels et simples à utiliser. Il suffit d'utiliser le designer proposé par les outils, de remplir les différents champs, et de copier le code HTML généré dans votre l'espace dédié de votre messagerie !
Vous avez créé votre toute nouvelle signature Outlook ? Pour insérer votre signature HTML sur Outlook, assurez-vous d'abord que votre signature est prête sous format HTML. Ensuite, lancez votre application Outlook et suivez les étapes suivantes :
Une autre façon d'intégrer une signature HTML plus complexe est d'importer directement le fichier HTML dans le dossier des signatures Outlook. Pour ce faire, accédez à :
%APPDATA%\Microsoft\Signatures (sur PC)
Ou :
~/Library/Group Containers/UBF8T346G9.Office/Outlook/Outlook 15 Profiles/Main Profile/Signatures/ (sur iOS)
et copiez-y votre fichier HTML. Lorsque vous vous rendrez dans la section dédiée à la création de la signature, votre oeuvre apparaîtra parmi les options disponibles.
Vous êtes plus du type de personne à envoyer vos mails depuis l'interface web d'Outlook ou Outlook 365 ? Aucun problème ! Voici les étapes à suivre pour mettre votre nouvelle signature HTML en place :
Pour intégrer votre signature HTML sur Gmail, vous devez d'abord avoir votre code HTML prêt.
N.B. Gmail ne prend pas en charge le contenu HTML directement dans la signature, alors assurez-vous d'avoir copié votre signature HTML sous sa forme visuelle avant de la coller dans l'éditeur.
Pour personnaliser votre signature sur Apple Mail, la première étape consiste à lancer sauvegarder votre signature HTML sur votre appareil.
Encore une fois, pour intégrer une signature dans Thunderbird, commencez par sauvegarder votre signature HTML sur votre ordinateur ou par copier le visuel de votre signature dans votre presse-papiers (Ctrl+C ou Cmd+C).
Une fois votre signature créée, vous aurez tout le loisir de la modifier lorsque vous le souhaitez. Et pour ce faire, ce n'est pas bien complexe. Vous n'aurez qu'à revenir au même éditeur que vous avez utilisé pour créer la signature initialement, à la modifier, puis à enregistrer le tout.
Si vous avez l'esprit créatif, vous pouvez totalement créer une signature HTML à votre image grâce aux codes HTML et CSS. Là est toute la beauté d'avoir quelques connaissances de base en code ! C'est le moment de donner une touche unique à vos communications.
Cela dit, n'oubliez pas que la simplicité et la clarté sont essentielles. Un style trop chargé peut distraire vos destinataires de l'essentiel de votre mail et nuire à la lisibilité de votre signature. Veillez à choisir des couleurs relativement harmonieuses entre elles, avec une police facile à lire et des images qui ne sont pas trop grandes (ni trop lourdes en termes de poids).
Voici comment procéder :
Votre signature servira à envoyer des mails professionnels ? Alors, voici quelques conseils pour s'assurer qu'elle soit adaptée aux communications pro :
Déjà pour être efficace, votre signature mail professionnelle doit contenir les informations suivantes :
Ensuite, vous pouvez y ajouter :
Pour avoir un vrai look professionnel, votre signature devrait idéalement respecter les 5 critères suivants :
Et une fois que votre signature est prête, n'hésitez pas à demander un avis aux gens autour de vous. Nous ne sommes pas tous des Mondrian en devenir et peu importe le degré de confiance que vous avez en votre capacité de designer, demander un deuxième avis n'est jamais de trop.
Pour en savoir plus sur ce sujet et voir quelques exemples, n'hésitez pas à vous rendre sur notre article dédié à la signature mail professionnelle.
Alors, peut-être que votre entreprise sera intéressée par la solution de gestion de signatures mail de Letsignit. Cet outil permet de générer les signatures mail de tous vos collaborateurs en format HTML et de les intégrer directement à vos mails !
Ce type de solution existe justement pour les personnes qui sont en manque de temps et qui ont besoin de simplifier le processus de création des signatures pour l'ensemble de leurs collaborateurs. On sait très bien (c'est notre métier après tout) à quel point la gestion des signatures mail peut devenir problématique, surtout pour les entreprises en expansion ou avec un nombre toujours plus important de collaborateurs.
Avec notre outil, vous n'avez qu'à créer votre signature à partir de l'un des modèles proposés ou d'utiliser le designer intégré pour réaliser une signature à l'image de votre entreprise, et le reste est automatisé ! Plus besoin d'intégrer vous-même votre signature via l'éditeur Outlook et d'y revenir chaque fois que vous souhaitez y faire une modification. Vous n'avez plus qu'à faire les modifications visuelles, et l'intégration technique est réalisée par l'outil.
On ne force personne, mais notre solution existe et est là pour rendre service. À bon entendeur ! :)
Il ne nous reste plus qu'à vous souhaiter une bonne rédaction de vos mails professionnels !
Pour vous aider à créer des signatures mail HTML, voici quelques ressources complémentaires utiles :
Yes, with the 'Campaigns' offer, it is possible to track the number of clicks on the email signatures of all your employees in the 'Statistics' area of the platform.
You can then access a detailed or global view of the number of clicks on the email signatures of each employee. You can use the search option to target a specific signature or a given period. Finally, you have the possibility to export all statistics to an Excel document.
If you launch campaigns with banners inserted in your email signatures, you can also access their performance via this same space.
With Letsignit, you can easily add social network icons in your collaborators' email signatures and link to your company pages. Also, our "attributes" feature allows you to manage personalized URLs for each of your collaborators such as their individual LinkedIn profile.
And that's not all: you can add links to an appointment-setting application, allow your customers to leave reviews easily, and integrate our 'Chat on Teams' widget to let anyone start a discussion via Microsoft Teams chat.
It’s up to you! As an administrator of the Letsignit platform, you choose whether or not to grant modification rights to your employees. These permissions are managed on an attribute-by-attribute basis, which means that you can decide to allow the employee to change their phone number, but not the address of your premises, for example.
This feature applies to all attributes in your directory, including custom attributes created on Letsignit. When your employees change one or more attributes, your directory is obviously not affected.
It often happens that employees make their email signature their own: custom format, bad fonts, colors inconsistent with the brand standards... all of this has an impact on your brand!
A consistent visual identity is considered authentic and outperforms a perceived weak one by 20%. And, your customers are 2.4 times more likely to buy your products.
With Letsignit, take back control over your brand identity by standardizing all your email signatures. Our tool has many features that allow you to customize your signatures by department, by audience or by subsidiary. Not to mention the possibility of carrying out campaigns within your email signatures thanks to our Campaign offer.
What is the user experience like for our employees?
In both cases:
In short, they have autonomy in their email signature, but you keep control on the field, signatures, and banners they can edit or use.
With our "multi-signature" feature, your employees can benefit from multiple email signatures. No technical manipulation is required. Thanks to our Add-in for Outlook or the desktop app, they can change their email signatures as they wish with just a few clicks.
Regarding the creation of email signatures, you can make several variations such as:
Everything has been thought of to go further in the personalization process based on the recipient of your emails.
If sending emails has an impact, non-optimized email signatures also have an impact. An unsuitable format or an image that is too heavy considerably increases the size of your signatures... and therefore, your emails.
As a responsible economic actor, we contribute to reducing our CO2 emissions and those of our customers in several ways:
As we are increasingly involved in sustainability initiatives, our priority in 2023 is to develop even more green IT functionality.
If sending emails has an impact, non-optimized email signatures also have an impact. An unsuitable format or an image that is too heavy considerably increases the size of your signatures... and therefore, your emails.
As a responsible economic actor, we contribute to reducing our CO2 emissions and those of our customers in several ways:
As we are increasingly involved in sustainability initiatives, our priority in 2023 is to develop even more green IT functionality.
