9 conseils de conception CTA importants pour les boutons qui incitent les gens à cliquer
Publié: 2022-08-27Votre appel à l'action (CTA) est le point culminant de votre stratégie marketing. Que vous demandiez un achat, une inscription ou un téléchargement. Jusqu'à présent, tout a consisté à attirer des clients potentiels sur votre page de destination. Et parfois, vous n'avez que quelques mots pour sceller l'affaire.
C'est pourquoi votre bouton CTA est l'élément de conception le plus important de votre site. Parce qu'il peut transformer les visiteurs passifs en utilisateurs actifs.
Les boutons d'appel à l'action semblent simples. Mais ils sont faciles à gâcher. Ou être complètement raté. Ces 9 conseils de conception CTA vous permettront d'obtenir cette conversion. De plus, de nombreux exemples utiles :
- Rendez votre bouton cliquable
- Soyez descriptif avec votre copie
- Taillez et espacez correctement
- Connectez-vous à la première personne
- Créer de l'urgence et utiliser des verbes forts
- Essayez un sous-titre
- Variantes des tests A/B
- Attention à la version mobile
Rendez votre bouton CTA cliquable
Faire en sorte qu'un bouton ait l'air "cliquable" semble idiot. Mais vous ne croiriez pas combien de fois les sites se trompent. Et cela a surtout à voir avec le contour et la couleur du bouton.
Les tendances du taux de conversion vont et viennent. Comme le "bouton fantôme" transparent avec une fine bordure et du texte qui s'estompe dans la couleur d'arrière-plan. Bien qu'ils aient l'air cool, ils ont tendance à attirer moins l'attention. Le contraire de ce qu'un CTA efficace devrait faire.
La seule fois où cette conception fonctionne généralement, c'est en tant que bouton secondaire :
Source : Mouvement UX
Voici un autre exemple de boutons CTA qui ne sont évidemment pas cliquables. Bien sûr, la page d'accueil de cette agence de design a l'air cool. Mais vous seriez pardonné de faire défiler cette étude de cas :
Alors, comment faites-vous pour que les gens cliquent ? Pour des taux de conversion plus élevés, votre bouton doit être grand, gras et fonctionner avec le jeu de couleurs que vous avez choisi.
Netflix utilise sa signature rouge pour attirer votre attention. Presque comme un panneau d'arrêt :
Il peut également fonctionner pour avoir une couleur contrastante, de sorte qu'il se démarque. Comme ce que la plate-forme de commerce électronique BigCommerce a fait ici :
Cela s'applique également au texte de la boîte. Assurez-vous qu'il contraste afin que vous puissiez le lire correctement.
Les dégradés peuvent également fonctionner dans le même jeu de couleurs de marque. Ils donnent aux choses une touche moderne et plus jeune :
Source : lundi
Mon conseil ici serait d'essayer de garder votre conception CTA évidente. Faire quelque chose hors de la boîte peut sembler une bonne idée, mais les humains sont des créatures d'habitude. Et vous seriez étonné du nombre de personnes qui manqueront le point.
Soyez descriptif avec votre copie
L'une des tactiques les plus simples d'optimisation du taux de conversion (CRO) est une excellente rédaction. Mais pas seulement avec de gros morceaux de texte. La microcopie est tout aussi importante et couvre les moindres détails.
Vous le voyez généralement dans les formulaires de contact et les barres de mise à jour du statut des médias sociaux. Comme le fameux « What's on your mind? » de Facebook. ou "Commencer une publication" de LinkedIn.
La microcopie peut aider :
- Dites aux utilisateurs quoi faire
- Faire des suggestions
- Répondre aux préoccupations
- Fournir un contexte
La copie de votre bouton CTA est un autre exemple. Et il devrait dire aux gens exactement ce qu'ils vont obtenir/ce qui va se passer lorsqu'ils cliquent dessus.
C'était le bouton CTA d'IMPACT. "Téléchargement Gratuit". Pas très imaginatif, hein ?
Source : IMPACT
Mais en le rendant plus descriptif, ils ont augmenté les conversions de 78,5 %. "Montrez-moi comment attirer plus de clients" a clairement séduit davantage :
Il est tentant d'écrire simplement "Cliquez ici". Mais il existe tellement d'alternatives qui engageront les utilisateurs et, espérons-le, inspireront l'action souhaitée.
Alors, que faut -il écrire ? Tout d'abord, vous devez identifier l'intention de conversion. Vous souhaitez vous aligner sur l'endroit où se trouvent les utilisateurs dans l'entonnoir et d'où ils viennent (source de trafic).
Source : ClientBoost
Ensuite, vous devez mettre l'accent sur la valeur de ce que vous fournissez. Et traiter toutes les objections.
Source : Exemples de marketing
C'est un processus tellement unique. Et cela dépendra de votre créneau et de la voix de votre marque. Mais quelle que soit la formulation que vous choisissez, n'oubliez pas de garder le texte du bouton court et précis.
Taillez correctement et utilisez des espaces blancs
La conception des boutons CTA est bien plus que la couleur. La taille des boutons est un autre petit détail qui peut vraiment affecter le taux de clics. Et l'espace blanc est tout aussi important que le texte lui-même.
Cela dépendra en grande partie de la conception de votre site Web. L'espace négatif (blanc) attire l'attention sur certains éléments d'une page. Vous ne voulez pas une page d'accueil encombrée. Il doit y avoir un chemin évident pour le visiteur à suivre.
Airbnb est l'un des meilleurs exemples d'espace négatif bien fait. Et une couleur contrastante pour le rendre encore plus évident :
Buffer a un peu plus sur leur page d'accueil mais ils gardent toujours le bouton CTA près de la copie principale. De plus, un exemple d'utilisation efficace des boutons fantômes. Cela indique très clairement ce qu'il faut faire ensuite :
Plus votre bouton est gros, plus il est visible. Et il doit se démarquer pour attirer l'attention. Mais pas au point de prendre le dessus sur la page et de gâcher l'UX.
Si vous êtes sujet aux migraines, détournez le regard maintenant. Voici un exemple de comment ne pas le faire :
Source : Justinmind
Tant d'éléments ici ressemblent à un bouton. Je ne suis même pas sûr que ce site sache sur quoi il veut que les visiteurs cliquent.
En revanche, quelle est la première chose que vous voyez sur la page d'accueil de Spotify ?
L'énorme bouton "Go Premium", n'est-ce pas ? Voilà comment concevoir un parcours utilisateur clair.
Enfin, y a-t-il autre chose que vous avez remarqué sur les conceptions CTA pour les bons exemples ? Si vous jetez un autre coup d'œil, vous verrez quelque chose qu'ils ont à peu près tous en commun.
Les scientifiques ont découvert que les humains aiment «les formes aux courbes douces par opposition aux pointes acérées». Ils sont plus agréables à regarder et nous font nous sentir plus paisibles. Pour cette raison, les boutons d'appel à l'action les plus efficaces sont des rectangles aux coins arrondis.
Source : CleverTap
C'est le format le plus populaire pour une raison. Mais essayez différentes options. Votre public pourrait préférer autre chose.
Connectez-vous à la première personne
Une meilleure conception CTA peut être un ajustement. Parfois, un seul mot.
En rédaction, on nous apprend à utiliser le mot « vous ». Parce que cela donne au lecteur l'impression qu'on lui parle directement. Vous pensez donc que cela s'appliquerait également à la copie de votre bouton, n'est-ce pas ? Bizarrement, pas tellement.
Unbounce a découvert que le fait de changer la copie sur sa page de destination de "Démarrez votre essai gratuit de 30 jours" à "Démarrez mon essai gratuit de 30 jours" augmentait les taux de clics de 90 %.
Alors, pourquoi est-ce? Eh bien, lorsqu'une personne se sent connectée à un produit, elle est plus susceptible de se convertir. Il donne cette touche personnelle sans avoir à en connaître quoi que ce soit.
La psychologie du marketing montre que les décisions d'achat sont principalement basées sur l'émotion. Donc, vous voulez que le visiteur de votre site Web ait l'impression que c'est son choix.
Écrire « mon » aide l'utilisateur à visualiser l'action qu'il est sur le point d'entreprendre. Cela leur donne le contrôle et (espérons-le) les pousse vers la prise de décision.
De plus, cela peut montrer qu'ils vont obtenir une valeur immédiate. Comme sur la page d'accueil de Crazy Egg :
Source : Oeuf fou
1-800 Contacts est le plus grand magasin de lentilles de contact au monde. Mais ils font pareil. Ils s'assurent que leurs boutons CTA ne sont destinés qu'à une seule personne :
Source : 1-800 Contacts
Peu d'entreprises utilisent cette technique. Ce qui signifie qu'il se démarque quand vous le voyez. Alors, pourquoi ne pas essayer ?
Créer un sentiment d'urgence et utiliser des verbes forts
Votre copie doit créer un sentiment d'urgence et attirer l'attention des utilisateurs. Cela fonctionne particulièrement bien pour les entreprises de commerce électronique. L'utilisation de mots comme « maintenant » et « aujourd'hui » peut aider à stimuler l'action. Parce qu'ils suggèrent que l'offre ne durera pas éternellement.
"Acheter maintenant" est un classique. Mais nous pouvons faire mieux que cela avec notre conception CTA.
Source : GoSquared
Vous pouvez essayer une formulation comme :
- "Faites-vous plaisir aujourd'hui"
- "Débloquez la réduction maintenant"
- "Téléchargement unique gratuit"
Vous souhaitez également rendre votre offre attractive et susciter la curiosité. Alors, commencez par un verbe fort. Pas quelque chose qui semble être un effort. C'est un moyen facile de décourager les gens.
Voici quelques exemples de ce que je veux dire :
Essayez ceux-ci : | Plutôt que ceux-ci : |
Découvrir | S'inscrire |
Relier | Soumettre |
Prétendre | Payer |
Rejoindre | Complet |
Commencer | Envoyer |
sauvegarder | Investir |
Explorer | Contact |
Trouver | Soutien |
Le côté gauche donne l'impression que vos utilisateurs obtiendront quelque chose en cliquant. Le côté droit donne l'impression qu'ils devront consacrer du temps ou de l'argent.
Vous pouvez aussi devenir vraiment créatif. Comme cette version de la page d'accueil de Huemor :
Source : FastCapital360
Ou l'ancienne page de destination du comté de Humboldt qui lui donne une touche mystique :
Source : ConEmprendimiento
Réfléchissez à des idées avec votre équipe. Aussi ridicule soit-il. Vous seriez surpris de ce que vous allez trouver et finir par utiliser. Mais quelle que soit la formulation que vous choisissez, n'oubliez pas de tenir votre promesse à l'autre bout.
Essayez un sous-titre à côté de votre bouton d'appel à l'action
Parfois, les gens ont besoin d'un petit coup de pouce. Et un peu de texte sous votre bouton CTA peut faire l'affaire. Ce n'est pas un "sous-titre" régulier. Mais c'est la façon la plus simple de le décrire.
Si nous considérons le texte du bouton comme le titre, le sous-titre le plus populaire que vous verrez est "Aucun détail de carte de crédit nécessaire". Mais le vôtre peut dire n'importe quoi. Et c'est amusant d'être un peu créatif avec ça.
La plupart du temps, ils sont utilisés pour donner confiance au client potentiel. Et ils peuvent traiter les principaux points douloureux que les gens pourraient avoir :
Source : CoSchedule
CoSchedule comprend que les utilisateurs pourraient penser qu'il ne s'agit que d'un essai gratuit. Alors pourquoi pas? C'est gratuit pour toujours » précise.
Vous pouvez également les utiliser pour ajouter une preuve sociale :
Source : Camp de base
Cela vous donne une crédibilité instantanée car les utilisateurs peuvent clairement voir que d'autres vous font déjà confiance. Cela peut également inspirer FOMO car les gens pensent qu'il doit y avoir des raisons pour tant d'abonnés.
Si vous avez une offre spéciale ou une valeur supplémentaire qui accompagne votre service, utilisez votre sous-titre pour le mettre en évidence :
Source : Moz
La microcopie est une chance pour que la voix de votre marque brille. Même si ce n'est qu'une seule phrase. Alors, n'ayez pas peur d'être un peu effronté si cela vous convient :
Source : ClientBoost
Vous pouvez également être précis avec exactement ce qui se passera après que les gens auront cliqué. Dis leur:
- Ce qu'ils obtiendront (nouvelles idées marketing)
- Combien (17+)
- Et pourquoi ils devraient s'en soucier (ils sont meilleurs que ce que vous avez)
Utilisez ces exemples comme modèles pour vous inspirer. Ou faire quelque chose de totalement différent. Assurez-vous simplement qu'il correspond à l'identité de votre marque et amusez-vous avec.
N'oubliez pas les tests A/B
La plupart des outils CRO visent à améliorer l'expérience utilisateur (UX). Et vous le faites peut-être déjà avec les principales parties de vos pages Web. Mais vous devriez aussi le faire avec les petits éléments.
Amazon est notoirement pointilleux sur ses conceptions de boutons CTA. Surtout avec une utilisation par des tiers. Alors, assurez-vous de ne pas enfreindre les règles avec le vôtre.
Après cela, de petits changements dans la conception de votre bouton peuvent avoir un impact énorme. Alors, comparez différents types de boutons CTA. Ensuite, testez les variantes A/B de :
- Couleur du bouton
- Copie de l'incitation à l'action
- Police de caractère
- Placement dans la conception de la page
- Pop-up
- Formulaires de contact
Source : Snov
Comme je l'ai mentionné plus tôt, changer parfois un seul mot peut augmenter le taux de conversion ou de clics. Mais avant de vous lancer, vous devez comprendre comment les visiteurs naviguent sur votre site.
Vous voulez découvrir des choses comme :
- Avec quels éléments ils essaient d'interagir
- D'où ils viennent
- Le parcours utilisateur/l'entonnoir d'achat de votre site
- La motivation des gens à être là
Source : GIPHY
Une fois que vous avez ces informations, vous pouvez expérimenter des choses basées sur des faits et non sur des conjectures.
Il est généralement plus facile de comparer une version A et B avec la conception CTA. Mais vous pouvez augmenter cela et essayer des tests multivariés. Plus simple est généralement mieux au début. De cette façon, vous aurez un gagnant clair.
Mais rien ne vous empêche de tester ce gagnant contre une autre version par la suite. Vous devriez toujours tester et comparer. Même lorsque vous avez trouvé quelque chose qui fonctionne. C'est ce que font les marques qui réussissent.
Attention à la version mobile
Une petite astuce pour finir. Vos éléments de conception seront très différents sur un écran mobile. Vous travaillez avec un écran beaucoup plus petit et moins de pixels. Ainsi, l'encombrement devient beaucoup plus facile.
Tout ce que nous avons couvert devient plus répandu dans votre version mobile. Les couleurs contrastées doivent se démarquer davantage :
L'espace négatif devrait être une priorité :
Et même votre sous-titre peut se trouver à un endroit différent. Comme les utilisateurs mobiles peuvent ne pas faire défiler assez bas pour le voir ci-dessous :
Bravo à CleverTap pour ces graphismes
Il faut réfléchir davantage à votre UX en général sur mobile. Parce que le mobile représente plus de la moitié du trafic de recherche mondial. Vous ne pouvez pas vous attendre à ce que votre version de bureau soit traduite. Et un peu d'effort pourrait entraîner un taux de clics beaucoup plus élevé.
Conclusion
Un design CTA efficace est composé de beaucoup de ces petits détails. Je l'ai dit tant de fois tout au long, mais le plus petit ajustement pourrait suffire. Même quelque chose d'aussi insignifiant que la couleur ou la forme du contour.
Les tests A/B sont le seul moyen de le savoir. Et vous n'avez même pas besoin d'un outil CRO coûteux pour le faire. Suivez simplement vos conversions. Faire un changement. Et voyez s'il y a une augmentation ou une diminution par rapport au nombre habituel.
Donnez simplement à votre bouton d'appel à l'action l'attention qu'il mérite. Cela pourrait faire la différence entre un nouveau client ou une opportunité perdue.
Avez-vous vu des designs CTA originaux récemment ? Avez-vous fait un petit changement qui a augmenté les conversions ? Faites-le nous savoir dans les commentaires ci-dessous.