Florian Potier

Création de Sites Web

Retour au site

Le guide complet de l'UX (maximiser son taux de conversion quand on n'y connaît rien)

OBJECTIF : Augmenter votre taux de conversion.


Graphique de taux de conversion

Maximiser le trafic sur votre site est essentiel.


Mais si les visiteurs n’achètent rien, c’est inutile.


94% des gens citent le design comme raison pour laquelle ils n'ont pas acheté (CX, 2019).


C’est là l’intérêt de l’optimisation du taux de conversion : Améliorer l'expérience utilisateur pour transformer vos visiteurs en clients.


Ce guide comprend 2 grandes parties.


D'abord, j'expliquerai dans le détail les différentes étapes du processus d'optimisation de votre taux de conversion.


Ensuite, je vous donnerai plein d'actions à mettre en place.


  1. Mettez en place du A/B testing

    1. Préparez-vous à optimiser votre taux de conversion

    2. Identifiez les points améliorables dans votre funnel de conversion

    3. Construisez des hypothèses et priorisez-les

    4. Testez

  2. Actions à tester

1. Mettez en place du A/B testing

1.1. Préparez-vous à optimiser votre taux de conversion

1.1.1. Une analytique en place

Personnellement, j'utilise Google Analytics.


capture d'écran du dashboard Google Analytics

Il vous donne accès à une centaine de métriques : nombre de visiteurs, taux de rebond (part des visiteurs ayant quitté le site après n'avoir consulté qu'une page), temps passé sur la page...etc.

1.1.2. Choisissez une plateforme de testing

Là encore, Google en propose une gratuite : Optimize.


logo Google Optimize

1.1.3. Comprendre votre funnel de conversion

Il s’agit du chemin pris par les visiteurs entre leur première visite et l’achat.


schéma du funnel de conversion

Comprendre ce funnel permettra d’améliorer chacune des étapes de la conversion.

1.1.4. Identifiez vos métriques

Alignez les métriques de votre business à celle de votre funnel de conversion.


tableau contenant les différentes métriques à mettre en lien avec les étapes du funnel

1.1.5. Traquez les micro-conversions et les macro-conversions

Certaines actions requièrent plus ou moins d’implication. Il faut bien les distinguer.


illustration des micro-conversions (téléchargements, inscriptions aux newsletters etc.) et macro-conversions (conversation téléphonique ou achat)

On ne mettra pas au même niveau un formulaire pour une newsletter qu'un formulaire de prise de contact.


Ils correspondent à deux stades bien différents du funnel de conversion.

1.1.6. Conduire un audit sur le taux de conversion

Pour savoir où vous en êtes, il est important de pouvoir comparer vos données aux sociétés similaires à la vôtre.


Pour ce faire, prenez les métriques choisies dans l’étape précédente.

1.2. Identifiez les points améliorables dans votre funnel de conversion

1.2.1. Comprenez ce que font les visiteurs sur le site

Grâce à Google Analytics, vous pouvez visualiser votre funnel de conversion et identifier vos faiblesses.


exemple de funnel de conversion de la page d'accueil à l'achat : 100% des visiteurs passent par la page d'accueil, 72% par une page catégorie etc. Seulement 12% achètent.

Dans l’exemple ci-dessus, il y en a 2 :


  • le passage de l’accueil à une catégorie de produits

  • le passage d’une page produit à un ajout dans le panier

1.2.2. Comprenez pourquoi les visiteurs font ce qu’ils font

Pour aller plus loin dans la compréhension du visiteur, il est possible d’utiliser des outils plus poussés pour visualiser :


  • Une carte de chaleur des éléments les plus cliqués sur chaque page.

  • Une carte de chaleur du scroll : jusqu'où sont descendus les visiteurs et quand sont-ils partis.

  • Les enregistrements des visites : comprendre les interactions des visiteurs avec la page.

