Zara.fr : quelques soucis sur la page-liste (2/2)

La page-liste du site de Zara s’apparente beaucoup à la page des résultats du moteur de recherche dont j’ai parlé dans mon message précédent. On y retrouve donc le problème du bouton « page précédente » en plus d’un certain nombre d’éléments qui pourraient être améliorés. Tous ne présentent pas la même importance ; je commence donc par les plus anecdotiques, visibles sur cette première copie d’écran.

Zara - quelques soucis mineurs

• La balise ALT des boutons permettant de faire défiler les pages est bien remplie… mais avec du texte en espagnol. Pas très sérieux, mais pas bien grave.
Note : c’est aussi le cas du logo du site.

Plusieurs articles ont des dénominations étranges. Sur la première page de la catégorie « T-shirt », on trouve par exemple un débardeur intitulé « chemise texte ». Dans la catégorie « chemises », les 4 premiers produits sont des tops. Pas sûr que la cliente s’y retrouve.
Note : au lancement du site on trouvait des choses bien plus surprenantes. J’avais lu un message à ce sujet mais je ne le retrouve pas, avis aux connaisseurs…

• Certaines descriptions sont agrémentées d’un lien « + Couleurs » qui renvoie vers la fiche produit. Si l’information « cet article existe en plusieurs coloris » est intéressante pour la cliente, le libellé du lien n’est pas parfaitement adapté. Il l’aurait été s’il permettait par exemple l’ouverture d’un layer présentant l’ensemble des coloris disponibles.

• Un clic sur le lien « collection » du breadcrumb me renvoie… sur la catégorie de produits « trenchs et parkas ». Pas très logique. Par ailleurs, l’arborescence de la boutique « femme » pourrait être simplifiée : quel est l’intérêt de ce niveau « collection » puisqu’il est le seul élément de niveau 2 ?

• Lorsque je clique sur le lien « voir tout » tous les produits s’affichent. Pratique… jusqu’à ce que j’affine ma sélection : à chaque nouveau critère, je dois appuyer à nouveau sur le lien.

Je continue avec des problèmes plus gênants, qui concernent à une exception près le module d’affinage.

La taille des boutons de navigation mériterait d’être revue, les 2 flèches sont vraiment trop petites.

• Lorsque je coche un critère (par exemple couleur > « noirs »), la page se rafraîchit et seuls les produits qui correspondent à ma recherche s’affichent. Parfait. Malheureusement, mes critères ne sont affichés nulle part ; le seul indice me permettant de savoir quels critères sont sélectionnés est le graissage du type de critère sélectionné (dans cet exemple, le mot couleur).
Cette absence est gênante pour deux raisons : il est impossible de connaître les critères d’affichage des produits de la page autrement qu’en ouvrant les menus les uns après les autres, et il est impossible de tous les supprimer d’un clic.

Zara - critères sélectionnés masqués impossibles à supprimer d'un seul clic

• L’utilisation de l’affinage par prix est assez obscure, et l’absence de curseur « prix minimal » déroute.

Zara - affinage par prix peu pratique

• Je clique sur « couleur » pour ouvrir le menu correspondant. Si je clique sur une zone vide du menu, celui-ci se referme. Mieux vaut bien viser… Par ailleurs, les intitulés des critères sont cliquables (si je clique sur le texte « noirs », la case se coche) : c’est un bon point, malheureusement peu mis en valeur puisque aucun élément de l’interface n’indique cette possibilité (au passage de la souris, l’intitulé ne change pas d’état – pas de soulignement, par exemple – et le curseur ne se transforme pas en « main »).

Zara - critères cliquables peu mis en valeur

Certaines sélections (même très simples, comme « T-shirt + jaune », « Chaussures + chaussures de sport ») ne retournent aucun produit.

Zara - une sélection simple ne retourne aucun produit

Plusieurs critères de taille sont rangés dans un ordre inexplicable : les pointures ne sont pas dans l’ordre, les ages (mélangés aux codes – XS, XL, L…) non plus. Pire, certaines tailles sont tout simplement incompréhensible (à quoi correspondent les nombres 19, 20, 21 ?) Par ailleurs, j’ai trouvé 2 fois le critère « Autres » (un critère fort utile au passage) dans les couleurs de la sous-catégorie « chaussures femme ».

Zara - ordre inexplicable de certains critères de taille

• Comme je le disais plus haut, lorsque je coche un critère (par exemple couleur > « noirs »), la page se rafraîchit et seuls les produits qui correspondent à ma recherche s’affichent. Parfait… enfin presque, puisque les visuels des articles ne sont pas ceux de la couleur choisie, mais ceux « par défaut ». C’est d’autant plus dommage qu’apparemment tous les produits sont photographiés dans toutes les couleurs possibles (cf. fiche produit).

