Archives des libellé

2 août 202130 juillet 2021

Lesbonsclics, ou comment un simple libellé de bouton peut bloquer complètement plusieurs personnes

Il y a quelques jours j’ai eu l’occasion d’aider une personne qui cherchait à utiliser la plateforme lesbonsclics. Il s’agit d’un site permettant de former les gens aux bases du numérique, que j’ai découvert ce jour-là.

Lorsque je suis arrivé à son poste, la personne m’a expliqué qu’elle n’arrivait pas à se connecter. Ensemble, nous avons successivement :

essayé son adresse e-mail et son mot de passe, puis essayé d’autres mots de passe ;
tenté une récupération de mot de passe : Un email vient de vous être envoyé, il vous permettra de réinitialiser votre mot de passe (c’est faux, et c’est assez grave comme erreur de la part de l’équipe de conception) ;
essayé une autre adresse mail et un autre mot de passe, puis essayé d’autres mots de passe ;
tenté une nouvelle récupération de mot de passe (même message, même mensonge).

La personne étant peu à l’aise avec l’informatique, ces démarches ont pris beaucoup de temps, peut-être quinze à vingt minutes.

Ne sachant plus quoi faire, j’ai pris le contrôle de la machine et exploré le site. Je suis parti de la page d’accueil, j’ai cliqué sur le bouton Connexion, je suis bien arrivé sur la page qui la bloquait. Et puis j’ai compris.

On le sait, nous ne lisons pas le contenu des pages internet, la plupart du temps nous le scannons. Après une lecture plus approfondie de la page, j’ai constaté que la réponse était en fait sous notre nez depuis le début : la personne cherchait à se connecter à l’espace des formateurs, pas à l’espace des apprenants.

Mais… Pourquoi nous sommes-nous tous les deux retrouvés sur cette page ? C’est là que je me suis un peu énervé contre le site. Voici une nouvelle copie d’écran de la page d’accueil :

Comme je le disais, nous avons cliqué sur le bouton CONNEXION. Malheureusement, il ne s’agissait pas du bon bouton : les apprenants doivent cliquer sur le bouton JE VEUX APPRENDRE. Mais qui a eu une idée pareille ?

Le libellé du bouton CONNEXION est imprécis : qui se connecte ? Les apprenants ou les formateurs ? Et comment peut-on le deviner ?
Même remarque au sujet du libellé du bouton JE VEUX APPRENDRE : comment comprendre que c’est la page de connexion apprenants qui se trouve derrière, et pas une page de présentation du site par exemple ?

Le pire, c’est que l’équipe de conception du site semble consciente de ce problème. Qu’est-ce qui me fait dire ça ? La phrase Si vous souhaitez vous former aux bases du numérique, visitez l’espace apprenant ! en violet, juste en dessous du titre de la page de connexion des formateurs (sans lien direct vers l’espace apprenant, d’ailleurs). Et le bouton Accéder à l’espace apprenant à gauche de la page, en dessous de plusieurs pictos destinés aux formateurs. (Il est absent de la version mobile, d’ailleurs.)

Comment peut-on laisser passer une erreur pareille sur un site destiné à apprendre le numérique aux gens ? J’ai vu deux personnes bloquées sur ce problème en quelques minutes, je ne peux pas croire que l’équipe de conception ne l’ait pas remarqué… sauf si elle n’a jamais rencontré son public. Ce qui serait vraiment ennuyeux, en particulier pour un site de ce type.

29 novembre 201828 novembre 2018

Les offres d’emploi cachées de Decathlon

Pour la deuxième fois en quelques mois je me rends sur le site de recrutement de Decathlon, et pour la deuxième fois en quelques mois je ne trouve pas les offres d’emploi. Voici la page d’accueil du site :

Je fais court : les offres sont cachées derrière le petit picto en forme d’avion en papier, en haut à droite de l’écran. En d’autres termes, l’un des éléments essentiels du site de recrutement de Decathlon est caché derrière un tout petit picto incompréhensible et non légendé.

Je m’en amuse sur Twitter. Le community manager (je suppose) de Decathlon recrutement me répond rapidement (c’est rare, c’est sympa) : “normalement c’est écrit”. Alors en effet, sur le grand écran de cette personne, une légende accompagne le picto incompréhensible.

Problème : sur tous les terminaux qui ne disposent pas d’un grand écran, les mobiles les tablettes et les écrans de portables par exemple, il n’y a pas de légende.

Je l’indique à mon interlocuteur.

À ce moment-là je peux tout entendre ; je crois être ouvert à n’importe quelle réponse. “Je vais en parler aux concepteurs” (l’URSAAF l’a fait, alors pourquoi pas ?), “On l’a déjà remonté mais c’est plus compliqué que ça en a l’air” (je comprends), “On a plus le budget” (je doute que mon interlocuteur soit au fait de ce genre de choses, mais après tout ?) Voire même une absence de réponse, après tout le community manager a probablement mieux à faire que de répondre à un designer ronchon qui s’intéresse aux offres de son entreprise.

Je ne m’attendais sincèrement pas à sa réponse : “Merci pour ton feedback Charles :). Sur tablette et mobile, c’est un choix d’optimisation car il n’y a pas assez de place.”

Pas assez de place ? Pas d’accord, il y a toute la place qu’il faut :

Je vais aller plus loin parce que cette page d’accueil me chiffonne. Comme je le disais plus haut il s’agit d’un site dédié au recrutement. Pourquoi les offres d’emploi sont-elles si difficiles à trouver ? Et si on oubliait le picto incompréhensible associé à Instagram et Twitter et qu’on partait sur un bon vieux menu, un truc simple qui marche plutôt bien ?

