Passer au contenu principal

Que sont les boutons d’e‑mail et comment les ajouter à vos campagnes

Découvrez comment créer des boutons efficaces pour vos e‑mails. De la taille de la police aux CTA en passant par le codage HTML, voici tout ce dont vous avez besoin pour créer des boutons pour vos campagnes par e‑mail.

Le marketing par e-mail offre un retour sur investissement élevé et vous permet d’interagir avec votre audience au bon moment. Vous pouvez ainsi augmenter vos ventes et développer votre activité grâce à une stratégie efficace. Mais comment savoir si vos campagnes fonctionnent ?

Lorsque vous mesurez l’efficacité de vos e-mails, vous examinez probablement plusieurs indicateurs clés de performances (KPI), notamment les taux d’ouverture et les taux de clics (CTR). Le taux d’ouverture vous indique combien de personnes ont ouvert vos e-mails, tandis que le CTR vous aide à déterminer si les clients agissent suite à votre e-mail.

Sans appel à l’action (CTA) efficace, les clients ne savent pas quoi faire une fois qu’ils ont ouvert votre e-mail. Les boutons d’e-mail peuvent encourager les abonnés à passer à l’action et les ramener vers votre site Web où ils peuvent être convertis.

Mais que sont les boutons d’e-mail et comment les ajouter à vos campagnes pour les rendre plus efficaces ?

Qu’est-ce qu’un bouton d’e-mail ?

Un bouton d’e-mail est un bouton CTA dans votre e-mail qui indique aux utilisateurs ce qu’ils doivent faire ensuite. Lorsque quelqu’un ouvre votre e-mail, il voit s’afficher différents contenus.

Cependant, l’objectif principal de votre campagne de marketing par e-mail est de ramener les clients sur votre site Web pour qu’ils passent à l’action. Par exemple, une entreprise d’e-commerce peut promouvoir un certain produit afin d’augmenter ses ventes via une campagne par e-mail ciblée.

Il existe plusieurs façons de créer un bouton d’e-mail, notamment avec des images d’arrière-plan et différentes tailles et épaisseurs de police. L’un des types de boutons d’e-mail les plus populaires est le bouton « bulletproof ».

Contrairement aux boutons créés à partir d’images, ils sont conçus à l’aide de code HTML et CSS, ce qui permet de les afficher dans différents clients de messagerie.

Le principal avantage des boutons « bulletproof » est qu’ils s’affichent dans les e-mails, même lorsque les images sont désactivées. Les boutons « bulletproof » sont essentiels pour créer des e-mails « bulletproof » qui peuvent augmenter le nombre de clics et l’engagement dans vos campagnes de marketing par e-mail.

Même si ces boutons sont codés, vous pouvez modifier le modèle HTML pour mettre à jour la taille ou l’épaisseur de la police, l’image d’arrière-plan et les couleurs afin de créer des boutons HTML uniques et infaillibles.

En plus de s’afficher dans tous les clients, même lorsque les images sont désactivées, les boutons HTML se chargent plus rapidement, ce qui rend votre e-mail plus efficace, car les utilisateurs verront votre CTA et sauront quoi faire ensuite. Mais, bien sûr, les boutons HTML sont moins uniques que les boutons basés sur des images, car vous ne pouvez pas les concevoir dans des outils tels que Photoshop ou Canva.

Les avantages de l'utilisation de boutons d'e-mail dans vos campagnes

Que vous utilisiez des boutons d’e-mail basés sur des images ou en HTML à toute épreuve, l’avantage le plus significatif est l’augmentation de votre ROI et de votre CTR. Les boutons d’e-mail encouragent les abonnés à passer à l’action, vous permettant ainsi de mettre en avant votre CTA pour attirer davantage l’attention.

Les utilisateurs ne réagiront pas si votre e-mail ne contient pas un CTA fort. L’alternative au bouton d’e-mail est un lien hypertexte, qui peut toutefois dérouter les abonnés, car le texte ne leur indique pas clairement ce à quoi ils peuvent s’attendre.

Les boutons d’e-mail sont extrêmement visuels. Lorsque quelqu’un ouvre votre message, c’est probablement l’une des premières choses qui attire son attention, l’incitant à agir, à effectuer un achat, à visiter votre site Web ou à recevoir une offre. Un bouton bien conçu peut augmenter les chances que les clients réagissent à vos e-mails, ce qui les rend plus efficaces dans l’ensemble.

