Naviguer dans une base de données

Oui je parle bien de systèmes de navigation. Les concepteurs disposent de 4 grandes typologies de systèmes.

1. Les systèmes de recherche
2. La catégorisation
3. Le tri ou le filtrage.
4. Les systèmes hybrides ou imbriqués

Avec l’avènement depuis 7 ou 8 ans d’Ajax et de JavaScript la conception de formulaires complexes, synchrones ou asynchrones, a été grandement facilitée. Il n’est pas rare que les systèmes de navigation dans les bases de données proposent plusieurs procédures d’actions séquentielles, d’autres transverses, et parfois des systèmes hybrides.

Les Systèmes de recherche simples et avancées

La procédure de recherche est séquentielle : L’utilisateur sait (souvent partiellement) ce qu’il cherche, il remplit un champ libre (text input), éventuellement émet des choix par catégorisation pour préciser dans quel segment de la base la recherche doit s’effectuer. La validation de sa recherche affiche un gabarit ou une zone de résultat. La précision du résultat dépend de la précision de la requête, et de la taille de la base bien sûr.

Dans ce genre de système il est difficile pour l’utilisateur d’estimer le nombre d’occurrences qui s’afficheront dans la zone de résultats. Contrairement aux autres systèmes de navigation, ici l’utilisateur engage son action sans pouvoir visualiser les données de la base.

Sur le plan cognitif, la recherche est souvent perçue comme une navigation aveugle dont la réussite dépend de l’efficacité du système. Ici l’utilisateur se repose sur la performance du système pour l’éclairer dans sa recherche. Il y a là un rapport de confiance qu’il ne faut pas trahir.

Les systèmes de catégorisation

Très utilisé en E-commerce, la recherche d’un objet passe par la navigation dans des univers, des catégories et des sous catégories. Ici les choix sémiotiques sont primordiaux. L’utilisateur doit connaître l’univers des données présentées pour savoir comment naviguer. Ca peut être un inconvénient sémantique, mais ce genre de système permet aussi de développer des univers visuels distincts les uns des autres.

L’approche est très différente sur le plan cognitif : On remplace l’efficacité du système navigationnel de recherche ou de tri par une immersion dans un univers. Ce sont les émotions qui gèrent la navigation. Plus l’univers est immersif, plus l’utilisateur acceptera de passer du temps à le parcourir. Comme toutes les approches émotionnelles, le confort et le plaisir de la recherche sont ici privilégiés sur l’optimisation du délai impartit à la recherche.

Les systèmes de tri ou de filtrage

On revient dans le rationnel. Ces systèmes permettent d’affiner une recherche ou la navigation dans une base grâce généralement à des éléments de formulaires. Ainsi, on peut choisir d’associer une recherche à des critères de prix, couleurs, tailles, temps, marques, notation…etc. Parfois cette phase de tri/affinage peut aussi se faire sur les résultats de la recherche.

Recommandations de conception

Finalement, je crois que ce qui fait la qualité d’un système de recherche ou de navigation dans une base, c’est

1. La simplicité du système : Il doit traiter un maximum de besoins utilisateurs en un minimum d’actions.
2. La pertinence du système de navigation au regard de la nature des données.
3. L’adaptabilité du système à ses utilisateurs : Il doit proposer différents moyens navigationnels pour arriver à ses fins. Ce point me semble important dans la mesure où le système doit se mettre à la disposition du mode de fonctionnement de chacun, et pas l’inverse.
4. La correspondance des cognitions induites par le système de navigation avec la stratégie de communication du site et le profil-type de l’utilisateur : Dans une stratégie de communication qui privilégie l’émotionnel, les cognitions engendrées par l’utilisation du système de navigation doivent respecter ce positionnement et on privilégiera un système de navigation immersif ou ludique par exemple. Inversement, dans un cadre rationnel, le système privilégiera la logique, la rapidité de la recherche, ainsi que la pertinence et l’affinage des résultats.

Notez aussi que la réussite d’une recherche est aussi assurée par la précision de la requête utilisateur d’une part, mais aussi par son niveau de connaissance de l’univers de la recherche.

Ici plus qu’ailleurs c’est le profil de l’utilisateur qui va guider la conception. Lorsqu’on travaille sur un système de recherche/navigation dans une base de données, le meilleur moyen d’être efficace, c’est de pratiquer la conception centrée utilisateur.

Études de cas

Amazon.fr

Recherche avancée sur Amazon

Il y a une dizaine d’année, je râlais contre les ténors du e-commerce dont je trouvais les sites graphiquement pauvres, Amazon et Ebay en tête. Il m’a fallut du temps et de la pratique pour me rendre compte qu’au delà de l’esthétique visuelle, ces interfaces étaient des exemples d’efficacité à suivre. Ces sites ont des stocks énormes et c’est un vrai enseignement que d’observer les outils mis en place pour y naviguer. J’irai même jusqu’à dire que les systèmes de navigation imaginés pour parcourir ce genre de bases de données sont pour leurs éditeurs un enjeu stratégique et de réussite crucial.

Amazon par exemple complémente sa navigation principale par un formulaire de recherche simple (1), et secondairement d’un moteur de recherche avancée (présenté ici). L’utilisateur dispose de trois systèmes de navigation pour trouver son bonheur. Ce triptyque est un schéma très traditionnel.

Sur ce gabarit, la recherche avancée se déroule en deux temps : Il faut d’abord choisir un univers dans la colonne de gauche (2 : sélection catégorielle), puis choisir d’affiner sa recherche en sélectionnant des critères transverses (3) avant de lancer la recherche.

Amazon privilégie d’abord la navigation dans son stock par le rubriquage, ce qu’ils appellent « les boutiques ». Comme ils présentent un stock énorme et des catégories de produits très variées, il leur est difficile de présenter l’intégralité de leurs produits sans les segmenter par un système de catégorisation ou d’univers (souvenez-vous, mon point 2) ci dessus : « ce qui fait la qualité d’un système de recherche ou de navigation dans une base, c’est 2) la pertinence du système de navigation au regard de la nature des données. »). L’objectif est d’inviter l’utilisateur à parcourir le stock avant de faire, peut être une recherche simple, puis une recherche avancée.

Blue Nile

Recherche par filtrage dans la base blue Nile

J’adore cette interface, c’est un vrai bijou (ok, je sors). Blue Nile est un courtier en diamants, l’interface présentée ici permet de choisir son bonheur dans le stock du diamantaire.

En dehors des rubriques informatives du site, toute son architecture tourne autour de cette page de recherche. C’est le cœur du site. Ici, la recherche de diamants se fait par filtrage et tout se passe sur cette seule et même page. Ici la liste complète des diamants est visible. Pour affiner sa recherche l’utilisateur commence par filtrer le stock en fonction de critères aussi variés que précis. Notez au passage l’utilisation de sliders que je trouve très efficaces dans ce contexte (zone 1).

Ici tout est lisible, logique, fonctionnel, affordant. Il y a beaucoup d’éléments de filtrage, mais leur agencement logiquement conçu dans le sens de lecture les rend utilisables sans efforts de compréhension. J’aime beaucoup le zoning du gabarit qui divise la page en deux : Le cœur de page ou l’utilisateur agit pour affiner ses choix, et la partie droite (ici la zone 6) qui affiche le détail de sa recherche. On retrouve ici les conventions ergonomiques des configurateurs que j’affectionne tant.

Notez la zone de critères de filtrage avancée (2), non visible en ouverture de la page. On y trouve les critères de filtrages secondaires, c’est à dire ceux qui ne sont généralement pas prioritaires dans les choix des utilisateurs. Il est donc logique de les faire passer au second plan. Notez aussi la possibilité de trier le stock par priorité (3), c’est une fonctionnalité classique mais extrêmement pratique. Dans ce contexte là, elle se justifie totalement.  Je relève aussi le systeme de comparaison (4) présent dans beaucoup de boutiques en ligne. Cette boutique ne segmente pas son stock en univers, s’en est presque déroutant pour du commerce en ligne. Ici le processus d’achat se fait via le filtrage de la liste, on ne se perd pas dans la découverte d’univers ou de catégorie de produits. De toutes façons il y a un seul type de produit, un stock énorme, et la recherche est un système bien moins adapté que le filtrage pour trouver son bonheur dans ce type de stock. Ici, vu l’ampleur du stock et la similarité des produits, l’acheteur doit s’attacher à des critères rationnels de filtrage ou de tri. Vous aurez d’ailleurs remarqué que le système de recherche simple (5) est ici relégué en bas de page. Son (in)utilité toute relative a été clairement conscientisée.

Au premier abords on pourrait se dire que le choix de hyper-rationalité est surprenant pour une boutique en ligne, d’autant plus que dans le secteur du diamant, on aurait pu imaginer un design proche des codes du luxe (prédominance de larges visuels, et mise en valeur de la marque et ses valeurs plutôt que du produit). Non, ici, c’est la nature du stock qui à dicté les choix de conception, et au final le site est totalement construit autour des besoins de ses utilisateurs.

Retournons à nos moutons