(J’ai bricolé ça en deux minutes mais je pense qu’on saisit l’idée.)

J’ignore tout de ce site. Je ne sais pas comment il a été briefé, je ne sais pas comment il a été conçu, je ne connais pas son budget etc. Mais il y a une chose que je peux affirmer avec une bonne dose de certitude : de nombreuses personnes vont se rendre sur ce site pour chercher les offres d’emploi. Et si on allait encore plus loin dans cette voie ?

(Ici aussi c’est un rough bricolé vite fait.)

Plutôt que de mettre l’accent sur les métiers de l’enseigne (qui sont de toute façon accessible dans le menu Nos métiers), j’ai mis l’accent sur le cœur du recrutement : les offres d’emploi. Comme on peut le trouver chez Leroy Merlin, Danone ou Engie – exemples choisis complètement au hasard de mes quelques minutes de pige.

Ce bricolage n’a pas d’autre but que d’ouvrir la discussion. Les concepteurs du site souhaitent manifestement mettre l’accent sur les métiers du groupe, mais est-ce également le point de vue du visiteur ?

Après bien sûr, on peut toujours trouver un moyen de rendre les offres d’emploi encore plus difficiles à trouver, comme chez McDonald’s par exemple…

18 février 201315 février 2018

Pimkie, une page d’accueil… surprenante

Je découvre sur le site de Mathieu Fauveaux la nouvelle fiche produit du site Pimkie. Curieux, je vais jeter un œil au reste du site.

Voici une copie d’écran de la page d’accueil.

Autant le dire tout de suite, ma visite s’arrêtera là.

L’inconvénient d’une copie d’écran, c’est que l’on ne voit pas les animations. J’ajoute donc cette mention : le menu « LA COLLECTION », ouvert sur le screenshot ci-dessus, se ferme au bout de quelques secondes.

Je la refais, pour être le plus clair possible : le menu de navigation s’ouvre lorsque j’arrive sur le site et se ferme quelques instants plus tard.

Quel peut être le but de cette animation ? Malheureusement, je n’en vois qu’un seul : les clients ne trouvent pas immédiatement ce qu’ils sont venus chercher sur le site. À ce moment-là, pourquoi, pourquoi ne pas avoir modifié la barre de navigation en y insérant les catégories de produits ?!

L’équipe qui a conçu le site veut manifestement pousser des contenus : blog, jeu concours, looks du moment. Très bien, mais pas à cet endroit ! Les clients s’attendent à trouver les catégories de produits dans la barre de navigation principale, pourquoi y mettre autre chose ?! Point important : ce n’est pas parce que ces contenus figurent à un endroit « chaud » (la barre de navigation principale) qu’ils seront vus par le client.

De mémoire, la barre de navigation principale du site de Pimkie a toujours fonctionné de cette manière. Cette animation à l’ouverture du site me laisse penser que le problème posé par ce choix est connu, alors pourquoi ne pas le résoudre sérieusement plutôt que de chercher des solutions alternatives incongrues, lourdes et peu efficaces ? Cette animation est d’autant plus inutile qu’elle ne concerne que les visiteurs qui passent par la page d’accueil, autant dire certainement pas la majorité.

Bon, voilà pour le point qui m’a le plus marqué sur cette page d’accueil. Cela dit, ce n’est pas la seule chose qui me chagrine, loin de là. Le point suivant est un grand classique du moment : le carrousel.

Je fais court : les slides défilent automatiquement, beaucoup trop vite et en permanence (c’est tellement pénible que j’ai préféré fermer la fenêtre pour rédiger mon article) et le contrôle utilisateur est quasi-inexistant. Confrères concepteurs, je vous renvoie à ces deux articles sur le sujet : 5 big usability mistakes designers make on carousels et Ergonomie des carrousels : 10 principes à respecter. Oh, et à ce bref article de Jakob Nielsen : Auto-Forwarding Carousels and Accordions Annoy Users and Reduce Visibility.

Quant au reste de la page, je fais plus court :

• les textes sont beaucoup trop petits. La barre de navigation principale utilise une police en équivalent 10px, même les liens du footer sont plus grands ! Encore une lecture intéressante (là aussi, on en trouve des milliers sur internet) : 16 pixels for body copy. Anything less is a costly mistake.

• Toujours au sujet de la barre de navigation : les items du menu sont trop proches et peu lisibles. L’ajout de caractères fantaisistes, très tendance bien sûr, n’arrange rien.

• Color forecast : c’est quoi ? Vous connaissez beaucoup de gens qui vont trouver le temps de flâner sur votre site et s’amuser à cliquer sur un lien (joli contraste, au passage) sans savoir ce qui se trouve derrière ?

• Le poids donné aux différents éléments du header me laisse perplexe : l’encart Facebook prend plus de place que les liens « mon compte » et « mon panier » réunis !

• Le faux champ texte d’inscription à la newsletter, en dessous du carrousel, est particulièrement énervant : lorsque je clique dedans pour insérer mon adresse e-mail, une fenêtre s’ouvre et m’impose de remplir un long formulaire (oui, 8 questions pour une simple inscription à la newsletter c’est TRÈS LONG). Pas du tout décourageant.

(Il y a même un bouton « Annuler » ! Ça faisait longtemps.)

• L’intégration des encarts sociaux (Facebook, Google+, Youtube, Twitter, n’en jetez plus !) est dégueulasse.

• Plus anecdotique : certaines majuscules ont des accents (NOUVEAUTÉS), d’autre pas (VIDEO, CONNECTES).

• Plus anecdotique mais amusant : on peut faire une recherche sans remplir le champ de recherche.

Bien. Comme je le disais plus haut, ma visite s’arrêtera là.