E-commerce
0

Comment créer un bouton d’action efficace pour augmenter sa conversion ?

une-bouton-action

Le webdesign est votre meilleur allié pour améliorer la conversion sur vos pages web. Il faut en permanence regarder les évolutions des tendances, ce qui marche ou ne marche pas, ce que les internautes attendent ou ne souhaitent pas. C’est un éternel processus de tests, de mesures et de changements à mettre en place pour être en phase avec l’évolution du webdesign.

Ce qui est difficile sur une page, c’est de réussir à mettre en avant ses “boutons de conversions” ou “call-to-action” pour attirer l’attention des visiteurs et rendre votre offre intéressante.

Le contenu de votre page est sans aucun doute la partie la plus intéressante de celle-ci, mais encore faut-il le mettre correctement en avant avec des techniques de conception spécifiques, pour appuyer le message.

Les internautes qui vont arriver sur votre page ont des attentes, des habitudes et des comportements qui sont la plupart du temps prévisibles. Il faut donc réaliser une page qui soit en accord avec ces variantes.

Les internautes aiment les motifs visuels reconnaissables, qui se répètent plusieurs fois sur la page ou qui sont mis en avant de part leur couleur ou leur forme différente. Ils peuvent vite se détourner du contenu principal de la page pour être distraits par des éléments mis en avant, volontairement ou pas. Nous pouvons donc utiliser ces connaissances pour attirer leur attention.

La question est :

Comment mener vos visiteurs directement vers vos boutons de conversion, de manière subtile, sans être ennuyeux et sans les interpeller avec des points d’exclamation ?

Tous les boutons de conversion ont besoin d’attention pour être utiles

Pourquoi l’attention des visiteurs est aussi difficile à capter quand ils atterrissent sur votre page web ?

Parce qu’ils n’ont pas le temps de perdre le leur.

Le but et l’objectif de la plupart des sites web est d’attirer de l’audience et de réussir à déclencher une action sur leurs pages, que ce soit un abonnement à une newsletter, une interaction sociale ou l’achat d’un produit.

Mais quand les visiteurs ne connaissent pas votre site, qu’ils viennent y jeter un coup d’œil pour la première fois, ils vont difficilement vouloir s’engager en s’inscrivant à votre newsletter ou achetant un de vos produits. Et vous ne pouvez pas inviter des visiteurs à s’inscrire à votre newsletter en leur affichant un message qui indique “Venez et inscrivez vous sur mon site pour recevoir ma newsletter”. Personne ne voudra s’inscrire, la conversion ne se fera pas…

C’est par le contenu que vous réussirez à créer de la conversion sur votre site web, site e-commerce, votre blog etc. Parce que ce contenu (bonne fiche produit, article de blog, infographie, ebook gratuit, etc.) crée de l’engagement, qui lui même facilite la conversion.

Une fois que vous avez un contenu riche et de qualité, c’est le moment pour rediriger vos visiteurs qualifiés (intéressés par votre contenu) vers le prochain niveau de votre “tunnel de conversion”.

tunnel-conversion

Mais pour attirer l’attention de quelqu’un et lui faire faire une action sur votre site internet, c’est difficile. Plus l’engagement à mettre en place est important, plus il est difficile de convertir les visiteurs sur son site.

Par exemple, il est bien plus facile de demander à vos visiteurs de s’inscrire à votre newsletter en échange d’un contenu original (e-book, police gratuite, image, etc.) que de leur demander de payer pour quelque chose.

Un appel à l’action qui supposerait un engagement plus faible peut être plus direct. Vos visiteurs pourront s’engager plus facilement et plus rapidement si il leur suffit de cliquer sur un bouton ou de seulement remplir un champ “e-mail”. Comme par exemple les pétitions en ligne, qui pour la plupart ne demandent que votre nom, prénom et adresse e-mail, ce qui est rapide à faire pour un engagement personnel fort et une satisfaction directe.

Ce type d’appel à l’action sur une page web peut être mis en avant sous la forme d’une fenêtre ou avec une grande bannière en haut de la page. Rapide à faire, cet engagement ne demande pas beaucoup de ressources à vos visiteurs, ce qui leur permet de se concentrer rapidement sur le contenu dès qu’ils ont cliqué ou rempli un champ.

Mais un appel à l’action (bouton d’achat) placé bien en vu sur votre page de vente ne fonctionnera pas aussi bien, tout simplement parce que l’engagement demandé est fort (les visiteurs doivent dépenser de l’argent). Il faut donc avant de leur proposer d’acheter votre produit, les intéresser et combattre leurs appréhensions.

La solution est d’essayer de ne pas placer votre bouton d’appel à l’action (achat par exemple) trop en évidence, ou sur la première page. Il est plus judicieux de le placer dans un endroit stratégique, pour que les visiteurs puissent avoir accès dans un premier temps à du contenu de qualité qui les intéresse (image, design, texte informatif, référence, avis client, etc.). Il faut donc faire attention à ne pas vouloir convertir ses visiteurs en acheteurs trop tôt.