Voilà, vous vous en doutez surement je ne me penche pas sur ce sujet par hasard. Je travaille cette semaine sur une interface qui présente plusieurs bases de données (ce ne sont pas des catalogues produits ni une boutique en ligne), et je vais pouvoir retourner à ma mission en cours avec un peu plus de certitudes sur mes choix navigationnels. Si vous avez des remarques à formuler sur le sujet n’hésitez pas.

Related posts:

1. La « vision » dans le processus de conception

Imaginons que chaque ville (ou pays) soit responsable de son système de signalisation routière. Que chaque panneau soit défini selon les décisions et la logique inhérente aux différents services d’urbanisme. Prendre sa voiture et visiter une nouvelle ville serait alors une excursion plutôt risquée, et peu de personnes à se déplacerait de manière spontanée.

Afin d’éviter des situations de ce type, les panneaux de signalisation ont été codifiés et sont (dans la très grande majorité) identiques dans tous les pays. C’est ainsi que les interdictions sont en rouge et d’aspects ronds, que le triangle inversé du céder le passage est unique dans sa forme afin qu’il soit reconnaissable de dos, et ainsi de suite.

Sur le web, la situation n’est pas très différente, sauf que c’est le bon sens et la logique qui ont fini par codifier les différents éléments composant les pages web ainsi que les fonctions proposées dans les boutiques en ligne.

Au début du Web commercial, il y a eu beaucoup d’expérimentations en partant du principe qu’il fallait se démarquer et offrir une expérience unique aux visiteurs. Depuis, on s’est finalement rendu compte que les sites les plus efficaces sont souvent ceux qui sont privilégient la simplicité de navigation et qui soigne les détails ergonomiques.

Gardez bien à l’esprit que pour vos visiteurs, la vraie plus-value de votre site, c’est son contenu. Il faut donc privilégier l’accès à ce contenu, et la recherche d’un contenu précis. La construction d’un système de navigation simple, conventionnel, en un mot, « ergonomique », y contribuera. Une bonne ergonomie repose sur deux facteurs essentiels : Le respect des conventions, et la cohérence ergonomique des différents gabarits d’un site.

On peut dresser une liste non exhaustive de ces conventions :

• Le respect des conventions en matière de zoning
• Sans la rendre visuellement prépondérante dans l’interface, il faut que la première zone lue par les navigateurs relate les indications liées à l’accessibilité du site. Les mal ou non-voyants pourront alors consulter le site dès leur arrivée.
• Présenter une zone d’identification du site en début de lecture.
• Garder la navigation complète et visible sur toutes les pages
• Le choix de la langue en haut à droite
• Une fonction de recherche positionnée vers le haut de la page

Le respect des conventions ergonomiques

• Utiliser les termes habituels dans les boutons d’action
• Placer un pied de page qui reprend les utilitaires (impression, plan du site, etc.)
• Présenter différemment les boutons des liens internes ou externes
• Indiquer une différence entre les images qui sont cliquables ou pas
• Utiliser les mêmes icônes dans toutes les pages
• Placer les liens contextuels aux mêmes endroits sur tous les pages
• Etc.

Casser les conventions va interrompre le processus qui vient de s’initier. Comme la majorité des consommateurs ne persistent pas très longtemps avant d’abandonner, la question à se poser lors de l’évaluation d’un projet Internet consiste à définir la valeur qu’on accorde à l’innovation face au respect des conventions. L’image que l’on souhaite transmettre rentre naturellement aussi dans ces considérations, mais mettre les visiteurs à l’aise dès le premier click aide tout autant à promouvoir la marque qu’un graphisme bien réalisé.

Des fonctionnalités qui simplifient un processus de commande en ligne sont toujours les bienvenues, mais remplacer l’image du caddie par le symbole d’un sachet en plastique n’a certainement aucun intérêt…

Un frein à la créativité ?

Cela ne veut pas dire que tous les sites doivent tous proposer la même interface. Si on part du principe qu’un panneau de stop est toujours rouge, la créativité permet de définir un style et un traitement qui lui est propre, tant que le symbole reste identifiable du premier coup d’oeil. La vraie créativité consiste à réaliser une unité graphique cohérente et agréable autour des éléments auxquels les visiteurs sont habitués.

Conclusion

Un consommateur qui ne peut pas se repérer correctement risque de ne pas seulement quitter le site avec une connotation négative des pages web, mais aussi de l’entreprise qui est derrière. L’expérience utilisateur est donc un facteur essentiel dans le succès d’une présence web. Donc, avant de vouloir remettre en question les standards habituels, il est important de bien connaître leur utilité et savoir comment les consommateurs les utilisent. Il est plus facile d’innover sur le Web en sachant pourquoi on se permet de modifier certains acquis.

No related posts.