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à.

Page d'accueil du site Lesbonsclics

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.

Page de connexion du site Lesbonsclics

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 :

Page d'accueil du site Lesbonsclics

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.

Gmail ne badine pas avec la sécurité

Je dispose comme beaucoup d’internautes de plusieurs « identités » sur internet, chacune associée à un compte de messagerie différent. Il y a quelques jours, j’ai voulu utiliser une vieille adresse Gmail dont je ne m’étais pas servi depuis longtemps. Problème : impossible de retrouver le mot de passe. J’ai donc fait appel au système de récupération de mot de passe de Google.

Je sélectionne le problème que je rencontre, « je ne connais pas mon mot de passe », j’indique l’adresse e-mail concernée et j’appuie sur le bouton Continuer.

Le système me demande de fournir le dernier mot de passe dont je me souvienne. J’ai totalement oublié le mot de passe que j’avais utilisé à l’occasion de la création du compte, je clique donc sur le bouton Je ne sais pas.

Les choses sérieuses commencent, comme semble l’indiquer la barre de progression qui s’affiche à l’écran (une barre de progression pour la récupération d’un mot de passe ?) Le système me réclame une adresse e-mail à laquelle je peux être joint. Je m’exécute et je valide avec le bouton Continuer.

On rentre dans le vif du sujet. Le système me réclame cette fois – et les réponses sont obligatoires :
• la date de ma dernière connexion (sous la forme peu française mois / jour / année) : pas toujours facile de s’en souvenir (impossible dans mon cas) ;
• la date de création du compte ! Sérieusement, il y a beaucoup de gens qui se souviennent de la date de création de leur compte e-mail ?

J’entre des dates très approximatives et je valide.

Cette fois, le système me réclame plusieurs adresses de contacts à qui j’ai fréquemment envoyé des e-mails. Pas trop compliqué pour une personne qui utilise régulièrement son compte. Plus étrange, le système réclame également les noms de quatre libellés au maximum : je vois bien de quoi il s’agit, mais je ne suis vraiment pas certain que ce soit le cas de tous les utilisateurs de Gmail… Pour finir, on me demande la première adresse (il y en a eu plusieurs ?) de récupération de mot de passe dont je me souvienne. Euh…

Google a tout de même prévu un bouton permettant de passer ces questions. Sage décision. Je passe à la suite.

Dans cette dernière étape, le système me demande les noms des autres produits de Google que j’utilise, ainsi que leur date (approximative) de première utilisation.

Quelques remarques au passage :
• Les menus déroulants trop court pour afficher tout le texte, ça ne fait pas très sérieux, ça ne ressemble pas à du Google (ou alors à du Google translate.)
• La gestion des erreurs est à revoir : si par mégarde j’entre un nom de produit mais que je fournis pas de date de première utilisation, le message suivant s’affiche :

Problème, il n’est pas possible de désélectionner le produit Google. La seule façon de procéder, c’est de revenir à la page précédente avec le bouton du navigateur. Pas évident.

Je clique sur le bouton Envoyer, et…

Victoire ! Je vais enfin pouvoir accéder à ma boîte mail !

(Au passage, j’apprécie beaucoup la dernière phrase de cette page. « Si vous n’avez pas reçu d’e-mail de réinitialisation de mot de passe et que votre dossier de spam est vide, essayez d’accéder à votre compte d’une autre manière. » Qu’est-ce que ça peut bien vouloir dire ?)

Je comprends très bien l’importance de la sécurisation de ce genre de données, et je pense qu’une récupération complexe est vraiment une bonne chose. Pour autant, certaines données réclamées ici (date de création du compte, libellés – heureusement facultatifs, date de première utilisation des autres produits Google…) semblent particulièrement inaccessibles.

Baromètre INRIA, un « nouveau monde numérique » peu clair (1/2)

Une amie m’a transmis hier via Twitter un lien intitulé « Les français et le nouveau monde du numérique ». Je me suis rendu sur le site et j’ai noté quelques points qui pourraient être améliorés.

Baromètre Inria - splashpage

Plusieurs choses me perturbent dès la première page.

• On y trouve de nombreux éléments peu hiérarchisés. Le titre « Les Français et le Nouveau Monde numérique » (avec toutes ces majuscules, oui oui) est heureusement mis en avant ; le reste du contenu ressemble à un assemblage hétérogène de logos et de blocs.

Son intérêt m’échappe. Je comprends qu’il soit important de mettre en avant les partenaires de l’opération, mais est-ce une bonne façon de faire ? Quelles informations le visiteur peut-il tirer de cette page, que je qualifierais de simple splashpage ? N’aurait-il pas été intéressant d’utiliser cet espace pour présenter le site et expliquer clairement de quoi il retourne ?

Note : Cette explication existe mais n’est pas vraiment mise en valeur (elle se cache derrière le lien « À propos du baromètre » situé dans le footer.)

Le gros bouton permettant de passer à la page suivante manque réellement de contraste. Ce problème est d’autant plus important qu’il s’agit du seul élément offrant l’accès au véritable contenu du site : il serait dommage de passer à côté ! Même souci pour son contenu : une flèche blanche dans un bouton gris clair, le tout sur un fond gris clair, est-ce vraiment une bonne idée ?

