Bonjour,
Récemment, j’ai envoyé à @eldy quelques suggestions d’amélioration du CSS des fiches produits sur le Dolistore.
Il les a intégrées : un grand merci à lui !
L’objectif était simplement d’aérer un peu la section description des pages produits, tout en corrigeant quelques soucis, notamment des liens qui n’étaient pas clairement distinguables du reste du texte.
En testant et en vérifiant ces petites modifications, j’ai fait quelques constats que j’aimerais partager et discuter avec la communauté.
Voici une capture d’écran d’une fiche produit sur le Dolistore actuellement :
Point 1 : les Distractions :
Certains blocs présents sur la page détournent l’attention de l’internaute et nuisent à sa concentration sur le produit. Cela s’avère particulièrement problématique à cause du point 4, qui introduit une ambiguïté : parle-t-on des compatibilités du module, ou d’autre chose ?
Les habitués du Dolistore savent sans doute de quoi il s’agit. Mais pour un visiteur qui arrive pour la première fois depuis Google, ce n’est pas forcément évident. Cette confusion peut réduire l’impact de la fiche produit et freiner la conversion.
Mon verdict : à retirer
PS : je parle de le retirer uniquement sur la page produit, sur les autres pages c’est ok.
Point 2 : C’est tout serré !
Le bloc de tarif et de mise au panier semble tout compressé, comme s’il n’était pas à sa place, recroquevillé, presque timide dans son coin.
Il mériterait d’être mis davantage en valeur, avec un peu plus d’espace et de présence visuelle. Bref, qu’on lui redonne de l’importance et de la matière !
PS : Dans le cas des modules, est-ce que la notion de quantité est vraiment utile ? À mon avis, pas tant que ça, ou je me trompe ?
Point 3 : Un bandeau (trop) visible… mais vide
Il y a ici un large bandeau noir qui attire immédiatement l’attention, mais qui reste vide à 90 %. Résultat : il capte inutilement le regard sans apporter d’information utile.
Pourquoi ne pas soit lui donner un vrai rôle (mettre en avant une info importante), soit le rendre plus discret s’il n’est pas essentiel ?
Ou alors revoir le bandeau tout simplement.
Proposition
Puisque je n’aime pas critiquer sans proposer de solutions, voici un exemple réalisé rapidement sous Inkscape.
Pour la partie des icônes placée au-dessus de la description courte, je me suis inspiré de l’approche utilisée par PrestaShop, c’est simple, lisible et efficace.
Cela dit, cette section mérite encore d’être retravaillée pour la rendre plus pertinente et mieux adaptée à l’univers Dolistore.
Petit rappel : il s’agit ici d’une réorganisation rapide à des fins de démonstration.
J’ai utilisé des morceaux de captures d’écran que j’ai agrandis, ce qui explique le côté un peu flou ou “baveux” de certains textes.
L’objectif n’est pas de juger les couleurs ou le design final à ce stade, mais bien de se concentrer sur le positionnement et l’agencement des éléments.
Voilà pour ma proposition
N’hésitez pas à me dire ce que vous en pensez : suggestions, améliorations, objections… tout retour est le bienvenu !