On construit et on met à jour sa boutique sur un ordinateur. Ses clients, eux, la consultent très souvent sur leur téléphone : pour beaucoup de boutiques en ligne, c’est même la majorité des visites. Les problèmes qui ne se voient que sur mobile passent donc inaperçus pendant des mois, alors qu’ils touchent une grande partie des visiteurs.
Voici les sept pièges que nous rencontrons le plus souvent.
1. Les boutons et les liens trop petits
Avec une souris, on clique précisément. Avec le doigt, beaucoup moins. Des liens collés les uns aux autres, une petite croix pour fermer une fenêtre ou des pastilles de couleur minuscules sur une fiche produit deviennent difficiles à toucher. Prévoyez des zones cliquables assez grandes (environ la taille du bout d’un doigt) et un espace suffisant entre elles.
2. Le pop-up qui couvre tout l’écran
Le pop-up d’inscription ou de code promo, discret sur un grand écran, occupe tout l’écran d’un téléphone. Si sa croix de fermeture est minuscule ou sort de l’écran, le visiteur part. Google pénalise d’ailleurs les fenêtres envahissantes qui empêchent d’accéder au contenu sur mobile.
3. Le bouton « Ajouter au panier » trop bas
Sur mobile, la photo, le titre et le prix occupent déjà tout l’écran. Le bouton d’achat se retrouve souvent sous la ligne de flottaison, après plusieurs gestes de défilement. Vérifiez qu’il est visible rapidement, ou qu’il reste accessible en bas de l’écran pendant que l’on fait défiler la page.
4. Le formulaire qui zoome tout seul
Sur iPhone, lorsque le texte d’un champ de formulaire est trop petit, la page zoome automatiquement au moment où l’on tape. Le client doit ensuite dézoomer pour retrouver le bouton de validation. Un texte d’au moins 16 pixels dans les champs évite ce problème.
5. Le mauvais clavier
Pour saisir un numéro de téléphone, le client devrait voir s’afficher un clavier numérique ; pour une adresse e-mail, un clavier avec l’arobase. Quand les champs ne sont pas correctement paramétrés, il doit jongler entre les claviers. C’est un petit détail, mais il se répète à chaque commande.
6. Les tableaux et les images qui débordent
Guides des tailles, tableaux de prix, visuels avec du texte : ce qui est lisible sur un écran large devient illisible ou déborde sur le côté d’un téléphone. Le visiteur doit zoomer et faire défiler la page dans tous les sens.
7. Le numéro de téléphone qu’on ne peut pas toucher
Sur mobile, un client qui veut vous appeler s’attend à toucher votre numéro pour lancer l’appel. S’il est écrit dans une image ou en texte simple, il doit le retenir et le recopier. Rendez votre numéro et votre adresse e-mail cliquables.
Ce qu’il faut faire
- Faites un parcours d’achat complet sur votre propre téléphone, de la page d’accueil jusqu’à la confirmation de commande.
- Demandez à un proche de faire de même sur un autre modèle de téléphone (iPhone et Android n’affichent pas toujours les pages de la même façon).
- Notez chaque moment où vous avez dû zoomer, chercher un bouton ou recommencer un geste.
- Corrigez d’abord les problèmes du panier et du paiement : ce sont eux qui coûtent le plus de ventes.
Et sur votre site, qu’est-ce qu’un audit trouverait ? Envoyez-nous son adresse et demandez un aperçu gratuit, sans engagement.