structure-engagement

Dans un premier temps, définissez vos motifs visuels

Il est certain que vous n’arriverez pas à faire interagir vos visiteurs avec votre site si vous avez seulement un bon design, même un excellent, parce que le contenu est primordial. Mais avec un bon webdesign, vous arriverez à orienter l’attention des visiteurs et mettre l’accent sur votre message.

Nous arrivons donc sur l’objectif essentiel de cet article, à savoir :

Comment réussir à organiser efficacement vos motifs visuels (votre design) pour attirer au mieux l’attention de vos visiteurs ?

L’identité visuelle de votre site est composée de votre logo, de la typographie utilisée, de vos couleurs et de la mise en page des éléments de l’interface utilisateur. Tous ces éléments combinés forment un tout et créent (si votre site est bien construit) une stratégie visuelle pertinente.
Identité-Visuelle

L’avantage d’avoir une identité visuelle bien définie, c’est que vous pouvez rendre la navigation sur votre site internet intuitive. Vous créerez ainsi une expérience utilisateur cohérente et positive, pour accompagner la lecture de votre contenu.

Pourquoi est-il si important d’avoir des motifs visuels cohérent et une identité visuelle définie ?

Parce qu’il sera plus facile de casser la structure visuelle de votre site de manière subtile et élégante, vous permettant ainsi d’attirer l’œil de vos visiteurs directement là où vous en avez envie. L’autre avantage est que vous allez créer de l’attention chez vos visiteurs, parce qu’ils seront attirés visuellement par cet élément qui sort du “cadre” de votre structure visuelle de base.

Imaginez que vous êtes invité à une fête où chaque invité est habillé avec des couleurs différentes, il sera très difficile de vous démarquer pour qu’on fasse attention à vous. Et pour y arriver, vous seriez obligé de porter des accessoires ridicules ou des habits grotesques :)

C’est ce qui se passe sur une page web. Si l’identité visuelle est cohérente, il sera facile de faire ressortir un bouton ou un texte qui sera visuellement mis en avant, par sa couleur, sa typographie, ses formes etc. Mais si votre page n’a aucune cohérence, avec des typographies variées et une tonne de couleurs différentes, il sera très difficile de faire ressortir visuellement un élément de celle-ci.

motifs-visuels

Maintenant, imaginez que vous êtes invité à une soirée “noir et blanc”, où tous les invités sont habillés de blanc et de noir. Que pourriez-vous faire pour vous démarquer ?

Il suffirait de porter un t-shirt rouge et tout le monde vous regardera. Voilà pourquoi il est important d’avoir un thème de base (identité visuelle) sans lequel vous ne pourrez pas rendre un élément différenciant et le faire remarquer par vos visiteurs.

Maintenant, on brise les habitudes visuelles

Maintenant que vous avez posé les bases de votre identité visuelle, avec des motifs visuels définis, il est temps de venir briser ces habitudes visuelles.

En ne respectant pas les règles de structure visuelle de votre page, vous allez pouvoir mettre en avant facilement des boutons, des champs spécifiques, des blocs de texte etc. Et pour cela, il ne faut pas seulement donner une couleur contrastante à vos éléments, mais aussi un contraste de forme, de dimension et même de position sur la page web.

Certaines techniques marcheront mieux avec certains groupes de visiteurs et d’autres techniques avec d’autres groupes de personnes, il vaut mieux donc en utiliser plusieurs.

Par exemple, pour faire ressortir un bouton, vous pouvez lui apposer un fond de couleur contrastant, une police en gras et de l’espace autour pour réaliser un important contraste contenu / espace :)

contraste-design

L’utilisation de l’espace est un excellent moyen pour mettre en avant quelque chose d’important, sans ajouter d’éléments perturbateurs (ligne pour souligner, contour de police, encart de couleur, etc.).

En insérant de l’espace autour d’un élément vous le mettez simplement en valeur, tout simplement parce que vous le séparez du reste du contenu. Cette séparation attire tout de suite l’œil du visiteur.

contraste-design2

Les boutons de conversion, quel que soit la forme qu’ils prennent, sont des outils incroyablement utiles et efficaces si ils sont bien utilisés. Avec des appels à l’action de ce type, vous encouragez vos visiteurs à interagir avec votre page, que ce soit pour acheter un de vos produits, lire un contenu, s’inscrire à votre newsletter et plein d’autres choses.

Alors n’hésitez pas à bien réfléchir à votre webdesign et surtout pensez à l’expérience utilisateur que vous voulez mettre en place 😉

Share on FacebookTweet about this on TwitterShare on Google+Email this to someone

Benoit Collet

Fan de jeux vidéo et de nouvelles technologies, je suis un geek polyvalent :) #CM chez Sitti, je reste à l'affût des nouveautés dans le SEO, SMO et tout ce qui touche à la Tech.

There are 0 comments

Leave a comment

Want to express your opinion?
Leave a reply!

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *