Récemment j’ai du faire une barre latérale de recherche. J’ai bien pris soin de ne pas suivre les exemples du post ‘Les critères de recherche, ça se combine !’.
La barre de recherche comprend 2 zones:
- un quick search
- une recherche avancée
Bloc de critères de recherche, avec peu d’éléments
Cette proposition prend en compte 3 niveaux de hiérarchie, et permet de garder une barre claire grâce au expand collapse.
Une liste de sélection (de 3e niveau) pourra rester telle quelle si la liste contient max; (environ) 10 items. Si cela devient plus long, j’aurai tendance à proposer une ‘boîte de sélection‘ avec une scroll-bar et un récapitulatif des éléments sélectionnés. Voir l’exemple ci-dessous.
La barre de recherche sera toujours disponible lors de la recherche. 2 avantages:
- Garder de vue les critères de recherche
- pouvoir facilement modifier sa recherche dans le cas ou il y a trop (ou trop peu) de résultats.
Voici le bloc de recherche multi sélection, avec plusieurs niveaux de hiérarchie et une liste d’éléments assez importante.
Dans le cas ci dessous, la quantité de critères de recherche à afficher était assez importante. Donc difficile pour l’utilisateur d’avoir une vue d’ensemble des critères sélectionnés.
L’option expand collapse est limitée ici à la liste des valeurs (tous les critères restant visibles en permanence). Les éléments sélectionnés sont déplacés dans la partie supérieure du bloc. Une fois en mode collapsed, les valeurs sélectionnées sont toujours visibles.
Vu le nombre de catégories de premier niveau (et donc de blocs différents), ce système est bien adapté: il permet de conserver une vue d’ensemble en limitant l’affichage uniquement aux éléments sélectionnés.
