Refonte d'une page produit

🏆 Étude de cas

Temps de lecture :

5 min

Si tu veux aller plus loin, tu peux accéder à +50 ressources pour t’aider à booster tes conversions : Check-lists, formations vidéo, wireframes, études de cas, audits vidéos…

Accéder aux formations

Pour te montrer concrètement comment optimiser cette page produit, j’ai créé un design spécialement pour cette édition.

Voyons ce qui a été optimisé en détail. 👇

‍

Contenu réservé aux membres de La Cargaison Premium
Inscrivez-vous et accédez à toutes les ressources Premium du catalogue dès maintenant.

S'inscrire maintenant 👉

‍

1 - Le menu de navigation

Beaucoup de personnes pensent que pour optimiser les conversions, il faut rajouter du texte, des images, de la preuve sociale, des liens, etc.

Or, dans beaucoup de cas, optimiser un site = supprimer des choses.

Plusieurs choses ont été supprimées dans ce menu de navigation :

  • Les liens des rĂ©seaux sociaux : on peut juste les laisser dans le pied de page
  • Le lien “accueil” : ne sert Ă  rien et peut-ĂŞtre remplacĂ© par le logo
  • Les liens “blog” et “service client” qui pourrait ĂŞtre mis en retrait, sur la page produit et dans le pied de page

2 - Les images

Deux choses Ă  retenir ici :

  • Utilise des images avec le produit sur fond uni
  • Utilise des images dans leur contexte d’utilisation

J’ai tout simplement supprimé les images qui présentaient des promotions ou autres, ça ne fait qu’ajouter de la complexité.

3 - Texte et description produit

L’enjeu dans le copywriting d’une page produit est d’être à la fois clair et concis.

Dans l’ancienne page, on avait des répétitions, des phrases à rallonge, des infos peu pertinentes.

Dans la nouvelle version, on va droit au but.

4 - Design et hiérarchie visuelle

Plusieurs choses ont été revues ici.

En général, les designs trop agressifs et chargés visuellement convertissent moins.

On a ici un design plus minimaliste et moins agressif.

Différents fonds clairs pour dynamiser les sections de la page et la rendre moins longue.

On a également une meilleure hiérarchie visuelle.

Finis l’utilisation du violet et du vert à outrance qui crée de la confusion.

On a gardé la couleur verte uniquement pour les éléments d’interaction et pour le CTA.

Et la couleur violette pour le branding et pour mettre en avant les éléments importants.

5 - CTA

Sachant que la page peu être assez long, il peut être intéressant de donner la possibilité à l’utilisateur de cliquer sur “ajouter au panier” peu importe où il se trouve sur la page.

Un petit détail qui peut faire la différence, un CTA sticky a été ajouté.

À n’importe quel endroit de la page, l’utilisateur peut donc voir la note étoilée, le nom, le prix et peut ajouter au panier le produit.

Pour résumer

Tu peux voir avec cet exemple que : optimisation = simplification.

Dans beaucoup de cas, j’ai eu des résultats en A/B testant sur une suppression d’un élément.

Ça arrive quand le site à trop de liens, trop de sections, trop d’images, etc.

Pose-toi les bonnes questions :

  • Est-ce que tous les liens dans ton menu sont vraiment nĂ©cessaires ?
  • Est-ce que cette section ne crĂ©e pas encore plus de confusion dans la tĂŞte de ton utilisateur ?
  • Est-ce qu’avec cet argument de vente, tu n’es pas en train de te rĂ©pĂ©ter ?

‍

Formation 100% gratuite

Faites X2 sur les conversions de votre site

5 cours vidéos
3 check-lists
1 guide CRO chaque vendredi
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Des questions ?
Besoin d’aide pour vos projets persos ?

Je suis là pour vous accompagner ! Je réponds dans les 24h sur Whatsapp.

Contacter

+50 Formations et ressources pour booster vos conversions

"Des taux de conversion qui ont été multipliés par 2 sur certains clients"

Henri Priso

Traffic Manager @Inbound Value

Accéder à la formation 👉