Malgré ce que beaucoup de gens vous diront, il n’existe aucune règle stricte en ce qui concerne les boutons d’appel à l’action. Oui, c’est vrai que les gros boutons colorés entourés de beaucoup d’espace sont généralement les plus efficaces, mais il est important d’adapter chaque bouton à la tâche principale de la page Web en question, que ce soit pour l’inscription, le paiement, l’enregistrement ou quoi que ce soit. autre. En tant que concepteur, il vous appartient de faciliter au maximum les tâches des visiteurs. Les boutons d'appel à l'action sont les outils les plus puissants à votre disposition. Utilisez-les judicieusement.
De manière générale, les boutons d’appel à l’action doivent être simples et clairs. Ils doivent se démarquer et attirer l'attention d'un utilisateur. Tout doit être soigneusement étudié, des mots clés aux couleurs, tailles, formes et positionnement. Ces boutons doivent être très visibles, mais ne doivent pas être trop criards pour rendre votre site laid ou déséquilibré.
Ci-dessous, nous examinons plus en détail 25 des boutons d'appel à l'action les plus convaincants disponibles sur le Web. Nous examinons pourquoi chaque bouton individuel a autant de succès. J'espère qu'ils vous donneront une idée des choses à faire et à ne pas faire pour vous aider à inspirer vos propres conceptions.
1. WordPress e-Commerce
Il est important de laisser votre bouton se démarquer en utilisant la couleur. Si vous pouvez choisir une couleur qui correspond à la palette de votre site, comme celle-ci, les résultats sont d'autant plus intéressants.
2. Skype
Ceci? Télécharger maintenant? le bouton est assez simple. Ce n'est pas particulièrement grand ou de couleur vive. Cependant, il est entouré de nombreux espaces blancs, ce qui le rend encore plus visible pour les utilisateurs.
3. Picsengine
Picsengine compte sur le placement pour assurer le succès de ses travaux. Voir en action? bouton. Le bouton est coincé au milieu de la page, sans autre texte, lien ou bouton susceptible de le gêner.
4. Mozilla Firefox
Le téléchargement gratuit de Mozilla Firefox? bouton a suscité beaucoup de débats. La plupart des gens, y compris moi-même, pensent que son design large, de forme irrégulière et de couleurs vives est véritablement révolutionnaire en termes de graphismes incitant à l’action. Une petite minorité, cependant, affirme que cela crée de la confusion et ne ressemble en rien à un bouton.
5. CakePHP
CakePHP? Télécharger? Le bouton a été créé pour une grande taille et une forme inhabituelle. Cependant, sa clarté ne s'est pas faite au détriment de l'esthétique générale du site. Il se glisse facilement dans le décor grâce à ses couleurs assorties.
6. Crazyegg
Crazyegg a conçu son site autour de son bouton d’appel à l’action, situé fièrement au milieu de la page d’accueil, entouré de beaucoup d’espaces blancs. Sa couleur jaune vif n'est reflétée que par l'autre bouton d'appel à l'action de la page - le plus petit? bouton en haut à droite.
7. Litmus
Litmus n'a pas dépassé les bornes avec son bouton d'appel à l'action; néanmoins, c'est très clair, en grande partie grâce à l'espace vide qui l'entoure et à sa forme arrondie, qui ne se retrouve nulle part ailleurs sur la page.
8. StumbleUpon
Avoir un objectif de fonction principal par page permet aux utilisateurs de localiser plus facilement les boutons d'appel à l'action, mais parfois, cela n'est tout simplement pas possible. Il y a des tas de choses à cliquer sur la page d'accueil de StumbleUpon, mais le bouton "Start Stumbling?" bouton se démarque vraiment, grâce à son utilisation de la couleur dans un cadre autrement monotone
9. Rappelez-vous le lait
Remember the Milk offre aux visiteurs plusieurs options sur sa page d'accueil, mais la plus importante - "Inscrivez-vous maintenant!" - est de loin la plus claire, placée au milieu de la page, entourée d'un cadre coloré et en majuscule. Pas besoin de couleurs vives et brillantes ici.
10. Création Lifetree
Lifetree Creative a réussi à rendre son bouton d'appel à l'action vraiment plus grand, encore plus grand que le logo de la société, sans que la page ne paraisse déséquilibrée. Couleur, forme, taille et espace ont été utilisés à bon escient ici.
11. Dailymile
Dailymile a fait quelque chose d'assez inhabituel avec son bouton d'appel à l'action. Il est disposé au-dessus de tout le reste de la page, avec une ombre portée subtile derrière. Aidé aussi par le fait qu'il soit vert, le bouton ressort vraiment.
12. Carsonified
La page d'accueil de Carsonified contient beaucoup d'informations, néanmoins, le? Achetez vos billets? Le bouton brille à travers, grâce à son utilisation des majuscules et de la couleur. Les lettres blanches se détachent vraiment bien contre le rouge.
13. planHQ
PlanHQ a utilisé la puissance de l'espace blanc pour accentuer ses boutons d'appel à l'action. Ni de couleurs vives ni trop grandes, ces boutons sont clairs grâce aux blocs de blanc dans lesquels ils reposent.
14. choses
Things a deux boutons d’appel à l’action sur sa page d’accueil, tous deux d’une importance similaire pour la société. Pour cette raison, leur forme, leur taille et leur couleur sont identiques, mais les deux se démarquent bien du bleu clair et du gris.
15. Livestream
Le rouge est une excellente couleur à utiliser lorsque vous souhaitez attirer l’attention sur quelque chose. Il se détache mieux sur un fond noir et blanc, comme celui utilisé sur la page d'accueil de Livestream. La forme de la flèche de la? Diffuser maintenant? bouton, dans le coin supérieur droit, incite les utilisateurs à cliquer en avant.
16. Ncover
Ncover est encore un autre site avec deux boutons d’appel à l’action sur sa page d’accueil. En utilisant la couleur verte sur un fond bleu, Ncover a réussi à donner la priorité à un bouton plus important que l’autre.
17. Tableau de bord
Le rouge sur un fond noir et blanc apparaît à nouveau ici. En plus de sa couleur, celle du tableau de bord? Essayez-le gratuitement!? Le bouton est très visible grâce à sa taille, qui offre suffisamment de place pour le logo et? Inscrivez-vous en 60 secondes? pour être inclus.
18. gens libres
Cette page peut sembler plutôt standard, mais vous seriez surpris de voir combien de sites de commerce électronique se trompent en ce qui concerne leur? Add to cart / basket? boutons. Le bouton Free People's est évident sans être inconfortable, grâce à sa couleur et à sa taille grande mais modeste.
19. ClickFormant
Il est généralement préférable d’utiliser des mots de déclenchement standard pour les boutons d’appel à l’action. Pour une liste de diffusion, le bouton devrait normalement se lire? Inscription? ou? rejoindre ?. Parfois, cependant, la variation de ces mots peut réellement améliorer l'image de marque d'une entreprise. C'est ce que ClickFormant a fait en utilisant le mot "Informer".
20. Kalculator
Les gros boutons d’appel d’action surdimensionnés ont souvent beaucoup de succès, mais peuvent paraître laids et parfois un peu désespérés. Conscient de cela, Koombea a utilisé le positionnement, la couleur, l’espace et la forme plutôt que la taille pour faire briller son bouton.
21. camp de base
Basecamp est géré par un groupe très intelligent, il n’est donc pas surprenant que son bouton d’appel à l’action soit tout aussi intelligent. De nombreux sites commettent l'erreur de positionner un bouton en haut de la page, ce qui est bien, jusqu'à ce que l'utilisateur fasse défiler l'écran et qu'il soit masqué. Le bouton de Basecamp apparaît deux fois: une fois en haut et à nouveau en bas.
22. Spotify
Spotify? Achetez maintenant? button est un excellent exemple de la meilleure façon d'utiliser la couleur et l'espace. De couleur vert clair et entouré de blancheur, le bouton est évident pour tous.
23. Dropbox
La présentation de la page d'accueil de Dropbox est aussi simple et logique que Dropbox (un outil fantastique, que vous devriez vraiment essayer si vous ne l'avez pas déjà fait!). Les visiteurs ne se font aucune illusion quant à ce qu'ils devraient faire ici. Ils peuvent soit? Regarder une vidéo? ou "Télécharger Dropbox" - c'est aussi simple que cela.
24. 280 diapositives
Essayez-le maintenant? ? bouton à 280 diapositives est grand? vraiment gros! Il n'y a aucun moyen qu'un visiteur puisse le manquer. Il est bleu, de la même couleur que l’arrière-plan, il n’a donc pas l’air aussi inesthétique qu’il le pourrait facilement.
25. FlockDraw
FlockDraw? Commencez à dessiner? Le bouton est l’un des plus attrayants de cette liste. En plus de sa superbe couleur qui le distingue de l'arrière-plan en sourdine, il est légèrement éclairé et souligné par des touches multicolores.
Conclusion
Si un type de bouton d'appel à l'action rencontrait plus de succès qu'un autre, vous pouvez être sûr que tous les sites Web l'utilisent. Bien qu'il soit possible d'identifier les similitudes entre les boutons ci-dessus, il existe également de nombreuses différences. Il est essentiel de tester différentes combinaisons de boutons d'appel à l'action sur votre site afin de déterminer leur incidence sur les taux de conversion. Vous pouvez le faire facilement en utilisant Google Website Optimizer. Quelle que soit l'apparence de vos boutons d'appel à l'action, assurez-vous qu'ils correspondent à la conception générale de votre site Web.