Malheureusement, si vos CTA comportent des images d’arrière-plan ou sont eux-mêmes des images, de nombreux utilisateurs risquent de ne jamais les voir, car leur client de messagerie a désactivé ces éléments. Les boutons d’e-mail sont donc essentiels à la réussite de vos campagnes et à l’augmentation du nombre de clics.

Pensez à la façon dont la plupart des gens lisent les e-mails. Comme lorsqu’ils consultent des blogs, la majorité des internautes recherchent les informations pertinentes au lieu de lire chaque mot et de s’arrêter sur chaque image. Votre bouton d’e-mail se démarque du reste du contenu pour plusieurs raisons, notamment la taille et l’épaisseur de la police.

Les boutons sont généralement plus grands et leur police plus épaisse afin d’attirer l’attention de l’utilisateur. De plus, ils comportent des éléments graphiques qui les distinguent du texte et des images. Ainsi, les boutons d’appel à l’action dans les e-mails sont beaucoup plus efficaces pour attirer l’attention des utilisateurs et leur permettre de comprendre plus facilement ce que vous attendez d’eux.

Comment ajouter un bouton d’e-mail en HTML et CSS

Il existe plusieurs façons d’ajouter un bouton e-mail en HTML et CSS, et vous n’avez pas besoin d’être développeur de sites Web ou expert en programmation pour vous assurer qu’ils fonctionnent correctement. N’oubliez pas que les deux méthodes les plus courantes pour ajouter des boutons dans vos e-mails consistent à utiliser des images avec des liens ou du code HTML.

Mailchimp vous permet de concevoir facilement votre bouton d’e-mail, notamment en modifiant la police à l’aide de blocs de contenu, que vous pouvez glisser-déposer pour créer des boutons en toute simplicité.

Boutons HTML pour e-mails

Les boutons HTML peuvent être de largeur pleine ou fixe, selon l’apparence que vous souhaitez leur donner par rapport au reste de la mise en page de l’e-mail.

Pour créer des boutons HTML pour vos e-mails, vous devez personnaliser votre modèle d’e-mail à l’aide du code suivant :

'''< table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#505050; border:1px solid #353535; border-radius:5px;">

Comme vous pouvez le voir, dans ce cas, votre bouton afficherait « Lire la suite ». Vous pouvez également modifier la police afin qu’elle corresponde à votre branding et aux polices de votre site Web, selon vos préférences. Bien sûr, la meilleure police pour les e-mails dépendra de votre branding et de votre design général, mais nous vous recommandons de rester simple.

Boutons d’e-mail adaptatifs

Les boutons adaptatifs pour e-mail s’adaptent à la largeur de l’e-mail, en fonction du texte contenu dans la même cellule. Ces boutons n’ont pas de largeur spécifiée dans le code, car ils adoptent la même largeur que le texte. Le code des boutons adaptatifs pour e-mail se présente comme suit :

'''

<td align="center" valign="middle" style="color:#FFFFFF; font-family:Helvetica, Arial, sans-serif; font-size:16px; font-weight:bold; letter-spacing:-.5px; line-height:150%; padding-top:15px; padding-right:30px; padding-bottom:15px; padding-left:30px;">
  <a href="http://www.mailchimp.com/blog/" target="_blank" style="color:#FFFFFF; text-decoration:none;">Lire plus d’articles sur notre blog</a>
</td>

