Français
La barre de recherche se compose généralement d'un champ de saisie de texte et d'un bouton Envoyer. Celle de la boutique démo de Luigi's Box est également équipée de la saisie semi-automatique.
Introduction
La fonction de recherche est un élément de design essentiel sur les sites web riches en contenu. Lorsque les utilisateurs se retrouvent sur un site relativement complexe, ils s’appuient sur la fonction de recherche pour trouver ce dont ils ont besoin.
La fonction de recherche se compose de deux éléments fondamentaux : un champ de saisie qui vous permet d’entrer du texte et un bouton Envoyer. Les barres de recherche pourraient sembler être un outil relativement simple, mais le processus de conception nécessite beaucoup de recherche et d’attente.
Ce qui se dresse entre vous et votre réussite pourrait, après tout, être quelque chose d’aussi simple que la conception du champ de recherche pour votre site web.
Nous avons consulté notre équipe d’experts produit afin de vous donner quelques conseils utiles qui vous permettront d’améliorer le fonctionnement de la recherche sur votre site. Nous allons parler des bonnes pratiques en matière de conception de l’expérience (UX) et de l’interface utilisateur (UI), vous montrer quelques sites qui mettent très bien cela en pratique et vous présenter certains logiciels capables de vous aider à optimiser votre recherche interne.
Qu’est-ce qu’une barre de recherche
Une barre de recherche est un composant de l’interface qui permet aux utilisateurs de saisir des requêtes de recherche et de récupérer des résultats à partir d’une base de données, d’un site web ou d’une application. Elle se compose généralement d’un champ de saisie de texte et d’un bouton pour lancer la recherche.
Pourquoi la barre de recherche est-elle importante
Imaginez que vous consultez un site web qui vend des baskets, et vous avez jeté votre dévolu sur un modèle en particulier. Est-ce que vous choisiriez de parcourir l’ensemble du site pour trouver ce modèle précis ? Probablement pas. Vous iriez plutôt saisir le nom ou le type du modèle dans le champ de recherche, appuyer sur Entrée, et voilà ! Vous avez trouvé ce que vous cherchiez.
Mais que se passe-t-il si la barre de recherche n’est pas bien conçue ? Une étude menée par Baymard montre que 39 % des sites e-commerce rencontrent de gros problèmes avec leur fonction de recherche. Cela souligne l’importance d’une fonction de recherche bien conçue, qui est souvent négligée et pourtant essentielle pour une expérience utilisateur harmonieuse.
La conception et la facilité d’utilisation de la barre de recherche contribuent énormément au succès des sites e-commerce. Elle permet non seulement aux utilisateurs de trouver exactement ce qu’ils cherchent, mais les aide également lorsqu’ils ne savent pas exactement ce dont ils ont besoin.
Sur un site web, la barre de recherche est un élément de conception sous-estimé. D’après notre propre recherche :
2x
Les personnes qui utilisent la recherche sont deux fois plus susceptibles d'acheter que ceux qui utilisent la navigation.
50%
La recherche représente environ 50 % des revenus d'une boutique en ligne.
73%
des e-shops ayant une personne dédiée à l'optimisation de leur recherche voient leurs revenus augmenter.
58%
des e-shops surveillent les indicateurs de leur recherche sans prendre aucune mesure.
Bonnes pratiques de conception de l’IU pour votre barre de recherche
Cette section explore les bonnes pratiques pour concevoir une barre de recherche solide.
1. Créez un design axé sur le mobile
Les utilisateurs mobiles représentent plus de 50 % du trafic internet mondial, et cette part ne cesse d’augmenter d’une année sur l’autre. Compte tenu de cette tendance, il est essentiel d’accorder la priorité à une conception adaptée aux mobiles pour votre barre de recherche.
La conception de l’UX de la barre de recherche doit être développée en pensant à l’espace d’un écran mobile. Son emplacement doit être visible et facilement accessible par un simple mouvement du pouce. Une barre de recherche persistante, qui reste visible en haut ou en bas lorsque les visiteurs font défiler la page web, est également une excellente caractéristique pour les appareils mobiles.
2. Garantir la visibilité
Ne demandez pas à vos visiteurs de chercher la barre de recherche. Certains concepteurs font l’erreur de cacher l’option de recherche dans le bouton du menu, ou ne rendent pas le champ de recherche suffisamment visible.
Il est important d’afficher le champ de texte au complet, car masquer la fonction de recherche derrière une icône réduit sa visibilité et augmente les coûts de l’interaction.
Veillez à ce que votre barre de recherche soit facilement reconnaissable en utilisant l’icône loupe et en plaçant le bouton Rechercher juste à côté du champ de recherche. Vous pouvez également améliorer sa visibilité en utilisant des couleurs d’arrière-plan qui contrastent avec le thème de votre site web.
Pour les appareils mobiles, utilisez une barre de recherche persistante sur la partie centrale en haut de l’écran pour obtenir les meilleurs résultats.
3. Conserver un design cohérent sur l’ensemble du site
Veillez à placer la fonction de recherche au même endroit sur l’ensemble de votre site.
Les visiteurs s’attendent à trouver le champ de recherche au même endroit, et ayant la même apparence, que sur la première page qu’ils ont consultée. Si votre site manque de cohérence, cela peut créer de la confusion et avoir un impact négatif sur vos taux de conversion.
4. Mettre en œuvre la saisie semi-automatique
Souvent, vos visiteurs ne savent pas exactement ce qu’ils cherchent. Et certains utilisateurs n’ont simplement pas envie de saisir de longs termes de recherche.
La saisie semi-automatique est une puissante fonctionnalité de la barre de recherche qui prédit les requêtes des utilisateurs et offre des suggestions en fonction de ce qu’ils ont déjà saisi, leur historique de recherche, la page en cours, etc.
Cette fonctionnalité ouvre de nombreuses possibilités de susciter l’intérêt des visiteurs du site web. Par exemple, une seule requête peut générer de nombreux résultats de recherche en lien avec la saisie, tels que des catégories de produits, des marques connues, augmentant ainsi la probabilité de nouvelles conversions.
La saisie semi-automatique offre un retour rapide aux requêtes des utilisateurs
Elle assure immédiatement aux utilisateurs qu’ils sont au bon endroit – votre boutique – et qu’ils prennent le bon chemin pour trouver le produit souhaité – que vous offrez et qui est en stock. Très souvent, elle est également utilisée comme un moyen de navigation rapide pour aller directement vers la bonne catégorie de produits dans votre structure de catégories. Sa rapidité est essentielle, car les acheteurs l’utilisent aussi pour répéter rapidement des saisies de recherche avant de se lancer dans l’expérience de recherche complète avec le filtrage avancé et le tri.
Michal Barla
Directeur des produits & co-fondateur, Luigi's Box
5. Ajouter des images dans les résultats
Il est également important de se concentrer sur l’interface utilisateur des résultats de recherche. Afficher des images de produits contribue à l’accroissement des ventes. Souvent, les gens se représentent visuellement le produit qu’ils recherchent sur votre site web. Alors, s’ils voient, dans les résultats de recherche, une image du produit qui correspond à celle qu’ils ont en tête, cela améliore la probabilité qu’ils fassent un achat.
6. Inclure un texte de remplacement
Pour aider les utilisateurs à connaître le type de requêtes qu’ils peuvent faire, pensez à inclure un exemple de terme de recherche dans le champ de saisie sous forme de texte de remplacement. C’est particulièrement utile si les utilisateurs peuvent faire des recherches à l’aide de différents paramètres. Grâce à HTML5, il est facile d’ajouter un texte de remplacement dans les champs de saisie.
7. Garder le mot-clé dans le champ
Le mot clé devrait rester visible dans la barre de recherche une fois la recherche terminée. Cela permet aux consommateurs de modifier ou d’affiner leur requête initiale et de lancer une nouvelle recherche, ce qui améliore l’expérience utilisateur dans son ensemble et réduit les taux de rebond.
Veillez à ce que la barre de recherche garde en mémoire et affiche le mot clé de la dernière requête.
Le mot clé devrait demeurer dans la fenêtre de recherche.
Bonnes pratiques UX pour la conception de votre barre de recherche
Une conception UX efficace pour la recherche ne se limite pas à l’esthétique visuelle. La fonctionnalité de la recherche sur votre site web joue un grand rôle. Voici six aspects technologiques que vous pourriez envisager de mettre en place afin d’améliorer la conception de votre barre de recherche.
1. Rapidité
Les gens sont occupés. Ils n’ont pas envie d’attendre que votre site web charge les résultats de recherche. C’est particulièrement vrai dans le cas de la saisie semi-automatique.
Pour l’expérience utilisateur, la rapidité est essentielle. Si les visiteurs n’obtiennent pas les résultats tout de suite, ils vont fermer la fenêtre et acheter chez vos concurrents.
2. Qualité de la correspondance
L’utilisateur ne va toujours vous donner le mot clé exact. Il peut s’agir d’une faute de frappe, d’une intention de recherche ou d’un contexte manquant, de l’utilisation de synonymes, etc. L’algorithme de l’outil de recherche devrait être suffisamment sophistiqué pour prendre en compte tous les facteurs, reconnaître exactement ce que l’utilisateur recherche, et fournir ensuite des correspondances de recherche précises.
La capacité de votre outil de recherche à fournir une excellente qualité de correspondance va déterminer la rapidité avec laquelle votre entreprise se développe. Veillez donc à choisir un outil de recherche de grande qualité.
3. Recherche vocale
La recherche vocale est un moyen de recherche pratique pour les utilisateurs, en particulier sur les appareils mobiles.
Elle est également bénéfique pour les individus souffrant d’un handicap qui ont des difficultés ou sont dans l’impossibilité de taper sur un clavier.
Utilisez une icône de micro pour représenter la recherche vocale et la rendre facilement reconnaissable.
4. Filtres dynamiques
Les filtres dynamiques permettent aux clients de parcourir facilement une variété de produits sans avoir à faire le tri entre des milliers d’alternatives.
De plus, les filtres de recherche dynamiques améliorent le confort en affichant automatiquement les options de filtres appropriées à chaque catégorie de produits. Par exemple, les acheteurs peuvent filtrer les guitares basses par le nombre de cordes, tandis que les batteries proposeront des filtres totalement différents.
Les sites qui ont optimisé leurs listes de produits et leur expérience de filtrage constatent des taux d’abandon pratiquement divisés par quatre.
Des filtres dynamiques qui changent en fonction du contexte.
5. Barre de recherche mobile
De plus en plus de personnes font des achats en ligne à partir de leur smartphone. Les options de recherche avancée ne devraient donc pas être réservées aux seuls utilisateurs d’ordinateurs.
Des formulaires de recherche complets disponibles sur les versions mobiles des sites web améliorent considérablement l’expérience de tous les utilisateurs en répondant à leurs attentes. Des fonctions avancées telles que la correction des fautes de frappe, la lemmatisation ou le remplissage automatique peuvent faire une différence considérable et augmenter vos chances de vendre plus d’articles.
6. UX des résultats de recherche
7. Personnalisation basée sur le comportement antérieur
Le parcours en ligne d’un utilisateur commence par une recherche mais ne se termine pas toujours par un achat.
Grâce à un outil de recherche perfectionné tel que Luigi’s Box, vous pouvez tirer profit des requêtes précédentes des visiteurs pour personnaliser leur expérience. L’algorithme de Luigi’s Box utilise les données provenant de leur historique de recherche afin d’optimiser le processus, présentant aux utilisateurs les produits qu’ils sont les plus susceptibles d’acheter.
Boostez le taux de conversion et la valeur moyenne des commandes de votre boutique en ligne grâce à une recherche interne personnalisée alimentée par l'IA.
Bonus : créez un meilleur contenu
N’oubliez pas : le contenu est roi. Un bon texte peut faire de merveilles pour convaincre les visiteurs d’acheter. Assurez-vous que tous les produits contiennent une description détaillée qui couvre toutes les caractéristiques importantes.
Ajoutez également des photos de produits bonne qualité aux dimensions uniformes. N’oubliez pas les informations concernant le prix ou les tableaux des tailles. Le contenu de votre site web fait partie intégrante de l’expérience de l’utilisateur, c’est pourquoi il faut donner la priorité à sa qualité et à son exhaustivité.
5 exemples de sites dotés de barres de recherche bien conçues
Dans cette section, nous allons examiner cinq sites e-commerce qui présentent une barre de recherche exceptionnellement bien conçue.
1. Škoda Auto
La boutique en ligne de Škoda Auto n’a aucun problème à traiter une requête qui mentionne la taille du produit souhaité, et trouve aisément les jantes Karoq de 16 pouces.
Recherche de jantes Karoq de taille 16 sur l'e-shop officiel Škoda.
2. Acer
La boutique Acer dispose d’une barre de recherche large que les clients remarquent immédiatement. La saisie semi-automatique affiche les requêtes et les produits populaires, présentant des suggestions de produits avant que les utilisateurs ne saisissent leurs requêtes.
Recherche avec saisie semi-automatique et requêtes populaires sur la boutique en ligne Acer.
3. 11teamsports
Une autre barre de recherche avec des suggestions instantanées de la saisie semi-automatique de produits et de requêtes populaires. Après avoir saisi “ars”, l’utilisateur obtient des exemples de kits et de marchandise pour le club de football d’Arsenal.
Saisie semi-automatique présentant des produits populaires du club de football Arsenal.
4. Kik
La barre de recherche sur le site web de Kik se présente avec un texte de remplacement incitant le visiteur à utiliser la recherche pour trouver les produits désirés.
Recherche de "chaussettes" sur la boutique kik.de.
5. Bobcat
La recherche de Bobcat propose des suggestions de saisie semi-automatique d’une manière plus directe, facilement compréhensible. Elle s’accompagne de requêtes pivotantes, qui donnent aux utilisateurs des idées sur ce qu’ils peuvent chercher.
Barre de recherche avec saisie semi-automatique sur le site web de Bobcat Europe.
Les meilleurs outils de barre de recherche
1. Luigi’s Box
Fondée en Slovaquie, Luigi’s Box a d’abord été conçue comme une solution permettant de traiter les problèmes de la recherche interne pour les entreprises e-commerce. Au fil des ans, elle a gagné en reconnaissance sur le marché européen pour son approche novatrice.
2. Algolia
Établie en 2012 à Paris, Algolia a vite élargi son empreinte jusqu’à San Francisco et d’autres sites internationaux. Elle est connue pour son approche centrée sur le développeur et s’est taillée une position solide sur le marché de la recherche en tant que service.
3. Elasticsearch
Née d’un projet parallèle de Shay Banon en 2010, Elasticsearch est ensuite devenue le produit principal d’Elastic, une société fondée à Amsterdam. Elle est devenue depuis un leader dans le domaine des technologies de recherche open-source.
4. SearchSpring
Fondée en 2007 à Colorado Springs, SearchSpring a vu le jour en tant que réponse aux besoins grandissants en termes de solutions avancées pour la recherche e-commerce. Elle sert depuis un grand nombre de marques et de détaillants.
5. FactFinder
Trouvant ses racines en Allemagne, FactFinder est présente sur le secteur de la recherche e-commerce depuis le début des années 2000. Elle est reconnue sur le marché européen pour ses solutions de recherche et de navigation solides.
6. Klevu
Originaire de Finlande, Klevu a été établie en 2013. Axée sur les solutions pilotées par l’IA, l’entreprise a étendu sa présence à l’Europe et l’Amérique du Nord.
7. Doofinder
Fondée en Espagne en 2011, l’objectif de Doofinder était d’améliorer l’expérience de recherche e-commerce pour les entreprises à travers l’Europe. Elle a depuis élargi sa clientèle et ses offres.
8. Loop54
Basée à Stockholm, en Suède, Loop54 a commencé son parcours en 2011. L’accent mis par l’entreprise sur les solutions pilotées par IA l’a distinguée sur le marché nordique du commerce électronique.
Conclusion
Concevoir une barre de recherche pour un site web est un art. Bien réalisée, elle peut sérieusement vous aider à booster votre taux de conversion et à développer votre entreprise. Ne faites pas l’impasse sur les petits détails. Ces éléments de design sont essentiels car ils jouent un rôle primordial dans l’expérience utilisateur.
La conception UX de la barre de recherche devrait être effectuée en se concentrant d’abord sur les mobiles. Le meilleur design pour une barre de recherche va aussi toujours dépendre d’un fonctionnement de qualité supérieure. Alors assurez-vous de choisir un outil de recherche rapide et futuriste qui offre de puissantes fonctionnalités telles que la recherche à facettes, la recherche personnalisée, la saisie semi-automatique et bien d’autres.
Foire aux questions
Pourquoi devrais-je avoir une solution de recherche sur mon site ?
Dans l’ensemble, 73 % des boutiques en ligne qui mettent en œuvre une fonction de moteur de recherche voient leurs revenus augmenter. Une fonction de recherche propose aux visiteurs de votre site une fonction de recherche avancée qui prend les données saisies par l’utilisateur, ainsi que l’historique, pour proposer des correspondances de produits précises et personnalisées. Cela créé une expérience de shopping harmonieuse, ce qui diminue le taux de rebond, améliorer le temps moyen de la session et booste les conversions.
Comment créer une barre de recherche efficace ?
Une barre de recherche bien conçue devrait être adaptée aux mobiles et rester visible et cohérente sur l’ensemble d’un site web. Le fonctionnement du champ de recherche devrait être rapide et offrir de puissantes fonctionnalités, telles que la saisie semi-automatique, la recherche à facettes, la recherche vocale, des filtres dynamiques, des résultats de recherche personnalisés, et bien d’autres. Efforcez-vous simplement de rendre le processus de recherche aussi simple que possible pour l’utilisateur.
Puis-je créer ma propre barre de recherche ?
Vous pouvez tout à fait créer une solution de barre de recherche pour votre site web. En fait, vous avez plusieurs options. Par exemple, vous pouvez choisir des bibliothèques publiques, des technologies open-source, Elasticsearch, des plug-ins, etc. Toutefois, si vous souhaitez disposer d’un outil de recherche dont le fonctionnement est excellent et qui offre de nombreuses fonctionnalités futuristes, Luigi’s Box est votre meilleure option.
