Le taux de conversion sur Mobile est de 3 à 5 fois inférieur à celui sur Desktop. Nous avons vu dans notre article sur les obstacles à la conversion sur Mobile quels sont les freins structurels dans le parcours d’achat qui anéantissent les intentions d’achat des visiteurs.
Voyons maintenant les bonnes pratiques qui permettent d’améliorer l’expérience utilisateur, et par extension la conversion sur Mobile, depuis la page d’accueil jusqu’à la page de paiement.
La 1ère réflexion se porte sur l’accès du menu de navigation principal. La norme actuelle est de le positionner en haut à gauche de l’écran. Cela était tout à fait logique il y a quelques années lorsque les smartphones étaient plus petits. Sauf qu’entretemps, la taille des écrans a augmenté de 25%, si bien qu’il est de plus en plus difficile d’atteindre le menu avec son pouce (en tant que droitier) lorsque l’on tient son téléphone d’une main. En conséquence, il désormais plus pratique à l’usage de placer le menu à droite.
Le Journaldunet et le site Petitetomate l’on compris. Faite le test en naviguant sur ces sites et vous verrez que le confort ergonomique pour atteindre le menu est sans appel, surtout sur les derniers smartphones avec un grand écran.
Le contenu du menu doit aussi être soigné. Oubliez les longs listings de liens en petite police et trop serrés qui nécessitent une précision de pointage quasi impossible à atteindre avec son pouce pour en sélectionner un.
Optez pour des menus larges, aéré, avec des grandes zones de click, simples à pointer.
Que mettre sur la page d’accueil pour optimiser la conversion sur mobile ?
Que cherchez-vous à faire lorsque que vous arrivez sur un site pour la 1ère fois ? A vous orienter en regardant le menu. Evitez un click inutile sur le menu à vos visiteurs en leur montrant immédiatement les rubriques principales de votre site.
Avez-vous remarqué à quel point les pages sur un site mobile sont longues ? Combien de fois avez-vous fait « l’ascenseur » sur une page pour retrouver la navigation principale ? La tendinite du pouce n’est pas loin…
Faite gagner du temps à vos visiteurs en créant un menu sticky qui permet de le garder visible en permanence quel que soit le niveau de la page auquel le visiteur se trouve. Ainsi, il peut ouvrir le menu à tout moment.
Sur les site mobiles le moteur de recherche joue un rôle essentiel pour pallier les faiblesses du menu. Pouvoir aller droit au but et trouver rapidement ce que l’on cherche est un élément clé d’une bonne expérience utilisateur.
Le moteur de recherche
Comme pour le menu, garder le moteur de recherche à portée de click grâce à un principe sticky peut se révéler très utile.
Son efficacité est encore plus importante sur Mobile. Si le fonctionnement du moteur de recherche natif de votre solution e-commerce n’est pas assez efficace, il est temps de regarder vers une solution externe de type Doofinder, Sensefuel, Algolia, Sparkow, pour proposer une expérience utilisateur à l’état de l’art sur ce sujet.
Page Catégorie
Le listing des résultats
La question cruciale ici est : quel est le meilleur format pour permettre une lisibilité optimale des produits appartenant à une catégorie, et permettre un choix ?
La plupart des sites en Responsive design se contentent de reproduire la disposition en vignettes de la version Desktop, imposant aux visiteurs une lecture en Z. Cette organisation du contenu peut être efficace mais pensez que sur smartphone, nous sommes plutôt dans une logique de lecture linéaire pour faciliter le scanning des informations importantes, autrement dit, le titre du produit.
Attention aux tableaux HTML pour présenter des listes. Il faut s’assurer qu’ils s’adapteront bien au format des plus petits écrans sur smartphone.
La gestion des filtres et tris
Comme pour le menu de navigation, il faut repenser l’accès et l’ergonomie de ces fonctions spécifiquement pour l’utilisation avec un petit écran tactile. L’exemple du site Darty est tout simplement parfait.
La pagination
Que ceux qui cliquent sur la 2ème page des résultats d’une page Catégorie lèvent la main ! Personne ? Ha si, le monsieur au fond… Mais vous êtes le seul.
Les pages catégories sont comme les pages de Google : les visiteurs ne regardent que la première, considérant que les produits figurant sur les pages suivantes ne seront pas assez pertinents par rapport à leur recherche. Sinon, ils seraient affichés sur la 1ère page.
Si en plus les boutons pour cliquer sur la 2ème, 3ème, 4ème page sont trop petits pour être facilement cliqués, la messe est dite pour la suite du catalogue.
La solution consiste donc à mettre en place un scrolling infini, qui correspond parfaitement à la gestuelle intuitive aux smartphones : le finger scroll vertical.
Cela permet d’aller au bout de la page Catégorie sans rupture de navigation.
Les Pages Produit
La saisie des quantités et des tailles
Toute étape de saisie doit être simplifiée au maximum, voire supprimée si possible. Que ce soit pour le choix de la quantité ou pour le choix d’une taille, optez pour un choix dans le menu système ou le click sur un bouton, plutôt que d’utiliser le clavier tactile.
Accès de l’ajout au panier
La longueur des fiches produits fait rapidement perdre de vue le bouton d’ajout au panier. Pour permettre un ajout au panier permanent quel que soit l’endroit où l’on se trouve dans la page, la solution du bouton sticky est de nouveau intéressante à étudier.
Chez Proform, La zone sticky qui contient le bouton sert aussi à afficher des informations de rassurance.
Les information produit
Limitez l’utilisation des onglets qui obligent à cliquer pour prendre connaissance du contenu de la fiche produit, surtout les accordéons. Préférez des blocs statiques de contenu qui favorisent le scroll naturel.
Avec ces quelques bonnes pratiques, vous devriez pouvoir observer des améliorations sensibles dans l’utilisation de votre site, et ainsi augmenter le taux de conversion sur mobile.
Il reste désormais à optimiser la partie la plus cruciale du parcours utilisateur : le tunnel de vente.
Bonjour. Erreur sur le premier montage (gauche au lieu de droite). Cdt
Très très bon article, je vous remercie et vous félicite. Très ludique et bien expliqué. Sur la version mobile, je vais adopter un placement le bouton d’appel à l’action dans un pied de page fixe.
wh1ruq
sajmqy