'''

Heureusement, vous n’avez pas besoin de savoir programmer pour créer les boutons parfaits pour vos campagnes de marketing par e-mail. Vous pouvez simplement faire glisser-déposer un bloc de contenu dans un modèle existant et modifier le code HTML comme bon vous semble.

Stratégies de placement des boutons d’e-mail

L’emplacement de votre appel à l’action détermine si les abonnés le remarqueront et effectueront la conversion. Il est donc crucial de le placer stratégiquement afin de maximiser les clics. Pour y parvenir, vous devez réfléchir à la manière dont les gens lisent réellement les e-mails et à ce qu’ils recherchent lorsqu’ils ouvrent votre message.

Au-dessus vs en dessous de la ligne de flottaison

Le terme « au-dessus de la ligne de flottaison » désigne le contenu visible sans défilement, tandis que le contenu « sous la ligne de flottaison » nécessite un défilement vers le bas pour être visible. Placer votre bouton d’e-mail principal au-dessus de la ligne de flottaison garantit une visibilité maximale, car de nombreux abonnés ne feront pas défiler l’intégralité de votre message.

Cependant, ne négligez pas complètement l’emplacement sous la ligne de flottaison. Si vous avez un contenu plus long qui apporte de la valeur ajoutée et suscite l’intérêt, un bouton bien placé en bas de page peut attirer l’attention des abonnés qui ont lu l’intégralité de votre message.

Répéter les CTA tout au long de l’e-mail

L’utilisation de plusieurs boutons dans votre e-mail donne aux abonnés davantage d’opportunités d’agir sans être trop insistant. Cette stratégie fonctionne particulièrement bien pour les e-mails plus longs, où vous risquez de perdre des lecteurs en cours de route.

Espacez naturellement vos boutons dans le contenu, en veillant à ce que chacun d’entre eux soit pertinent par rapport au texte qui l’entoure, plutôt que d’être placé au hasard. N’oubliez pas d’utiliser la même décoration et le même style pour tous les boutons afin qu’ils aient un aspect cohérent et professionnel.

Aligner l’emplacement des boutons avec l’intention de l’utilisateur

L’emplacement de votre bouton doit correspondre aux attentes des abonnés en fonction du contenu et de l’objectif de votre e-mail. Si vous annoncez une promotion, placez votre bouton « Acheter maintenant » immédiatement après avoir mis en évidence les détails de la réduction.

Pour les contenus éducatifs, placez votre appel à l’action après avoir fourni des informations utiles et lorsque les abonnés sont prêts à passer à l’étape suivante. Réfléchissez au parcours client : à quel endroit de votre e-mail est-il le plus logique pour quelqu’un de cliquer pour accéder à votre site Web ou à votre landing page ?

Bonnes pratiques pour les boutons d’e-mail

Créer des boutons d’e-mail efficaces ne consiste pas seulement à les rendre jolis ; ils doivent fonctionner parfaitement sur différents clients de messagerie et appareils tout en guidant vos abonnés vers l’action que vous souhaitez qu’ils effectuent.

Un bouton bien conçu peut faire la différence entre un abonné qui clique sur le lien vers votre site Web et un autre qui supprime votre message. Voici ce que vous devez savoir pour créer des boutons d’e-mail efficaces à chaque fois.

N'utilisez pas d'images

Comme nous l’avons mentionné, les images ne s’affichent pas toutes sur certains clients de messagerie. Par conséquent, bon nombre de vos abonnés pourraient ne pas voir les boutons CTA de votre e-mail s’ils ont désactivé l’affichage des images.

Bien que l’utilisation d’images comme boutons puisse rendre ces derniers uniques et les faire ressortir, il est plus important qu’ils apparaissent pour tous vos abonnés si vous souhaitez qu’ils effectuent une action.

Choisissez les bonnes polices

Tout comme les images, les polices ne s’affichent pas toutes correctement sur l’ensemble des clients de messagerie. Vous devez donc choisir des polices universellement reconnues. Vous pouvez utiliser un générateur de polices pour vous aider à trouver la police adaptée à vos campagnes de marketing par e-mail afin qu’elles se démarquent et s’affichent correctement.

De plus, vous devez tenir compte de la taille et de l’épaisseur de la police, qui auront une incidence sur la capacité de votre bouton à se démarquer du reste du contenu de l’e-mail.

Considérez la destination

Lorsque vous utilisez des boutons d’e-mail, vous avez un objectif particulier en tête. Par exemple, les entreprises d’e-commerce qui font la promotion d’un produit afin d’augmenter leurs ventes auront probablement un bouton d’e-mail indiquant « Acheter maintenant » après avoir mis en évidence le produit dans le reste du contenu.

Si votre bouton ne mène pas à la page du produit, les abonnés seront confus et quitteront le site Web. Par conséquent, vous devez toujours vous assurer que vous définissez correctement les attentes des clients quant à la page sur laquelle ils seront redirigés lorsqu’ils cliquent sur votre bouton.

Rédigez un CTA percutant

Les éléments graphiques de votre bouton d’e-mail sont essentiels pour le faire ressortir, mais le CTA est indispensable pour définir les attentes et inciter les abonnés à passer à l’action.

Votre CTA doit être court et concis afin d’indiquer clairement aux clients ce qu’ils doivent faire. Une simple phrase telle que « Acheter maintenant » ou « Parcourir la collection » permet aux clients de savoir immédiatement à quoi s’attendre lorsqu’ils cliquent sur le bouton.

Faites attention au style de vos boutons

Le design visuel de votre bouton influe sur son apparence et sa facilité d’utilisation. Utilisez des couleurs contrastées qui ressortent bien sur le fond de votre e-mail et veillez à ce que vos boutons ressemblent à des boutons, avec des bordures, un remplissage et des effets de survol appropriés.

Lorsque vous configurez votre CSS, pensez à utiliser les propriétés d’affichage en bloc en ligne afin que vos boutons conservent leur forme dans différents clients de messagerie. La propriété text-align doit centrer le texte du bouton pour un rendu net et professionnel.

Tester vos boutons d’e-mail avant l’envoi

Même le bouton d’e-mail le plus esthétique ne donnera aucun résultat s’il ne fonctionne pas correctement lorsque les abonnés essaient de cliquer dessus.

Les tests constituent votre filet de sécurité contre les erreurs embarrassantes, telles que les liens rompus, les boutons qui ne s’affichent pas correctement ou les CTA qui semblent parfaits sur un ordinateur, mais impossibles à cliquer sur un appareil mobile.

Les marketeurs intelligents n’envoient jamais de campagnes sans les avoir testées minutieusement, car un seul problème technique peut compromettre les performances de toute votre campagne.

Prévisualisez sur tous les appareils et clients

Votre bouton peut sembler parfait dans votre créateur d’e-mail, mais cela ne garantit pas qu’il fonctionnera partout où vos abonnés le verront. Testez vos e-mails sur les principaux clients de messagerie tels que Gmail, Outlook, Apple Mail et Yahoo Mail afin de détecter tout problème d’affichage avant qu’ils n’atteignent votre audience.

N’oubliez pas les appareils mobiles. Utilisez des outils tels que Mailchimp pour voir exactement comment vos boutons s’affichent sur différentes plateformes, ou envoyez-vous simplement des e-mails de test sur différents appareils et applications de messagerie.

Utilisez les tests A/B pour le placement et le texte du CTA

Les tests A/B vous montrent ce qui fonctionne réellement auprès de votre audience spécifique. Essayez différents emplacements pour les boutons.

Vous pouvez également tester différents textes pour les boutons afin de déterminer si « Acheter maintenant » est plus performant que « Parcourir la collection » pour vos abonnés. Concentrez vos tests en ne modifiant qu’un seul élément à la fois et assurez-vous de disposer de suffisamment de données pour tirer des conclusions significatives avant de déclarer un gagnant.

Vérifiez le suivi des liens et l’accessibilité

Avant d’appuyer sur « Envoyer », cliquez sur tous les boutons de votre e-mail pour vous assurer que les liens fonctionnent correctement et qu’ils mènent bien à la bonne destination. Configurez des paramètres de suivi appropriés pour mesurer quels boutons et génèrent des clics et des conversions.

N’oubliez pas l’accessibilité. Vos boutons doivent être utilisables par les personnes handicapées, ce qui signifie qu’ils doivent comporter un texte alternatif, présenter un contraste suffisant entre les couleurs et pouvoir être actionnés à l’aide des commandes du clavier.

Ces petits détails peuvent sembler insignifiants, mais ils peuvent avoir un impact significatif sur votre délivrabilité et la réputation de votre marque.

Exploitez la puissance d’un CTA efficace

Un CTA efficace dans le cadre d’une campagne de marketing par e-mail ne se résume pas aux mots que vous employez pour inciter les utilisateurs à passer à l’action. Le simple ajout d’un bouton peut attirer leur attention sur votre CTA, définir leurs attentes et les aider à comprendre les étapes suivantes.

Les boutons sont le meilleur moyen d’indiquer aux abonnés ce qu’ils doivent faire ensuite, car ils se distinguent du reste du contenu de l’e-mail. Mailchimp facilite la conception de boutons pour e-mails qui encouragent les clics et les ventes. Avec une conception adaptée, vous pouvez améliorer l’efficacité de vos campagnes.


Principaux points à retenir

  • Des boutons d’e-mail bien conçus augmentent les taux de clics et les conversions en indiquant clairement ce que vous attendez de vos abonnés.
  • Les boutons HTML s’affichent dans tous les clients de messagerie, même lorsque les images sont désactivées, garantissant ainsi que vos CTA sont toujours visibles pour les abonnés.
  • Placez votre bouton principal au-dessus de la ligne de flottaison pour une visibilité maximale, mais répétez les CTA tout au long des e-mails plus longs afin de capter l’attention des lecteurs à différentes étapes.
  • Prévisualisez toujours vos boutons sur différents appareils et clients de messagerie, puis utilisez des tests A/B pour optimiser leur emplacement, leur texte et leur conception afin d’obtenir de meilleures performances.

Partagez cet article