Site mobile : 10 erreurs à éviter

Avec l’arrivée des smartphones, le m-commerce a commencé à se développer avant de prendre de plus en plus d’allure grâce à une connexion internet et une taille et qualité d’écran améliorées. Même si votre site n’est pas encore designé pour être vu sur mobile et tablette, il est probable qu’une personne ait déjà essayé d’y accéder via ces supports. Voici une liste de 10 erreur à ne pas commettre si vous souhaitez développer votre commerce sur le web mobile.

 

1. Une mauvaise priorité des éléments

L’espace restreint des écrans force les mobinautes à écourter leurs visites. Veillez à garder les éléments importants en tête de liste et ne pas cacher les offres trop bas dans vos pages sous peine qu’elles ne soient tout simplement pas vues. Évitez également les défilements sans fin, étrangement on a tendance à faire descendre toute la page avant de remonter, comme pour jauger le contenu.

 

2. Des boutons et liens trop petits

Apple a décrété une taille minimale des éléments sur mobile qui est de 44px. En-deçà et ça devient compliqué à l’utilisateur de cliquer dessus. N’oubliez pas de penser à ceux qui ont de gros doigts!
Laissez également assez de place entre chaque élément, bouton ou élément de menu, pour éviter les clics accidentels qui peuvent être frustrants.

calltoactionmobile

 

3. Ne pas alléger le poids des images

Un des problèmes des smartphones est qu’ils sont souvent utilisés à l’extérieur, où la connexion est parfois limitée.  Le temps de chargement d’une page est d’autant plus important sur smartphone, car l’utilisateur ne peut pas changer d’onglet en attendant qu’un autre se charge. Vérifiez bien que vous utilisez des images d’une taille très petite, pas la peine de les enregistrer au-dessus de 72ppp (points par pixels) et utilisez un format jpeg plutôt que png si l’image n’a pas de zone transparente.

 

4. Garder des éléments dont on peut se passer

Sur smartphone, il est parfois bon de ne pas inclure d’éléments qui peuvent ralentir la navigation et prendre de la place inutilement. N’hésitez pas à couper certaines parties du menu qui ne seraient pas lues, et déplacez-les plus bas dans la page, comme la partie CGV, qui sommes-nous et autres. Gardez l’essentiel et écourtez le parcours d’achat pour une expérience plus fluide et rapide.

 

5. Insérer des pubs trop grandes

Rien de pire pour faire partir un visiteur que de l’empêcher lire votre contenu. Parfois, certains sites ont des éléments tels que des widgets de réseaux sociaux, ou un retour en haut de la page qui s’insèrent sur le côté ou le bas de la page. Sur un écran large, ça ne pose pas de soucis, mais sur un écran de téléphone, ce widget prend aisément 20% de l’écran. Pensez à tester et désactiver certaines fonctionnalités ou modifier leur apparence dans la feuille de style de votre site mobile.

Pubs sur Mobile

 

6. Ne pas profiter des ressources HTML/CSS

Pourquoi utiliser des images ou un bouton en jpeg qui alourdiront la page quand un bout de code de quelque lignes fera l’affaire ? Contrairement aux images, le CSS sera plus simple et plus rapide à être lu par tous les navigateurs et sur tous les écrans. De plus, plus de problèmes de pixellisation présents ou d’image qui met du temps à charger.

Utiliser du code à la place d'images

 

7. Utiliser des fonctionnalités qui ne sont pas présentes sur mobile

Certaines fonctionnalités, comme des lecteurs vidéos intégrés à votre site, ou des animations flash, ne sont pas disponible sur smartphone. Évitez de montrer à vos visiteurs un écran vide où il aura l’impression que le site a eu un raté, ou encore un message d’erreur. Mettez à jour votre et assurez-vous que vos supports médias soient compatibles.

 

8. Avoir un contenu qui nécessite de zoomer ou dézoomer

Tout le monde n’a pas une vue d’aigle et si votre site nécessite de pincer l’écran pour zoomer ou dézoomer, il est temps de passer par votre fichier de style CSS ! C’est une expérience fastidieuse pour l’utilisateur et il risque d’abandonner alors sa visite. N’hésitez pas à augmenter la taille de votre police sur mobile ainsi que la taille d’espacement des lignes (propriété line-height), ce qui donnera une vue plus aérée de vos pages.

 

9. Un interstitiel dès l’entrée du site

Évitez les interstitiels prenant l’intégralité de la page, et apparaissant quelques secondes après l’arrivée du visiteur. Ce genre de pop-up interrompt le mobinaute dans sa visite et le pousse parfois à cliquer dessus par erreur, dû aux temps de chargement.

 

10. De mauvaises redirections d’URLS

Il arrive qu’en passant à la version mobile d’un site, on retourne sur la page d’accueil et non la page correspondante. Hors si vous perdez la page de l’utilisateur, il sera très dur de lui faire refaire son cheminement pour la retrouver à nouveau. Vérifiez bien que si un utilisateur se trouve sur la page d’horaires ou d’informations, qu’il y soit encore une fois passé au site mobile.

Mauvaise redirection URL mobile

 

Laissez un commentaire