Zara - les visuels des articles n'affichent pas la couleur sélectionnée

• La catégorie « chaussures » de la boutique femme regroupe plusieurs sous-catégories (« chaussures à talon », « sandales plates » etc.) Étrangement, la sous-catégorie « sandales à talons » ne présente pas le même nombre d’articles que la catégorie « chaussures » agrémentée du critère de sélection « sandales à talons ».
Note : le problème est le même avec les sous-catégories « sandales plates », « talons compensés »…

Zara - mêmes critères, nombre d'articles différent

Bonus

Le premier niveau de l’arborescence du site propose les traditionnelles catégories « femme », « homme », « enfants »… ainsi qu’une catégorie au nom plus obscur, « TRF ». Un clic sur cet intitulé m’indique qu’il s’agit de produits féminins, mais ne m’en dit pas davantage sur la signification de l’acronyme.
Après avoir cherché un petit moment sur le site sans trouver de réponse, je m’en suis remis à Google : le premier résultat de la recherche est le site de la Table Ronde Française, le second une page de Wikipédia traitant d’un groupe de J-pop et le troisième un aéroport d’Oslo. Pas très convaincant. Je demande à plusieurs personnes de mon entourage, certaines travaillant dans la mode : pas de réponse non plus.
Alors d’accord, une recherche un peu plus poussée sur Google me donnera une réponse, mais quand même, ne serait-il pas intéressant d’en dire un peu plus ?
Et ici, quelqu’un connait-il la signification de TRF ?

Bilan

balises ALT mal remplies
libellé approximatif
niveau d’arborescence inutile
fonctionnalités à retravailler
sélections simples vides
affichage des articles dans la bonne couleur
taille des boutons de navigation
affichage des critères d’affinage
détails du layer d’affinage
critères mal rangés
variation du nombre d’articles sur des critères identiques

Zara.fr : une recherche chaotique (1/2)

La mise en ligne du site e-commerce de Zara il y a environ un an a été largement commentée sur internet. En décalage complet avec la plupart de ses concurrents (interface très épurée, absence quasi-totale d’opérations commerciales…), il se détache franchement des n°1 de la vente en ligne que sont La Redoute et 3 Suisses entre autres.

Amateur de minimalisme (mes 3 sites internet l’indiquent assez nettement), son look m’a vraiment emballé.

Il y a quelques jours, j’ai tenté de savoir si l’utilisation du site était à la hauteur de mes espérances. J’ai commencé par une simple recherche « veste homme ». La page des résultats indique que 100 articles correspondent à ma requête.

Étrangement, tous les articles de cette première page sont issus de la boutique femme. Les premiers produits « homme » ne sont visibles qu’en page 2. Et comme il est impossible d’affiner sa recherche, il sera nécessaire de balayer les 9 pages de résultats pour tous les découvrir.

Pour ne rien arranger, seuls 11 produits sont affichés sur la première page alors que 12 emplacements sont présents. L’impression d’avoir devant soi l’ensemble des résultats de la recherche risque de détourner les clients qui n’auront pas jeté un œil au nombre total d’articles précédemment évoqué. Et ce n’est pas la taille du bouton « page suivante » qui les aidera à se rendre compte de leur erreur.

Les courageux qui tenteront de fouiller ces 9 pages devront par ailleurs bien faire attention à ne pas utiliser le bouton « page précédente » de leur navigateur : celui-ci renvoie l’utilisateur à la page qu’il consultait avant de faire sa recherche – dans mon cas la page d’accueil du site – au lieu de lui permettre d’afficher la page de résultats précédente.

Cette première expérience plutôt décevante m’a donné envie de me pencher plus longuement sur certains points. Je m’attarderai donc d’ici quelques jours sur la page-liste du site, qui présente plusieurs éléments qu’il serait intéressant de retravailler.

Boulanger.fr : le retrait en magasin, une mécanique complexe à mettre en place

Le retrait en magasin est une fonctionnalité pratique et appréciée des internautes, mais parfois complexe à gérer pour les enseignes marchandes. Le site e-commerce de Boulanger propose ce service à ses clients depuis un petit moment.

Sur la fiche produit, le bouton de retrait en magasin se trouve juste en dessous du bouton d’ajout au panier.

Un clic sur ce bouton me renvoie à la page de sélection de magasin (l’étape 1 du breadcrumb, situé tout en haut de la page). Le module est plutôt bien conçu : je choisis d’abord une région puis le magasin qui me convient.

Je m’attarde rapidement sur les boutons situés sous ce module.

Le libellé du bouton « annuler mes retraits et mon choix de magasin » est doublement mal choisi : je n’ai pas encore validé mon retrait que je peux déjà l’annuler, je n’ai pas encore validé mon choix de magasin que je peux déjà l’annuler.

