Sur un catalogue de plus de cent références, les filtres ne sont pas un confort mais la condition d’accès aux produits. Leur mise en place pose trois questions : quels attributs rendre filtrables, comment tenir la charge sur un gros catalogue, et comment les rendre utilisables sur un écran de téléphone.
Les conséquences de ces filtres sur le référencement relèvent d’un sujet distinct, traité séparément.
Quels attributs rendre filtrables
La tentation est de tout proposer. C’est l’erreur la plus fréquente et la plus coûteuse en performance comme en lisibilité.
Trois critères pour retenir un filtre.
Il est renseigné sur au moins 80 % des produits de la catégorie. Un filtre matière alimenté sur trente produits sur deux cents produit des sélections trompeuses : le client croit avoir vu tout le rayon alors qu’il a vu ce qui était documenté.
Il discrimine réellement. Un attribut dont 95 % des produits partagent la même valeur ne filtre rien. Regardez la distribution des valeurs avant de décider.
Il correspond à un critère de choix. Le client filtre sur ce qui l’aide à décider, pas sur ce que votre fournisseur a jugé utile de documenter. Le poids emballé, la référence interne ou le code douanier n’ont rien à faire dans un panneau de filtres.
Un repère : six à huit filtres par catégorie couvrent la quasi-totalité des besoins. Au-delà, le panneau devient un formulaire.
Les filtres varient par catégorie
Point de conception souvent négligé, qui fait la différence entre un panneau utile et un panneau générique.
La pointure a du sens sur les chaussures, aucun sur les accessoires. La puissance a du sens sur l’outillage électrique, aucun sur la visserie.
Un panneau de filtres identique sur toute la boutique affiche donc partout des critères sans valeur, ce qui noie les critères pertinents. La configuration doit se faire par catégorie, avec un jeu de filtres hérité et surchargeable.
Corollaire pratique : les valeurs proposées doivent se restreindre à celles présentes dans la catégorie courante. Proposer trente couleurs quand la catégorie n’en contient que quatre est une erreur d’implémentation courante.
Filtres à Facettes AJAX PrestaShopLa navigation à facettes qui filtre vite et indexe juste€99.00
Les types de filtres
Quatre formes, chacune adaptée à un type de donnée.
Les cases à cocher pour les valeurs discrètes : marque, matière, taille. Permettent la sélection multiple, qui est le comportement attendu.
Les pastilles de couleur pour les couleurs, évidemment, avec le nom en infobulle. Une liste textuelle de couleurs est nettement moins efficace.
Le curseur de prix, à double poignée. Deux précautions : afficher les bornes réelles de la catégorie plutôt que des valeurs fixes, et permettre la saisie directe des montants pour ceux qui savent ce qu’ils cherchent.
Les interrupteurs pour les critères binaires : en stock, en promotion, livraison rapide. Ils se placent en tête de panneau parce qu’ils sont les plus utilisés.
Le compteur de résultats
Élément décisif pour l’usage, et il pose une vraie difficulté technique.
Afficher le nombre de produits derrière chaque valeur évite au client de sélectionner une combinaison vide. C’est ce que font toutes les interfaces de filtrage abouties.
Le coût est réel : calculer ces compteurs suppose autant de requêtes d’agrégation que de valeurs affichées, à chaque changement de sélection.
Trois approches selon la taille du catalogue. Sur un petit catalogue, le calcul direct passe sans optimisation. Sur un catalogue moyen, une requête d’agrégation unique remplace les requêtes par valeur. Sur un gros catalogue, un index dédié ou un moteur de recherche externe devient nécessaire.
Règle d’affichage complémentaire : une valeur à zéro résultat se grise plutôt que de disparaître. Sa disparition fait sauter la liste et désoriente.
La performance sur gros catalogue
Trois goulots d’étranglement, dans l’ordre où ils apparaissent.
Les requêtes de filtrage. Un filtre sur plusieurs attributs produit des jointures multiples sur les tables d’attributs et de caractéristiques. C’est ce qui met une base à genoux sur les catégories importantes.
Le calcul des compteurs, évoqué plus haut, qui coûte souvent davantage que le filtrage lui-même.
Le comptage total, nécessaire à la pagination. Sur une sélection large, il porte sur des dizaines de milliers de lignes.
Deux leviers avant d’envisager une refonte. Une table d’index dédiée qui pré-calcule les correspondances produit-valeur, mise à jour à chaque modification de catalogue. Et un cache par combinaison, sur une durée courte, qui absorbe les sélections les plus fréquentes.
Point de méthode : mesurez avant d’optimiser. Chronométrez le temps de réponse d’un filtrage sur votre plus grosse catégorie, avec trois filtres actifs. Si vous dépassez une seconde, le problème est réel et localisable.
Le comportement mobile
C’est ce qui décide de l’usage réel, puisque la majorité du trafic y passe.
Le panneau latéral du desktop n’a pas d’équivalent sur mobile. La solution qui fonctionne est un panneau plein écran, ouvert par un bouton, avec les filtres empilés verticalement.
Cinq règles d’implémentation.
Le bouton d’ouverture reste accessible pendant le défilement, en position fixe, avec le nombre de filtres actifs affiché.
L’application est explicite. Sur mobile, le filtrage à chaque coche produit des rechargements incessants. Le visiteur coche ce qu’il veut, puis valide avec un bouton qui affiche le nombre de résultats attendus.
Les filtres actifs sont visibles après fermeture du panneau, sous forme d’étiquettes retirables d’un geste.
La réinitialisation est accessible sans rouvrir le panneau.
Le panneau se ferme au retour, sans quitter la page. Un panneau plein écran qui piège le bouton retour est une friction majeure.
Ce qui casse en production
Quatre situations à vérifier après mise en place.
Les filtres sur les déclinaisons. Un produit disponible en rouge taille S et en bleu taille L doit-il apparaître dans une sélection rouge plus taille L ? Non. Le filtrage doit porter sur les combinaisons existantes, pas sur le croisement des attributs du produit.
La disponibilité. Un filtre en stock qui se base sur la quantité du produit sans tenir compte des déclinaisons produit des faux positifs.
Le tri après filtrage. Il doit se conserver quand le visiteur modifie un filtre, sinon il repart à zéro à chaque ajustement.
Les catégories vides après filtrage. Prévoyez un message utile plutôt qu’une page blanche : proposez de retirer le dernier filtre appliqué, qui est presque toujours celui qui a vidé la sélection.
Mesurer
Trois indicateurs.
Le taux d’usage des filtres par catégorie. Une catégorie où personne ne filtre est soit trop petite pour en avoir besoin, soit dotée de filtres inadaptés.
Le classement des filtres utilisés. Vous découvrirez presque toujours que trois filtres concentrent l’essentiel des usages, ce qui justifie de les remonter en tête et d’envisager la suppression des autres.
Le taux de conversion des sessions avec filtrage, comparé aux sessions sans. Un visiteur qui filtre a une intention plus précise, et l’écart mesure la valeur du dispositif.
Le module Filtres à Facettes AJAX pour PrestaShop met en place ce dispositif sur PrestaShop 8 et 9 : configuration des attributs filtrables par catégorie, filtrage sans rechargement avec compteurs de résultats, index dédié pour les gros catalogues et panneau plein écran avec validation explicite sur mobile.