Exemple d'une carte de chaleur sur une page web Exemple d'une carte de chaleur du scroll (jusqu'où descendent les visiteurs) Exemple d'un enregistrement de visite qui suit le parcours de la souris

1.3. Construisez des hypothèses et priorisez-les

1.3.1. Les formuler

Elles prennent la forme suivante : Changement + Effet voulu + Raison.


Par exemple :


"Je pense que changer la couleur du bouton en orange (Changement) augmentera le nombre de produits mis dans le panier (Effet) en attirant le regard sur la prochaine étape (Raison)."

1.3.2. Les prioriser

Pour suivre une direction claire et être efficace, mieux vaut prioriser intelligemment.


Il existe pour cela une méthode très simple mais terriblement efficace :


le PIF.


Les hypothèses prioritaires devront correspondre à ces 3 critères :


  • Potentiel : Les hypothèses concernant les éléments les moins performants.

  • Importance : Celles qui concernent les éléments les plus critiques pour le business.

  • Facilité d’exécution : Celles qui nécéssitent peu d'investissements ou de difficultés techniques.

Notez ces 3 éléments sur 5, additionnez-les et triez-les du plus grand (prioritaire) au plus petit (non-prioritaire).


Tableau de priorisation des hypothèses

1.4. Testez

1.4.1. Comment mener un test A/B ?

Explication du test A/B : 50% des visiteurs voient une page, 50% une autre page. On garde celle qui obtient le meilleur taux de conversion

Créez 2 versions de la même page.


La première reste telle qu'elle est. La seconde teste une hypothèse.


Pendant la durée du test, seuls ces éléments seront différents, ce qui permettra de mesurer leur impact.

1.4.2. Combien de temps dure le test ?

Il vous faut couvrir un échantillon représentatif donc, selon vos critères, quelques centaines voire milliers de personnes.


Voici un lien vers un calculateur de taille d'échantillon.


Il ne vous reste plus qu'à diviser la taille de l'échantillon voulu par le nombre de visiteurs quotidiens pour connaître le nombre de jours requis pour le test.


Exemple :


- Il vous faut 450 visiteurs, vous en avez 100 par jour.


Il faudra 9 jours (450x2/100) pour que chaque version de la page atteigne 450 visiteurs.


L’erreur à éviter : Vouloir faire trop vite.


  • Faire un seul test
  • Plusieurs tests simultanés
  • Ou des tests trop courts

Le résultat ?


Des chiffres biaisés qui ne seront pas vérifiés sur le long terme.


Comme bien souvent, faire trop vite au début va vous faire perdre beaucoup plus de temps.

1.4.4. Analyser et apprendre des résultats des A/B testings

3 résultats possibles :

  •  Changement gagnant


    Si le coût du déploiement est justifié par l’augmentation de revenus générée, mettez-le en place à grande échelle.


  •  Pas de différence


    Refaites des tests ou choisissez votre version préférée :)


  •  Changement perdant


    Pas de modification à mettre en place. Ce test n'était pas pour autant une perte de temps puisqu'il vous a permis d'en apprendre plus sur vos visiteurs.


    Peut-être pouvez-vous imaginer d'autres tests sur cette base ?

2. Les astuces

2.1 Le design général

illustration design d'une page web
  • Le design ne doit pas distraire le visiteur. Il est donc contre-productif de vouloir révolutionner la façon dont l’utilisateur doit interagir avec votre site.

  • D'ailleurs, les designs simples et familiers sont perçus comme étant plus beaux (TM Kent, 2018).

  • Trouvez l’équilibre entre de belles images qui vont capter l’attention et le texte nécéssaire pour délivrer l’information.

  • Aérez vos pages : Pour séparer les différents éléments, préférez les espaces vides aux lignes ou changez simplement la couleur de fond.

  • Structurer correctement votre site : tout doit être facilement trouvable.

  • Plus de la moitié du trafic étant mobile (58% selon Hitwise) soyez certains que votre site soit adapté. D'autant plus que les visiteurs sont encore plus volatiles sur mobile.

2.2. Le texte

  • Utilisez des phrases simples à comprendre (pas de tournures complexes).

  • Texte concis et aéré : s’il y a trop de texte, ça ne sera pas lu. Dans tous les cas, gardez à l'esprit que les visiteurs lisent en diagonale.

  • Mettez en valeur les mots-clés.

  • 2 polices maximum.

2.3. La première impression

