Bouton d’appel à l’action : le rédiger et le placer

Un visiteur convaincu doit encore agir : appeler, réserver, demander un devis, venir. Le bouton d’appel à l’action est l’endroit où cela se joue. Mal nommé, trop petit ou introuvable, il laisse repartir des clients déjà décidés.

Voici comment le choisir, le rédiger, le dimensionner et le placer.

Un objectif principal par page

Avant d’écrire le bouton, décidez de l’action qui compte le plus pour votre activité. Elle change d’un métier à l’autre :

• Un restaurant veut des réservations : « Réserver une table ».
• Un plombier veut des appels : « Appeler maintenant ».
• Une boulangerie veut des visites : « Voir l’itinéraire ».
• Un cabinet veut des rendez-vous : « Prendre rendez-vous ».
• Une photographe veut des demandes : « Demander mes disponibilités ».

Cette action devient le bouton principal, le plus visible de la page. Les autres, comme suivre votre compte Instagram ou télécharger une plaquette, prennent une forme plus discrète. Le Nielsen Norman Group recommande une hiérarchie visuelle nette pour les tâches prioritaires de la page d’accueil (2024). Trois boutons de même poids se font concurrence, et le visiteur hésite.

Un libellé qui dit l’action

Le texte du bouton dit ce qui va se passer, avec un verbe et son objet : « Réserver une table », « Demander un devis », « Appeler l’atelier ». Évitez « En savoir plus », « Cliquer ici » ou « Envoyer » seul.

Un libellé vague affaiblit ce que les ergonomes appellent la piste d’information : le visiteur ne devine plus ce qu’il trouvera après le clic. Il gêne aussi les personnes aveugles, dont le lecteur d’écran annonce souvent les liens hors de leur contexte (Nielsen Norman Group, 2015).

Le Nielsen Norman Group résume les qualités d’un bon libellé en quatre mots (2019) :

• Précis : il dit exactement ce que l’on trouve derrière.
• Sincère : la page qui s’ouvre tient la promesse. Si « Réserver » mène à un simple formulaire de demande, écrivez « Demander une réservation ».
• Autonome : il se comprend seul, sans le paragraphe qui l’entoure.
• Bref : les mots importants d’abord.

À côté du bouton, une courte phrase peut lever le dernier doute : « Réponse sous 24 heures », « Sans engagement », « Annulation gratuite la veille ». À condition qu’elle soit vraie.

Le téléphone et le courriel, cliquables

Un numéro de téléphone écrit en simple texte oblige le visiteur à le recopier. Mis en lien avec le préfixe « tel: », il lance l’appel d’un toucher sur un téléphone (MDN). Dans le lien, écrivez le numéro au format international, +33 suivi du numéro sans le premier zéro (web.dev). Le texte affiché, lui, reste lisible à la française.

Le courriel suit le même principe avec le préfixe « mailto: », qui ouvre la messagerie du visiteur (MDN). Affichez aussi l’adresse en clair : sur un ordinateur, tout le monde n’a pas de messagerie installée, et certains préfèrent la copier.

Deux réflexes :

• Montrez le numéro dans le bouton : « Appeler le cabinet » suivi du numéro. Le visiteur sait ce qu’il compose.
• Testez le lien depuis votre propre téléphone, après chaque changement de numéro.

Une cible assez grande pour un pouce

Un bouton trop petit fait rater le geste, surtout en marchant. Les règles d’accessibilité du web (WCAG 2.2) fixent des repères, mesurés en pixels CSS, l’unité de mesure des pages web :

Le critère 2.5.8 exempte les liens placés au fil d’une phrase ; votre bouton principal, lui, y est soumis. Pour un contrôle important, le W3C invite à viser le seuil le plus exigeant, et le Nielsen Norman Group conseille une cible plus grande que la moyenne pour l’action principale. Laissez aussi de l’espace entre deux boutons voisins, comme « Appeler » et « Itinéraire » : sinon, on touche l’un en voulant l’autre.

Où le placer

En haut, d’abord. Dans une étude d’oculométrie sur 120 participants, 57 % du temps passé à regarder une page portait sur le premier écran, et 74 % sur les deux premiers (Nielsen Norman Group, 2018). Le bouton principal se place donc juste sous le titre, visible sans faire défiler, sur téléphone comme sur ordinateur.

Puis là où la décision se prend :

• Après les tarifs, quand le visiteur vient de vérifier qu’il peut se le permettre.
• Après les questions fréquentes, quand ses derniers doutes sont levés.
• En bas de page, pour celui qui a tout lu.

Répéter le même bouton, avec le même libellé, n’a rien de redondant : chaque visiteur s’arrête à un endroit différent. Sur téléphone, ne le cachez jamais dans un menu.

Après le clic

Le bouton n’est que la moitié du chemin. La page d’arrivée doit tenir sa promesse : l’outil de réservation s’ouvre sur le bon établissement, le formulaire demande le strict nécessaire, et un message confirme que la demande est partie. Une fois par mois, faites le parcours vous-même, du premier écran jusqu’à la confirmation.

Dans les sites composés par 29webs, le bouton d’appel mène où vous voulez : une adresse https, par exemple votre outil de réservation, un courriel, un numéro de téléphone ou une ancre de la page. Le bloc contact, lui, réunit l’adresse, les horaires et des liens qui appellent, écrivent un courriel ou ouvrent WhatsApp d’un toucher.

En résumé : une action principale par page, un verbe qui la nomme, un numéro qui s’appelle d’un toucher, un bouton assez grand pour un pouce, et placé là où le visiteur décide : en haut, puis après chaque argument.