Si je ne pouvais retenir qu’un seul changement pour faciliter l’achat sur téléphone, j’ajouterais une tab bar mobile. C’est une barre de navigation fixée en bas de l’écran, qui affiche quelques icônes accompagnées de libellés. Les acheteurs n’ont pas à chercher ni à ouvrir un menu — ils baissent les yeux et voient directement où aller. C’est pour cette raison que presque toutes les grandes applications d’e-commerce l’utilisent.
Pourquoi la placer en bas change tout
La plupart des gens tiennent leur téléphone d’une seule main. La recherche de Steven Hoober, qui a observé plus de 1 300 personnes, a révélé qu’environ 49 % tiennent le téléphone d’une main et tapent avec le pouce. Tenu ainsi, le pouce n’atteint confortablement que la partie basse de l’écran — la zone que l’on appelle généralement la zone du pouce.
Le haut de l’écran, c’est l’inverse : pour l’atteindre, il faut étirer le pouce ou changer de main. Le menu hamburger traditionnel se loge précisément dans le coin supérieur, l’endroit le plus éloigné. Une tab bar en bas tombe en plein dans la zone facile d’accès. Les acheteurs agissent plus vite et se trompent moins de cible, simplement parce qu’elle se trouve là où le pouce est déjà.
À mesure que les téléphones à grand écran se généralisent, cette distance compte encore davantage. Un bouton en bas est toujours à portée ; un bouton en haut ne l’est pas toujours.
Visible d’emblée, sans aucune action
La plus grande différence entre une tab bar et un menu caché, c’est la visibilité. Elle est toujours là, 4-5 icônes avec libellés, et les acheteurs n’ont rien à ouvrir.
Cela compte plus qu’on ne le croit. Le Nielsen Norman Group a étudié 179 personnes sur 6 sites et conclu : masquer la navigation principale réduit nettement la fréquence à laquelle les acheteurs la retrouvent, allonge le temps nécessaire pour accomplir une tâche, et rend l’expérience plus pénible. Quand un menu est visible, les gens l’utilisent bien plus que lorsqu’ils doivent d’abord taper une icône à trois traits.
Pour une boutique, « les acheteurs utilisent davantage la navigation » signifie en général « les acheteurs consultent plus de produits ». Un vendeur de cosmétiques peut garder une icône Recherche sur la tab bar ; un acheteur en quête d’un rouge à lèvres précis n’a qu’à taper une fois au lieu de fouiller dans un menu. Chaque étape supprimée est une chance de retenir cet acheteur.
Quand les acheteurs s’orientent facilement, cela aide aussi indirectement au passage en caisse. Selon la synthèse de nombreuses études du Baymard Institute, le taux moyen d’abandon de panier tourne autour de 70 % et n’a quasiment pas bougé depuis des années. La cause se situe surtout au moment du paiement, mais une navigation confuse qui distrait ou égare les acheteurs y contribue aussi. Une icône Panier toujours visible en bas, avec un badge de quantité, rappelle aux acheteurs que leur panier les attend encore.
La règle des 4-5 éléments : ne garder que les destinations principales
Le plus dur avec une tab bar n’est pas technique — c’est la discipline du choix des éléments. L’espace est très étroit, il doit donc être réservé aux seules destinations principales — les endroits dont les acheteurs ont le plus souvent besoin.
Une configuration classique qui fonctionne pour la plupart des boutiques :
- Accueil — retour à la page d’accueil
- Collections / Boutique — accès aux catégories de produits
- Recherche — recherche rapide
- Panier — le panier, avec un compteur de quantité
- Compte — compte, commandes, ou un élément prioritaire qui vous est propre
Le cinquième élément est celui à arbitrer selon votre modèle économique. Si vous menez une grosse promotion, vous pouvez le remplacer par Vente flash. Si c’est le contenu qui fait revenir les acheteurs, ce pourrait être Blog. Une boutique de mode saisonnière pourra y placer temporairement Nouveautés. L’essentiel : un seul élément prioritaire, sans rien entasser.
Pourquoi pas plus de 5 éléments
Cette limite n’est pas qu’une question d’esthétique. Sur l’écran d’un téléphone, entasser 6-7 icônes rétrécit chaque élément, rend les libellés difficiles à lire et rapproche tellement les zones tactiles que les erreurs de frappe se multiplient. Quand tout est « important », plus rien ne ressort.
J’ai un jour commis exactement cette erreur : je voulais mettre Produits, Promotions, Contact, Blog, Compte et Panier sur la même barre. Le résultat était une rangée d’icônes serrées où les acheteurs ne savaient toujours pas sur quoi taper. En la ramenant à 5 éléments clairs, tout a retrouvé de l’air. Une tab bar fait bien une seule chose : elle conduit les acheteurs vers quelques-uns des endroits les plus importants, rapidement. Tout le reste — politiques, guides, catégories secondaires — peut vivre dans le slide menu ou le pied de page.
Un schéma que les acheteurs connaissent déjà
Il y a un avantage que peu de gens remarquent : les acheteurs savent déjà se servir d’une tab bar avant même d’arriver sur votre boutique. Ils en voient une chaque jour dans les applications de shopping, les réseaux sociaux, les applis bancaires. Une rangée d’icônes en bas avec Accueil, Recherche, Panier et Compte est une convention que presque tout le monde comprend.
Quand une boutique reprend exactement ce schéma, les acheteurs n’ont rien de nouveau à apprendre. Ils regardent en bas et savent instantanément quoi faire. Cette familiarité est en soi une forme d’optimisation de la conversion — vous réduisez la friction sans avoir à expliquer quoi que ce soit.
Pour les vendeurs sur Shopify, le hic est généralement technique : la plupart des thèmes n’incluent pas de tab bar de type application, et la coder soi-même coûte cher et casse facilement dès qu’on change de thème. C’est là qu’un outil dédié rend service. Navi+ permet de construire une tab bar par glisser-déposer, sans code, avec des réglages distincts pour le mobile et le bureau, et le menu reste en place quand vous changez de thème.
Ne la troquez pas contre la vitesse de la page
Un dernier point. La tab bar s’affiche sur chaque page, donc si elle est lourde, elle ralentit toute la boutique. Et Google note la vitesse directement via les Core Web Vitals : le LCP doit rester sous 2,5 secondes, l’INP sous 200 millisecondes, le CLS sous 0,1. Le CLS en particulier — le décalage de mise en page — se dégrade facilement si la barre du bas apparaît trop tard et pousse le reste du contenu.
Au moment de choisir un outil pour construire votre tab bar, privilégiez-en un qui soit léger, stable, et qui ne plombe pas votre score de vitesse. Navi+ obtient de bonnes notes sur le Shopify App Store et porte le badge « Built for Shopify ». Une bonne tab bar doit être à la fois facile à toucher et exempte de toute attente.
En résumé, la tab bar est la principale alternative au menu hamburger sur téléphone : elle se trouve dans la zone du pouce, reste visible sans rien ouvrir, se limite à quelques-unes des destinations les plus importantes, et s’appuie sur un schéma que les acheteurs connaissent déjà. Bien régler ces quelques bases suffit en général à faciliter nettement l’achat pour les acheteurs sur mobile.
Cet article fait partie du guide plus large sur la Navigation mobile — pourquoi le menu hamburger s’efface et par quoi le remplacer.