Ton domaine est propre, tes emails arrivent en boîte de réception : place au visuel. C'est le module où beaucoup de débutants dépensent le plus d'argent au mauvais endroit, en confondant thème payant et boutique qui vend.
Chapitre 3.1
Choisir son thème
La réalité du terrain
Le raisonnement classique : « le thème gratuit fait basique, je prends un thème à 320 € qui a l'air pro ». Trois semaines plus tard, la boutique est plus lente qu'avant, la moitié des réglages ne sont pas compris, et le site ressemble à une démo mal remplie plutôt qu'à un magasin.
La vérité que personne ne dit : un thème gratuit bien réglé bat un thème payant mal réglé, dans neuf cas sur dix. Ce qui fait vendre, c'est le contenu que tu mets dedans, pas le squelette. Dawn, le thème gratuit officiel de Shopify, est développé par Shopify eux-mêmes, mis à jour à chaque nouveauté de la plateforme, et léger.
Le pas-à-pas dans l'admin
Boutique en ligne > Thèmes > Bibliothèque de thèmes > Explorer les thèmes gratuits. Installe le thème, il arrive dans ta bibliothèque sans être publié. Personnaliser pour ouvrir l'éditeur : commence par les réglages globaux du thème (couleurs, typographie, boutons), puis seulement ensuite les sections de la page d'accueil.
Piège coûteux
Ne publie jamais un thème directement. Duplique-le avant toute modification importante (menu à trois points, Dupliquer), avec un nom clair (« Dawn - test bandeau promo - date »). Le jour où tu casses quelque chose sans comprendre quoi, tu republies l'ancienne version en un clic au lieu de passer la nuit à chercher.
Le conseil du commerçant
Choisis ton thème sur une seule chose : regarde la démo sur ton téléphone, pas sur ton ordinateur. Les démos sont conçues pour être belles en grand écran. Sur 6 pouces, le même thème peut devenir illisible. Si tu dois zoomer pour lire un prix dans la démo, passe au suivant.
Chapitre 3.2
Penser en 375 pixels
La réalité du terrain
Sur mes boutiques, entre 75 % et 85 % du trafic vient du mobile. Traduction concrète : tu conçois ton site sur un écran de 27 pouces, et huit clients sur dix le verront sur une surface de la taille d'une carte postale, dans le métro, avec une main. 375 pixels, c'est le gabarit de référence d'un iPhone standard : si c'est propre en 375, c'est propre partout.
Les règles de base du pouce
La zone du pouce. Le tiers inférieur et le centre de l'écran sont faciles à atteindre à une main. Les actions importantes (ajouter au panier, valider) vont là, jamais dans un coin haut.
La taille des cibles. Un bouton doit faire au moins 44 pixels de côté. En dessous, on rate la cible une fois sur trois, et un client qui rate trois fois s'en va.
Le corps de texte. 16 pixels minimum. En dessous, iOS zoome automatiquement au clic dans un champ, ce qui décale toute la page et donne une impression de bug.
Astuce de commerçant
Le test du bus : prends ta boutique sur ton téléphone, debout, une main sur la barre, en 4G moyenne, avec du soleil sur l'écran. Si tu arrives à passer commande dans ces conditions, ton site est bon. C'est comme ça que tes clients achètent réellement, pas assis devant un 27 pouces avec la fibre.
Envie de voir comment votre boutique se comporte vraiment sur mobile ?
Lancer le diagnostic gratuitChapitre 3.3
La ligne de flottaison
La réalité du terrain
La ligne de flottaison, c'est le bas de l'écran avant tout défilement, environ 600 pixels de hauteur utile sur mobile. Dans cet espace, le client doit voir d'un coup d'œil : le titre du produit, le prix, la note d'avis, et le bouton d'ajout au panier. S'il doit défiler pour trouver le prix, une partie des visiteurs partent avant.
Le piège du débutant
Empiler les badges de réassurance juste sous le bouton d'achat : « Paiement sécurisé », « Livraison 48h », « Satisfait ou remboursé », chacun avec son icône, sur trois lignes. Sur mobile, ça pousse le bouton d'achat hors de l'écran. Garde un ou deux arguments, en texte simple, sur une ligne.
Le conseil du commerçant
Le bouton d'achat collant : la plupart des thèmes récents proposent une option qui garde « Ajouter au panier » visible en bas de l'écran pendant que le client fait défiler la fiche. C'est un des rares réglages qui donne un effet mesurable sur le taux d'ajout au panier, surtout sur les fiches longues.
Chapitre 3.4
La navigation
La réalité du terrain
La règle est simple : deux clics maximum entre la page d'accueil et n'importe quel produit. Le deuxième problème classique, c'est le menu trop riche : quand tu démarres avec quinze produits et douze catégories, chaque catégorie contient un ou deux articles, et le client en déduit que la boutique est vide.
Le pas-à-pas dans l'admin
Boutique en ligne > Navigation. Trois à cinq entrées de catégories produits maximum dans le menu principal, rien d'autre. Les pages légales vont dans le pied de page, jamais à côté de tes catégories produits.
Astuce de commerçant
Ajoute la barre de recherche, et regarde ce qu'on y tape (Analyses > Rapports > Principales recherches sur la boutique en ligne). C'est le meilleur sondage gratuit que tu auras jamais : les gens y tapent exactement ce qu'ils cherchent, avec leurs mots.
David — e-commerçant depuis 2009, sur Shopify depuis 2018, plus de 77 000 clients servis sur mes propres boutiques. Le mobile, c'est là que je perds le plus de sommeil à chaque nouvelle boutique.