Le deuxième bouton « valider mon choix et ajouter d’autres produits » me renvoie sur la fiche produit de l’article que je viens de sélectionner. Là encore, le libellé n’est pas adapté.

Pour tester la gestion des erreurs, je clique sur troisième le bouton « valider mon choix et finaliser mes retraits » sans avoir sélectionné de magasin : rien ne m’indique mon oubli, seule la mise en page du module change très légèrement sans que l’on comprenne vraiment pourquoi – en fait, ça ressemble plus à un bug.

Je choisis un magasin dans la liste et je clique sur ce dernier bouton pour passer à l’étape suivante.

Si j’en crois le breadcrumb, il s’agit de la page panier. Quelques éléments (le minuscule récapitulatif perdu en haut à droite, l’absence de bouton permettant de supprimer un article… et la balise <title> de la page, que je ne verrai que plus tard) me permettent dès à présent de constater que ce n’est pas le cas : cette page interstitielle est dédiée à l’ajout de produits complémentaires, à la présentation de services associés et d’opérations commerciales incongrues (20% de réduction sur les caves à vin alors que j’achète un autoradio ? Sans parler du look « bouton » du titre de l’opération, également inadapté.)

Par ailleurs, le module des produits complémentaires, mal placé sur la page (c’est la raison d’être de cette page, il devrait être davantage mis en valeur), ne fonctionne pas convenablement : l’onglet « transmetteur FM » est actif et présente… des services comme le retrait express en 1 heure. Quant à l’onglet « services B », il disparaît quand on clique dessus !

Cette page devrait être entièrement revue. Sa structure, son positionnement, son fonctionnement… Il n’y a pas grand chose à sauver en l’état.

Un clic sur le bouton « Voir mes retraits en magasin » me conduit à la véritable page panier, comme l’indique le breadcrumb (qui ne passe donc pas à la troisième étape alors que je suis bien sur la troisième page). Note : comme à l’étape précédente le véritable titre de la page se trouve dans la balise <title>, « ma liste de réservation ».

Là encore, la structure de la page mériterait une révision : on me recolle l’offre commerciale de la page précédente (qui n’a plus tout à fait le même look), on me recolle des services complémentaires… de façon plutôt désordonnée. Quant aux informations relatives au retrait de ma commande, elles se trouvent vraiment bas.

C’est seulement à cette étape que j’ai accès à la disponibilité du produit dans le magasin sélectionné, et c’est seulement maintenant que l’on me donne une date de retrait effective.
Note : j’ai effectué ce test un samedi vers 15h30, on me propose un retrait le mardi vers 10h30. Parler de retrait en 1h est un peu trompeur, même si j’imagine que certains produits sont effectivement disponibles dans l’heure.

C’est là que se situe le plus gros problème de la mécanique : il n’est pas possible de changer de magasin pour connaître la disponibilité de l’article dans un autre Boulanger, si par exemple attendre 3 jours pour retirer mon produit alors qu’on m’a vendu un retrait en 1h ne me satisfait pas.

A cette étape, je n’ai que 2 possibilités : « valider mes retraits en magasin » ou « annuler mes retraits et mon choix de magasin ». Pour changer de magasin, je dois donc vider ma liste de réservation, la refaire et sélectionner un autre magasin. Un client au panier bien garni sera enchanté de devoir tout refaire.

J’ai cherché un produit non disponible dans mon magasin (un appareil photo cette fois) pour savoir comment le cas de figure était traité. Sans surprise, le seul choix possible est de supprimer le produit du panier.

Note : bien que le produit ne soit pas disponible, le bouton « valider mes retraits en magasin » reste cliquable. Si je clique dessus, un layer m’indique heureusement que mon retrait n’est pas possible en l’état.

Bonus

J’ai effectué 2 retraits en magasin chez Boulanger ces dernières semaines. Le point de retrait du magasin concerné (ce n’est pas celui des captures d’écrans), mal indiqué, fait toc : un petit comptoir instable doté d’une sonnette, posé devant une double porte incendie ouverte donnant sur la zone de stockage du magasin. Après avoir sonné, un vendeur est intervenu ; il m’a apporté mes commandes plusieurs minutes plus tard, après avoir cherché et demandé conseil à d’autres personnes. Le plus ennuyeux ? J’ai été contraint de passer en caisse les 2 fois.
Rendre l’expérience de retrait en magasin plus agréable nécessitera encore un peu de travail.

Bilan

libellé approximatifs de certains boutons & de certaines pages
structures de plusieurs pages
quelques bugs
traitement de certaines erreurs
Impossible de changer de magasin sans refaire intégralement sa commande
Promesse du retrait en 1h ?