Quand de belles photos nuisent à l’expérience utilisateur

Je cherche un cadre pour mettre en valeur un poster que j’ai acheté. Je me rends sur le site de Leroy Merlin, dont j’ai apprécié il y a un moment la navigation à facettes permettant de trier les articles par dimensions. 

Voici la page liste des cadres :

Page liste des cadres sur leroymerlin.fr : haut de page

Je trouve l’énorme image d’illustration en haut de la page un peu déroutante ; c’est joli mais ce n’est pas ce que je viens chercher.

Je scrolle pour afficher la suite.

Le filtre me permettant d’afficher uniquement les articles dont les dimensions m’intéressent est toujours là, malheureusement il ne fonctionne pas correctement. Un bug particulièrement ennuyeux pour moi, qui visitait le site de Leroy Merlin justement pour ça. Mais ce n’est pas ce qui a motivé cette note. 

Si je scrolle un peu plus pour afficher les photos des cadres, je me retrouve devant ceci :

Page liste des cadres sur leroymerlin.fr : de belles images qui gênent la consultation des articles

Une page très élégante, tout à fait dans l’air du temps. On reconnait la présentation façon tuiles ; les amateurs de décoration d’intérieur remarqueront que les cadres sont présentés au milieu d’environnements relativement neutres afin de mettre en valeur le produit. C’est simple : même sur Pinterest la mise en page n’est pas aussi réussie !

Et… C’est un problème. L’ensemble est si joli qu’il en devient difficile de distinguer les articles eux-mêmes. Dit autrement : je ne suis pas en train de chercher des idées pour mon salon, je visite un site e-commerce à la recherche d’un cadre 30 x 40 cm noir à fine bordure. Ce sont deux situations complètement différentes. 

Voici la page liste des cadres du site d’IKEA

Page liste des cadres sur le site d'IKEA

Des photos détourées de cadres vides. Une page beaucoup plus sobre, presque triste, mais parfaitement fonctionnelle : je distingue d’un seul coup d’œil les modèles qui m’intéressent. Et je n’ai pas besoin de passer ma souris sur chaque image pour afficher le prix de base (ou d’appuyer sur le petit ‘+’ sur mobile, un picto inactif sur desktop d’ailleurs).

Et puis… à quoi bon construire une jolie page de ce genre pour la transformer quelques coups de molette plus tard en un ensemble chaotique de photos détourées mélangées à des mises en situation ?

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 :

Page d'accueil du site de recrutement de Decathlon (taille moyenne)

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.

Page d'accueil du site de recrutement de Decathlon (grande taille)

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.

Page d'accueil du site de recrutement de Decathlon (tailles multiples avec libellé)

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 :

Page d'accueil du site de recrutement de Decathlon (tailles multiples)

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 ?

Page d'accueil du site de recrutement de Decathlon avec menu mis à jour

(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 ?

Page d'accueil du site de recrutement de Decathlon avec contenu mis à jour

(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…

Bouygues Telecom, le test d’éligibilité fantôme

Un proche se rend sur le site de Bouygues afin de tester son éligibilité à la fibre.

Bouygues Telecom - test d'éligibilité

Après avoir saisi un numéro de téléphone, le message suivant apparaît :

Bouygues Telecom - résultat du test d'éligibilité

Les clients Bouygues Telecom doivent apparemment faire le test depuis leur espace client. (Pourquoi ne pas l’avoir précisé plus tôt, mystère.) Mon ami perd un long moment à retrouver ses codes d’accès (c’est aussi ça, l’UX de la vraie vie), ça l’énerve, mais il finit par réussir à se connecter. Voici la page sur laquelle il est redirigé :

Bouygues Telecom - espace client

Il a apparemment été renvoyé sur la page d’accueil de son espace client. Problème : où se trouve le lien vers le test d’éligibilité ? Pourquoi n’est-il pas redirigé automatiquement vers cette page ? Mystère.

Voici l’intégralité des menus du site :

Bouygues Telecom - ensemble des menus de navigation

Il a cherché longtemps, nous avons cherché longtemps, nous n’avons pas trouvé.

Je ne me décourage pas : je me connecte sur une autre machine, je lance un autre navigateur, je me rends sur le site de Bouygues, j’accède à son espace client, et cette fois le miracle se produit :

Bouygues Telecom - menu principal en haute résolution

C’était pourtant simple : le test d’éligibilité n’est pas accessible sur les appareils qui ont une résolution inférieure à 1168px de large. Évident, non ?

Autrement dit : sur un écran basse résolution (un iPad par exemple) le burger menu qui s’affiche ne présente pas de lien « test d’éligibilité », alors que sur un écran haute résolution (une machine de type desktop) le lien est bien présent au sein du menu de la page.

Nous nous rendons ensuite sur la page du test pour en finir.

Bouygues Telecom - boucle infinie

Nous voilà revenus 15 minutes en arrière. Que dire ? Nous sommes coincés dans une boucle. En d’autres termes et pour faire court, il est tout simplement impossible de savoir si le logement de mon ami est éligible à la fibre. Bravo et merci, Bouygues Telecom !

Épilogue

Le lendemain, mon ami reçoit cet e-mail :

Bouygues Telecom - e-mail de prospection

On peut y lire le message suivant : Félicitation, vous êtes éligible à la Fibre !
Problème : pour en savoir plus, le bouton nous invite à retourner… dans notre espace client. Retour dans la boucle !

(Mon ami n’a pas remarqué qu’il s’agit d’un e-mail commercial envoyé par un partenaire marketing, autrement dit que son contenu n’a aucune valeur.)

Fatigué, il finira comme tous les gens qui peinent devant des sites internet mal conçus par contacter le service client par téléphone. Et par obtenir sa réponse. Mais aura-t-il encore envie de souscrire à un abonnement chez Bouygues Telecom après tout ce cirque ?