La partie « above the fold » est la partie immédiatement visible sans descendre sur l'écran (en référence au pli des journaux qui ne laisse apparaître que la partie haute).


Elle va devoir accrocher le visiteur et lui donner envie d'en voir plus immédiatement.


schéma expliquant les parties above the fold/below the fold
  • Clarifiez votre proposition de valeur directement.

  • Parlez du bénéfice, pas du produit.

  • Ne surchargez pas d'informations, si la personne est sur le site, c’est qu’elle cherche à en savoir plus.

  • Encouragez le scroll avec des indices visuels.

2.4. Créez de la confiance :

  • Mettez en avant votre présence sur les réseaux sociaux, et les statistiques que vous avez (satisfaction client, taux de rétention…).

  • illustration du taux de satisfaction

  • Témoignages de vos clients. Pour les optimiser, ajoutez une photo et disposez-les où ils seront vus. En bas de la page d'accueil par exemple.

  • illustration d'un témoignage

  • Intégrez des images de votre produit en utilisation dans le design.

  • Supprimez les éléments qui pourraient ternir votre image : liens cassés, encarts publicitaires.

  • Les informations de contact : idéalement, montrez clairement email, numéro de téléphone et adresse. Si vous souhaitez éviter la prospection, je recommande un simple formulaire. Si votre produit est suffisament bien mis en avant sur le site, ils feront l'effort de le remplir.

  • Sécurité. Faites savoir aux visiteurs ce que vous faites de leurs données. Idem pour les paiements et n'hésitez pas à ajouter le logo de la plateforme par laquelle vous passez.


  • Si vous êtes cités dans des journaux, dites le et faites apparaitre les logos avec les liens vers les articles.

  • Humanisez la relation :
    • Une photo d’un membre de l’équipe pour la page SAV ou du patron pour la page « mot du président » par exemple
    • Vous pouvez également créer une vidéo (Formation sur le produit, Démonstration du produit et de ses bénéfices, Interview du DG, Evènement organisé par l'entreprise)

2.5. Les éléments interactifs

2.5.1. Les formulaires :

  • Formulaires adaptés : si c’est pour recevoir une newsletter, demandez juste l’email.
  • exemple de formulaire court avec juste l'email
  • La longueur dépend donc de l’usage.

  • Le plus important est qu’il soit simple et confortable à remplir.

2.5.2. Les boutons

  • Plutôt que des bordures, les ombres permettent de faire ressortir un élément (fonctionne aussi avec les formulaires par exemple).

  • le visiteur doit comprendre immédiatement que c’est un bouton et à quoi il sert. Par exemple, on préfèrera « Envoyez-moi un message » ou « Je vous rappelle » plutôt que « Contact »

  • Les boutons doivent être identifiables par effet (positif ou négatif) et par importance ("Annuler" ou "Supprimer" seront par exemple en rouge et "Envoyer" en vert).

  • exemple de design pour les boutons

2.5.3. Et après ?

Le visiteur a envoyé un formulaire de contact ou à réalisé un achat mais il ne faut pas pour autant le lâcher


Au contraire, c'est le moment d'enfoncer le clou :

  • Remerciez-le, c'est la moindre des choses.

  • Mettez en avant des articles ou produits en lien avec son action.

  • Offrez lui quelque chose. Ce sera l'occasion de le fidéliser.

2.6. Si vous vendez sur le site

Facilitez le processus d'achat pour éviter les abandons de panier.

  • Des instructions pas à pas.

  • Vérifiez l’email uniquement quand nécessaire.

  • Demandez la carte de crédit après l’essai gratuit.

  • Créez l’Urgence :
    • Temps : Offre valable pendant une durée limitée
    • Disponibilité : Stock limité

Besoin d'accompagnement ?


C'est mon métier !


Je peux vous accompagner sur :

  • Le développement de votre site web.

  • L'optimisation de votre référencement (voir guide du SEO).

  • L'optimisation de votre taux de conversion.

Cette approche complète du développement web vous permet d'être visible sur les moteurs de recherche et de maximiser la conversion de vos visiteurs en contacts.


En bref, de mettre votre site au service de votre business.