Search
La recherche offre aux utilisateurs un moyen d'explorer un site web ou une application à l'aide de mots-clés.
Description
La recherche offre aux utilisateurs un moyen d'explorer le site ou une partie du site à l'aide de mots-clés. La recherche peut être utilisée comme moyen principal de découverte du contenu, ou comme filtre pour aider l'utilisateur à trouver du contenu.
Elle est la plupart du temps accompagnée d'une fonctionnalité d'auto-complete qui offre à l'utilisateur des suggestions de mots-clés et de phrases en temps réel, en fonction de ce que l'utilisateur saisi dans le champ de recherche.
Web
iOs/Android
Plateformes
Anatomie
- Filtre (optionnel) : permet d'effectuer une recherche avec un filtre
- Champ de saisie / Placeholder : permet à l'utilisateur de saisir du texte à l'aide d'un clavier. Lorsqu'il est vide, il est remplacé par le placeholder.
- Bouton de recherche : permet à l'utilisateur de lancer la recherche. Il peut également appuyer sur la touche "Enter" de son clavier.
- Input text : texte saisi par l'utilisateur
- Supprimer : apparaît uniquement lorsque du texte est saisi. Cliquable, il permet de supprimer le texte.
- Auto-complete : dropdown qui offre à l'utilisateur des suggestions de mots-clés et de phrases en temps réel.
Usage
Quand l'utiliser ?
Lorsque vous souhaiter aider les utilisateurs à trouver rapidement l'information qu'ils sont venu chercher dans une grande source d'informations.
Sur le site post.lu, nous retrouverons la recherche globale, qui permet aux utilisateurs de faire une recherche dans l'entièreté des contenus du site. Il existe également des recherches contextuelles qui sont associés à des applications spécifiques (Track&Trace, FAQs) et qui permettent de filtrer le contenu au sein des apps.
Anatomie
- Champ de saisie: permet à l'utilisateur de saisir du texte à l'aide d'un clavier. Lorsqu'il est vide, il est remplacé par le placeholder.
- Supprimer : apparaît uniquement lorsque du texte est saisi. Cliquable, il permet de supprimer le texte.
- Scan : permet de scanner un code barre ou autre pour remplir le champ de recherche.
- Bouton de recherche : permet à l'utilisateur de lancer la recherche. Il peut également appuyer sur la touche "Enter" de son clavier.
- Erreur : indique clairement à l'utilisateur l'erreur qui a été faite dans le champ et comment la corriger
- Helper (optionnel) : indique les règles de saisie du champ
Usage
Quand l'utiliser ?
Lorsque vous souhaiter aider les utilisateurs à trouver rapidement l'information qu'ils sont venu chercher dans une grande source d'informations.
Sur le site post.lu, nous retrouverons la recherche globale, qui permet aux utilisateurs de faire une recherche dans l'entièreté des contenus du site. Il existe également des recherches contextuelles qui sont associés à des applications spécifiques (Track&Trace, FAQs) et qui permettent de filtrer le contenu au sein des apps.
Des questions ou un feedback ?
N’hésitez pas à contacter la team Design System par mail.