La conception parfaite de la boîte de recherche pour votre commerce électronique

Avez-vous déjà parcouru une boutique en ligne ou un Marketplace avec l'intention de rechercher un produit et n'avez pas trouvé le champ de recherche ? Nous sommes sûrs que vous l'avez fait.

Il va sans dire que plus vous accordez d'importance à la recherche sur le site sur votre page d' accueil , plus votre recherche sur le site est susceptible d'être utilisée. Cela signifie qu'au lieu de parcourir différentes catégories sur votre site Web de commerce électronique, vos visiteurs utiliseront directement la recherche sur le site pour trouver le produit qu'ils souhaitent plus rapidement, sans avoir à perdre de temps à regarder des choses dont ils n'ont pas besoin.

Ainsi, dans les secteurs où la recherche est le moyen le plus courant de trouver des produits, il peut être judicieux de «promouvoir» le champ de recherche avec un design accrocheur et de le placer à un endroit stratégique, en particulier sur la page d'accueil.

Navigation par catégorie

C'est généralement le cas des comparateurs de prix plus ciblés, à condition que l'utilisateur connaisse exactement la marque et le modèle du produit qu'il cherche à acheter (en d'autres termes, il sait exactement ce qu'il veut, avant même de visiter votre site de commerce électronique).

D'autre part, dans les secteurs où les utilisateurs préfèrent naviguer par catégorie (parce qu'ils ne connaissent pas le produit exact qu'ils recherchent, son nom ou son orthographe), ou avec une hiérarchie de site Web plate, une conception de champ de recherche moins visible peut être utilisé pour encourager la navigation par catégorie plutôt que par recherche.

Par exemple : les secteurs de la mode et de la décoration , notamment, privilégient fortement la navigation par catégorie, tant au niveau de la préférence initiale des utilisateurs que de leur taux de réussite ultérieur (taux de conversion post-recherche).