Globalement, cette entrée en matière manque un peu d’intérêt et de clarté.
Je clique sur le gros bouton gris pour accéder à la page suivante.

Baromètre Inria - choix

Deux possibilités : à gauche découvrir les résultats de l’enquête, à droite faire le test.

Ici aussi les boutons permettant d’accéder au contenu manquent de contraste. Par ailleurs, ils portent tous les deux le même libellé peu informatif « Commencer ». N’aurait-il pas été plus intéressant de rendre les légendes « Découvrez… » et « Faites le test » cliquables ?

Je constate également que le logo Inria a été modifié : sa taille a été réduite afin de permettre l’ajout d’éléments « sociaux » (bouton Twitter). Je ne sais pas si c’est à cet endroit que les visiteurs s’attendent à trouver ce type de contenu ; ce que je sais c’est qu’ils risquent de passer à côté.

Au sujet du choix des mots : le second bouton est intitulé « Et vous, quel voyageur êtes-vous ? » Je comprends l’image « nouveau monde numérique / voyageur », mais ce genre de figure de style n’a pas vraiment sa place ici. Remplacer « voyageur » par « internaute » me semble plus approprié.

Un dernier point pour finir : il n’est pas possible de revenir à la page précédente. Le bouton « page précédente » de mon navigateur me renvoie au site précédemment consulté.

Je préfère commencer par faire le test, je clique sur le second bouton.

Baromètre Inria - test

La structure de cette nouvelle page me surprend : la question se trouve à droite, les réponses à gauche. Les occidentaux lisent de gauche à droite, il me semble donc plus logique de commencer par la question plutôt que par les choix proposés comme c’est le cas ici. La question est fortement mise en valeur dans un bloc rouge, peut-être pour pallier cette présentation inversée.

Le formulaire utilise des éléments d’interface relookés (les cases à cocher, en rouge). C’est plus élégant… mais moins clair. Lorsque je clique sur l’une de ces cases, un carré rouge apparaît à l’intérieur pour me signaler que la case est cochée. Rouge sur fond rouge, encore un choix qui dégrade la lisibilité.

Toujours au sujet des choix : les libellés ne sont pas cliquables. Encore une fois ce n’est pas très grave, mais ça aurait amélioré l’expérience.

Un bouton gris en haut de la page me permet d’accéder aux résultats de l’enquête. Bon point : si je veux jeter un œil aux résultats et revenir au test ensuite, je n’aurai pas à répondre à nouveau aux questions auxquelles j’ai déjà répondu. Mauvais point : si je clique sur le logo Inria (cliquable ici alors qu’il ne l’était pas avant), je retourne à la splashpage et mes choix ne sont pas mémorisés. En d’autres termes : je devrai répondre à nouveau à toutes les questions auxquelles j’ai déjà répondu.

Note : le message d’erreur « Réponse obligatoire » pourrait être davantage mis en avant (il y a de la place). Mieux : la mention « Toutes les réponses sont obligatoires » (puisque c’est le cas) pourrait figurer sur le questionnaire.

Après avoir répondu aux 18 questions, je suis redirigé sur une page de résultat.

Baromètre Inria - résultat

Là encore, beaucoup de contenu peu hiérarchisé. Le titre « Vous êtes plutôt parmi » est bien visible, à l’inverse du nom de la catégorie « Les grands explorateurs », quasiment invisible. Il s’agit pourtant d’un élément très important, j’ai répondu à 18 questions pour en arriver là ! La page, très chargée en couleurs / blocs / textes / pictos / illustrations, manque vraiment de lisibilité.

Bonne idée : je peux connaître les autres profils d’internautes. Je note toutefois que si je clique sur un picto (dont il faut deviner la signification puisqu’il ne sont pas légendés), le texte et l’illustration changent… mais pas le titre « Vous êtes plutôt parmi ». Pas très cohérent.

Baromètre Inria - autre profil

Mauvaise idée : si je quitte cette page, il me sera impossible de revenir dessus autrement qu’en refaisant tout le test !

Je terminerai ma visite du site dans les prochains jours, avec deux points qui m’ont particulièrement ennuyé.

Bonus

En cliquant sur le menu du haut, j’ai fini par arriver sur cet écran.

Baromètre Inria - bug

Pour reproduire ce bug (Firefox & Safari), il faut se placer sur la page « Faire le test », cliquer 2 fois sur l’intitulé « Faire le test » puis une fois sur « Les résultats de l’enquête ». Rien de grave bien sûr, mais c’est la conséquence d’autres choix plus gênants.

Bilan

libellés peu clairs
structure de certaines pages
éléments de formulaires revus
bug
manque de hiérarchie
manque de lisibilité
pictos non légendés
splashpage
boutons gris très peu visibles
modification d’éléments d’interface au fil du site
bouton page précédente non fonctionnel
choix non mémorisés si retour à la splashpage
impossible de revenir sur la page du résultat du test