Vous venez d’installer Dawn (ou Refresh, ou Sense), et votre menu fonctionne. Les catégories s’affichent, l’icône hamburger s’ouvre sur mobile, et l’icône du panier se trouve dans le coin supérieur droit. Vous vous dites : « C’est suffisant, je vais passer aux photos de produits. »
Cet instinct vous coûtera des conversions. Non pas parce que ces thèmes sont mauvais—ils sont authentiquement bien construits. Mais « fonctionne » et « fonctionne bien pour vendre » sont deux choses différentes. Chaque thème par défaut fait des compromis de conception spécifiques, et certains de ces compromis nuisent activement aux nouvelles boutiques.
Ce guide parcourt les trois thèmes Shopify gratuits les plus populaires—Dawn, Refresh et Sense—et identifie exactement quelles fonctionnalités de menu sont suffisamment bonnes pour être conservées, lesquelles nécessitent des ajustements mineurs, et lesquelles vous devriez changer immédiatement.
- La navigation de Dawn est épurée et rapide mais manque de support mega menu et de barre d'onglets mobile prêts à l'emploi
- Refresh (2024) ajoute un en-tête plus moderne mais utilise toujours le motif hamburger standard sur mobile
- Sense privilégie l'attrait visuel et fonctionne bien pour les marques riches en images mais peut sembler lent sur les téléphones bas de gamme
- Les trois thèmes partagent des lacunes communes : pas de barre d'onglets inférieure, pas d'icônes de menu, personnalisation mobile limitée
- Vous pouvez résoudre la plupart des problèmes via les paramètres du thème—seuls quelques-uns nécessitent des applications ou du code personnalisé
Une remarque rapide sur le choix du thème
Si vous n’avez pas encore choisi de thème, ne vous compliquez pas la vie. Dawn, Refresh et Sense sont tous gratuits, tous maintenus par Shopify, et tous performants prêts à l’emploi. Les différences sont principalement visuelles—Dawn est minimaliste, Refresh est moderne, Sense est éditorial.
Spécifiquement pour la navigation, aucun des trois n’a un avantage clair sur les autres. Les mêmes lacunes et points forts s’appliquent aux trois. Choisissez en fonction de l’esthétique de votre marque, puis personnalisez la navigation.
Dawn : le thème par défaut le plus populaire
Dawn est le thème gratuit phare de Shopify, et celui avec lequel la plupart des nouvelles boutiques commencent. Il est volontairement minimaliste, rapide à charger et suit les meilleures pratiques d’accessibilité. Décomposons sa navigation.
Ce qui fonctionne bien
Structure d’en-tête épurée. L’en-tête de Dawn est simple : logo à gauche, menu horizontal au centre ou aligné à gauche, icônes utilitaires (recherche, compte, panier) à droite. Cela suit la disposition standard du commerce électronique que les utilisateurs attendent.
Menu mobile décent. L’icône hamburger ouvre un tiroir coulissant épuré avec vos éléments de menu. Il supporte un niveau d’imbrication (appuyez sur un élément parent pour développer les enfants), ce qui suffit pour la plupart des petites et moyennes boutiques.
Chargement rapide. La navigation de Dawn est légère. Elle ne charge pas de frameworks JavaScript lourds ni d’animations personnalisées, donc le menu s’affiche rapidement même sur les connexions lentes. Dans les tests PageSpeed Insights, Dawn obtient régulièrement 85+ sur les performances mobiles.
Option d’en-tête collant. Dans Paramètres du thème → En-tête, vous pouvez activer un en-tête collant qui reste visible lorsque les utilisateurs font défiler. Cela maintient votre menu, votre recherche et votre panier accessibles à tout moment—une amélioration d’utilisabilité significative que beaucoup de propriétaires de boutiques oublient d’activer.
Recherche intégrée. Dawn inclut une icône de recherche dans l’en-tête qui ouvre une superposition de recherche prédictive. Elle affiche les résultats au fur et à mesure que vous tapez, ce qui aide les clients à trouver les produits plus rapidement.
Ce qui nécessite un ajustement
Pas de mega menu par défaut. Dawn supporte les menus déroulants (un niveau de sous-catégories), mais pas les vrais mega menus avec des dispositions multi-colonnes, des images de catégorie ou des bannières promotionnels. Pour les boutiques avec 30+ produits, un menu déroulant avec 15 sous-catégories devient une liste longue et défilable difficile à naviguer.
Solution de contournement : Vous pouvez créer un pseudo-mega-menu en organisant votre navigation Shopify en groupes logiques (Boutique en ligne → Navigation), mais le résultat visuel est toujours un menu déroulant à une seule colonne. Pour un vrai mega menu multi-colonnes avec images, vous aurez besoin d’une application de navigation.
Icône de recherche vs. barre de recherche. Sur le bureau, Dawn affiche par défaut seulement une icône de loupe. Cliquer dessus ouvre la superposition de recherche, ce qui est correct—mais la recherche de l’Institut Baymard montre qu’un champ de recherche visible (pas seulement une icône) augmente l’utilisation de la recherche de 20-30%.
Solution de contournement : Certaines personnalisations de Dawn vous permettent d’afficher une barre de recherche persistante dans l’en-tête. Vérifiez les paramètres de votre thème ou la documentation de Dawn pour les options de « recherche prédictive ». Si votre version de thème ne le supporte pas, une application axée sur la recherche peut l’ajouter.
Limitations de la barre d’annonce d’en-tête. La barre d’annonce de Dawn supporte le texte et un lien, mais pas plusieurs messages rotatifs ou minuteurs. Pour promouvoir des seuils d’expédition (« Livraison gratuite au-delà de 50 $ ») ou des offres à durée limitée, un message statique unique est fonctionnel mais basique.
Ce qu’il faut changer immédiatement
Activez l’en-tête collant. Allez à Paramètres du thème → En-tête → cochez « Activer l’en-tête collant ». Ce seul commutateur rend votre navigation accessible à tout moment au lieu de disparaître lors du défilement. Il n’y a aucun inconvénient.
Activez la recherche prédictive. Dans les paramètres du thème, assurez-vous que la recherche prédictive est activée. Elle affiche les suggestions de produits à mesure que les clients tapent, réduisant les étapes entre la recherche et la page de produit.
Vérifiez la profondeur de votre menu. Allez à Boutique en ligne → Navigation et examinez votre structure de menu. Si une catégorie est imbriquée à plus de deux niveaux (Catégorie → Sous-catégorie → Sous-sous-catégorie), aplatissez-la. Le menu mobile de Dawn gère un niveau d’imbrication avec élégance mais devient maladroit à deux niveaux ou plus.
Refresh : la mise à jour moderne
Refresh est l’un des plus nouveaux thèmes gratuits de Shopify, lancé en 2024. Il reprend l’approche axée sur les performances de Dawn et ajoute plus de finition visuelle—coins arrondis, typographie plus douce et une disposition d’en-tête légèrement différente.
Ce qui fonctionne bien
Disposition d’en-tête mise à jour. Refresh offre plusieurs options de disposition d’en-tête : logo à gauche avec menu en ligne, logo au centre avec menu dessous, ou une disposition compacte pour les petits écrans. Cette flexibilité vous permet de correspondre au style de votre marque sans code personnalisé.
Tiroir mobile amélioré. Le tiroir de menu mobile dans Refresh se sent plus poli que celui de Dawn. Il inclut des animations plus fluides, une typographie plus claire et un meilleur espacement entre les cibles de tape. La hiérarchie visuelle entre les catégories parents et les sous-catégories est plus distincte.
Filtres de page de collection. Bien que pas strictement une navigation, Refresh inclut dans la page de collection une fonctionnalité de filtre et de tri intégrée plus épurée que celle par défaut de Dawn. Les clients peuvent filtrer par prix, disponibilité et type de produit—réduisant la charge sur votre menu principal pour surfer chaque variation.
Accessibilité. Comme Dawn, Refresh suit les directives WCAG. Les éléments de menu ont des étiquettes ARIA appropriées, les états de focus sont visibles pour la navigation au clavier, et les rapports de contraste répondent aux normes d’accessibilité.
Ce qui nécessite un ajustement
Limitations de mega menu similaires. Refresh hérite de la même contrainte que Dawn : les menus déroulants supporte les sous-catégories, mais les vrais mega menus avec images et dispositions multi-colonnes nécessitent une personnalisation supplémentaire ou une application.
Performance d’animation sur les appareils plus anciens. Les animations plus fluides de Refresh ont fière allure sur les téléphones plus récents mais peuvent causer un léger ralentissement sur les appareils plus anciens (iPhone SE, téléphones Android bas de gamme). Si votre public cible inclut des clients qui achètent peu et utilisent du matériel plus ancien, testez sur un appareil bas de gamme.
Solution de contournement : La plupart des décalages liés à l’animation peuvent être atténués en réduisant le nombre d’éléments de menu et en désactivant les effets parallaxe dans les paramètres du thème.
Ce qu’il faut changer immédiatement
Activez l’en-tête collant. Même chose que Dawn—activez-le dans Paramètres du thème → En-tête. L’en-tête collant de Refresh est légèrement plus compact que l’en-tête complet, ce qui est bon : il économise l’espace d’écran tout en gardant la navigation accessible.
Examinez les options de disposition d’en-tête. Refresh offre 3-4 variantes de disposition d’en-tête. Essayez chacun et voyez lequel donne à vos catégories la plus grande visibilité. Pour les boutiques avec 5+ catégories de niveau supérieur, une disposition avec le menu sous le logo (largeur complète) fonctionne souvent mieux que d’entasser tout en une seule ligne.
Auditez l’espacement mobile. Bien que le menu mobile de Refresh ait un meilleur espacement par défaut que celui de Dawn, passez-le en revue avec un tapotement de pouce réel. Si des éléments sont trop proches les uns des autres, augmentez l’espacement du menu dans le CSS personnalisé de votre thème ou les paramètres de section.
Sense : le thème éditorial
Sense est conçu pour les marques qui penchent vers la narration—pensez aux produits artisanaux, aux marques de beauté ou aux magasins de mode de vie. Sa navigation reflète cette orientation éditoriale.
Ce qui fonctionne bien
Poids visuel dans l’en-tête. L’en-tête de Sense donne plus de place à votre logo et à l’identité de marque. La navigation se sent intentionnelle plutôt que utilitaire, ce qui convient aux marques où l’esthétique est un argument de vente.
Pages de collection favorable aux images. La disposition de collection de Sense met l’accent sur les images de produit, et la navigation soutient cela en gardant les menus épurés et désencombré. Pour les boutiques où les photos de produits se vendent mieux que les noms de catégorie, c’est un avantage.
Menu mobile élégant. Le tiroir mobile de Sense est visuellement raffiné—typographie épurée, espaces blancs généreux, transitions fluides. Il crée une sensation premium qui correspond aux marques éditoriales ou de luxe.
Ce qui nécessite un ajustement
Moins d’options de disposition d’en-tête. Comparé à Dawn et Refresh, Sense offre moins d’options de personnalisation pour la disposition d’en-tête. Le placement du logo et la position du menu sont plus bloqués, ce qui peut sembler restrictif si votre structure de catégorie ne s’adapte pas à la disposition par défaut.
Compromis de performance. Sense charge légèrement plus de CSS et de JavaScript que Dawn, principalement pour les effets visuels. Pour la plupart des boutiques la différence est négligeable (50-100ms sur mobile), mais si vous empiles d’autres applications, chaque milliseconde compte.
Solution de contournement : Minimisez les scripts tiers et évitez d’installer plusieurs applications qui ajoutent JavaScript à votre en-tête. Si vous utilisez Sense, soyez particulièrement attentif au poids total de la page.
Ce qu’il faut changer immédiatement
Simplifiez votre structure de menu. La conception élégante du menu de Sense fonctionne mieux avec moins de catégories bien choisies (5-7 éléments de niveau supérieur). Si vous avez hérité d’un arbre de catégorie complexe d’un thème précédent, c’est le bon moment pour consolider.
Testez sur des appareils Android milieu de gamme. La finition visuelle de Sense est conçue pour les écrans modernes, mais une portion importante du trafic mondial du commerce électronique provient de téléphones milieu de gamme. Ouvrez votre boutique sur un Samsung Galaxy A-series ou un appareil similaire et vérifiez que le menu s’ouvre sans à-coups.
Activez la recherche en évidence. L’icône de recherche de Sense peut se sentir secondaire à la conception visuelle. Assurez-vous qu’elle est positionnée bien en évidence dans l’en-tête—les clients ne devraient pas avoir à la chercher.
Lacunes partagées par les trois thèmes
Quel que soit le thème que vous choisissez, les trois partagent des limitations de navigation qui affectent les nouveaux propriétaires de boutiques :
Pas de barre d’onglets inférieure
Aucun des thèmes gratuits de Shopify n’inclut une barre d’onglets mobile inférieure (la navigation de style Instagram/Amazon au bas de l’écran). C’est une lacune significative parce que :
- Les barres d’onglets gardent la navigation visible sans nécessiter un tapotement pour ouvrir le menu hamburger
- Elles sont conviviales pour le pouce (le bas de l’écran est la zone de portée la plus facile)
- Elles réduisent les étapes de « navigation » de 2 tapotements (ouvrir le menu → sélectionner la catégorie) à 1 tapotement
Ajouter une barre d’onglets nécessite une application de navigation ou du code de thème personnalisé.
Pas d’icônes de menu
Les trois thèmes affichent uniquement des éléments de menu en texte. Pas d’icônes pour Accueil, Recherche, Panier ou catégories. La recherche montre que l’appairage des icônes avec des étiquettes de texte améliore la vitesse de balayage de 20-35% et aide les clients à s’orienter plus rapidement.
Personnalisation mobile limitée
Vous ne pouvez pas configurer des menus mobiles et de bureau séparés nativement. Ce que vous configurez dans Boutique en ligne → Navigation s’applique aux deux tailles d’écran. Mais les utilisateurs mobiles et de bureau ont des besoins différents—les menus mobiles devraient être plus plats et plus directs, tandis que les menus de bureau peuvent se permettre plus de profondeur.
Pas d’analyse du menu
Aucun de ces thèmes ne vous dit quels éléments de menu sont cliqués le plus, quelles catégories génèrent le plus de trafic ou quels chemins de navigation mènent aux achats. Vous avez besoin du suivi d’événements Google Analytics ou d’une application de navigation dédiée pour obtenir ces données.
| Fonctionnalité | Dawn | Refresh | Sense | Idéal |
|---|---|---|---|---|
| En-tête collant | Oui (commutateur) | Oui (commutateur) | Oui (commutateur) | Oui |
| Mega menu | Non | Non | Non | Multi-colonnes avec images |
| Barre d’onglets mobile | Non | Non | Non | 4-5 onglets en bas |
| Icônes de menu | Non | Non | Non | Icônes + étiquettes de texte |
| Recherche prédictive | Oui | Oui | Oui | Oui |
| Menus mobiles/de bureau séparés | Non | Non | Non | Configuration indépendante |
| Analyse des clics de menu | Non | Non | Non | Suivi des clics intégré |
| Sous-catégories déroulantes | Oui (1 niveau) | Oui (1 niveau) | Oui (1 niveau) | 2+ niveaux |
Quand le défaut est suffisant (et quand ce ne l’est pas)
Conservez les défauts si :
- Vous avez moins de 30 produits
- Votre structure de catégorie est plate (5-7 catégories, pas de sous-catégories)
- Votre trafic est principalement de bureau
- Vous lancez simplement et voulez valider l’adéquation produit-marché avant d’investir dans la navigation
Dans ce scénario, Dawn, Refresh ou Sense avec l’en-tête collant activé et la recherche prédictive activée vous serviront bien. Ne dépensez pas d’argent en applications de navigation jusqu’à ce que vous ayez des données de trafic montrant où les clients se bloquent.
Mettez à niveau si :
- Vous avez 30+ produits avec des sous-catégories
- Le trafic mobile dépasse 50% (vérifiez dans Analytique Shopify → Boutique en ligne → Sessions par appareil)
- Votre taux de rebond est supérieur à 60% et vous suspectez une confusion de navigation
- Vous voulez un mega menu avec des images de catégorie, des icônes ou des bannières promotionnels
- Vous avez besoin d’une barre d’onglets mobile pour une navigation conviviale pour le pouce
Pour ces scénarios, une application de navigation comme Navi+ Menu Builder peut combler l’écart entre ce que votre thème offre et ce que vos clients ont besoin. Elle se superpose à votre thème existant sans le remplacer, en ajoutant des mega menus, des barres d’onglets, des icônes et des configurations de mobile/de bureau séparées.
Mises à jour de thèmeShopify met régulièrement à jour ses thèmes gratuits. Certaines lacunes mentionnées ici peuvent être traitées dans les versions futures. Après une mise à jour de thème, re-testez votre navigation pour voir si de nouvelles fonctionnalités ont été ajoutées—et pour vous assurer que les personnalisations existantes n'ont pas été écrasées.
Vos prochaines étapes
- Identifiez votre thème. Allez à Boutique en ligne → Thèmes pour confirmer quel thème vous exécutez.
- Activez l’en-tête collant. Chaque thème le supporte. Activez-le maintenant.
- Activez la recherche prédictive. Pareil—un commutateur, amélioration immédiate.
- Examinez le tableau de comparaison ci-dessus. Identifiez les lacunes qui importent le plus pour la taille de votre boutique et le modèle de trafic.
- Décidez : ajuster ou mettre à niveau. Si les défauts couvrent vos besoins, concentrez-vous sur le contenu et le marketing. Si vous avez besoin de mega menus, de barres d’onglets ou de dispositions spécifiques au mobile, évaluez une application de navigation.
Les thèmes Shopify par défaut vous donnent un bon point de départ pour la navigation, et pour de nombreuses nouvelles boutiques, ce point de départ est authentiquement suffisant. La clé est de savoir quelles fonctionnalités activer immédiatement (en-tête collant, recherche prédictive) et quelles limitations importeront à mesure que votre boutique grandit (pas de mega menu, pas de barre d’onglets, pas de menus mobiles séparés). Commencez avec ce que vous avez, suivez où les clients ont du mal, et mettez à niveau délibérément quand les données vous le disent.
This article is part of the larger guide on Les bases de la navigation pour votre première boutique en ligne : les 5 essentiels.