En ce qui concerne la conception et la mise en œuvre, il existe un large éventail de façons de faire ressortir le champ de recherche dans la conception globale. Ainsi, le format exact à utiliser variera d'un site Web à l'autre, en grande partie en fonction du contexte dans lequel le champ de recherche apparaît (en d'autres termes, la conception globale du site Web).

Éléments de conception du champ de recherche

Plusieurs éléments de conception du champ de recherche peuvent être utilisés pour le faire ressortir, selon le degré auquel vous souhaitez encourager les utilisateurs à utiliser la fonction de recherche. Les trois principaux éléments de la conception du champ de recherche qui ont tendance à avoir le plus grand impact sont :

Position

Jetez un œil à Amazon dans l'image ci-dessous. Comme vous pouvez le voir, il est dans l'intérêt d'Amazon que vous fassiez des recherches sur sa place de marché, car il vend plus et peut mieux vous guider lorsque vous utilisez sa recherche sur le site plutôt que de naviguer par catégories.

En raison des millions de produits qu'il propose et compte tenu du fait que les utilisateurs savent normalement déjà quel type de produit ils veulent une fois qu'ils visitent son site Web, ils placent la recherche sur le site à un emplacement préférentiel, en plein centre et occupant pratiquement tout le largeur de l'écran.

De plus, si vous souhaitez mettre en avant la recherche sur le site et inciter les utilisateurs à l'utiliser, celle-ci doit fonctionner correctement. En d'autres termes:

• Afficher les résultats instantanément : vous ne pouvez pas avoir une recherche sur site qui prend trop de temps pour charger les produits une fois qu'ils ont été recherchés.
• Listez les résultats dans l'ordre que vous souhaitez : gardez à l'esprit que plus haut et à gauche, plus les résultats seront pertinents pour vos visiteurs.
• Qualité d'image correcte : pas d'images pixélisées, s'il vous plait !
• Affichez les caractéristiques de vos produits : tailles, remises ou promotions, couleurs disponibles… Le tout dans votre propre recherche.
• Donnez aux utilisateurs la possibilité d'ajouter au panier dans la recherche sur le site elle-même : afin qu'ils puissent acheter plusieurs produits sans avoir à faire des allers-retours entre la recherche sur le site et le panier.

Styles de recherche de votre site

Il est de la plus haute importance qu'une fois le champ de recherche cliqué, l'image de votre site Web soit respectée. Pour cela, un certain nombre d'éléments doivent être pris en compte.

• Couleurs : Vous devez utiliser les mêmes couleurs corporatives que sur votre site Web. Essayez également d'ajouter le logo quelque part dans la recherche sur le site.
• Polices : La police est un autre élément important ; utilisez les mêmes polices que vous utilisez sur votre site web, pour les chiffres, les titres, les boutons…
• Boutons : Essayez d'avoir les mêmes styles que les boutons de votre site web dans les boutons acheter ou « ajouter au panier ».
• Autres éléments : tels que des remises, des bordures , en utilisant les mêmes catégories que vous avez sur votre site de commerce électronique…

Taille

En rendant le champ de recherche relativement petit, sa proéminence visuelle est considérablement réduite. Une chose que font de nombreux magasins en ligne cherchant à augmenter l'utilisation de la recherche sur site est d'augmenter le contraste entre l'en-tête et la recherche sur site. Par exemple, Amazon , comme nous l'avons vu plus haut, a son en-tête en noir, mais le Site Search est centré et en blanc.

Lorsque vous combinez la taille, la position et le contraste, vous faites vraiment ressortir le champ de recherche, encourageant la recherche comme moyen préféré de rechercher des produits sur votre site Web de commerce électronique. Néanmoins, cela nécessite une recherche de site intelligente telle que Doofinder pour réduire votre taux de rebond. Sinon, cela peut devenir une épée à double tranchant.

Conception du champ de recherche sur la page d'accueil

Sur la page d'accueil en particulier, la conception du champ de recherche est encore plus importante, car la plupart des utilisateurs ont tendance à définir leur stratégie de recherche de produits dès qu'ils visitent le site Web.

Selon les données du Baymard Institute , 60 % des utilisateurs utilisent immédiatement la recherche comme première stratégie sur la page d'accueil d'un site Web mobile. Par conséquent, plus le design du champ de recherche sur la page d'accueil est accrocheur, plus les utilisateurs le prendront comme une incitation à rechercher plutôt qu'à naviguer par catégorie.

De plus, il est judicieux de donner au Site Search une touche visuelle supplémentaire sur la page d'accueil, à condition de vouloir favoriser la navigation dans le Site Search plutôt que la navigation par catégorie.

Une conception de recherche de site différenciée pour la page d'accueil peut se faire de plusieurs façons : des bordures de champ de recherche plus audacieuses, une couleur d'arrière-plan plus contrastée, une taille de boîte et de police plus grande, un bouton de "recherche" plus vivant... Et peut-être même rendre le clavier de champ focusable par défaut. Toute modification de conception qui fait que le champ de recherche se démarque de lui-même, sans changer fondamentalement sa position ou son style visuel, l'aidera à se démarquer.

De cette façon, le champ de recherche reste entièrement reconnaissable sans détourner l'attention des autres pages, mais vous donnera un contraste visuel supplémentaire sur la page d'accueil.

Ce contraste visuel supplémentaire ne doit pas aller jusqu'à promouvoir la recherche comme « la seule option » sur le site Web, mais doit aider les utilisateurs à voir plus facilement le champ de recherche lorsqu'ils visitent le site Web.

Comme vous le savez… La page d'accueil comporte souvent de nombreux graphiques et éléments visuels différents qui se disputent l'attention de l'utilisateur, ce qui signifie que ce qui, sur les pages suivantes (telles que les pages de catégories, les listes de produits ou les pages de produits) peut être un champ de recherche dominant, peut ne pas suffire pour la page d'accueil.