C’est incroyable de voir comment les téléphones portables sont devenus nos acolytes; chaque jour, il devient plus difficile de les laisser dans un tiroir à la maison. Des activités comme les achats en ligne, l’enregistrement avec la famille et les amis, la gestion de nos entreprises et les réseaux sociaux font des appareils mobiles un outil important dans notre vie quotidienne.

En tant que vendeur en ligne, il est de votre devoir de fournir la meilleure expérience et le meilleur support à vos acheteurs lorsqu’ils interagissent avec votre site Web et vos produits. Une expérience simple et transparente peut renforcer la confiance et la fidélité, ce qui peut entraîner des taux de conversion élevés pour votre entreprise.

L’interaction d’un client avec votre site Web peut varier en fonction de nombreux facteurs, notamment le service client, la vitesse de chargement du site Web, la conception du site, etc. Un aspect clé de la conception de l’expérience utilisateur sur un appareil mobile est la zone pouce.

Qu’est-ce que la zone du pouce?

La zone du pouce est essentiellement la « zone de sécurité » sur un appareil mobile où les pouces sont les plus à l’aise lorsqu’ils interagissent avec l’écran. Le terme a été inventé pour la première fois par Steven Hoober, un expert des interfaces mobiles. Hoober a constaté que 49% des personnes comptent sur une poignée à une main pour soutenir leur téléphone, tandis que 75% utilisent leur pouce pour effectuer des tâches facilement.

L’image ci-dessus montre la zone de la zone du pouce sur l’écran d’un iPhone, lorsque l’utilisateur est droitier. La zone verte est la zone du pouce, la zone la plus confortable pour une interaction naturelle. La zone jaune est l’endroit où le pouce s’étire et la zone rouge «Aïe» est difficile et inconfortable à atteindre pour la plupart des utilisateurs.

Bien que la définition de Hoober de la zone du pouce se réfère spécifiquement à l’utilisation à une main, nous devrions viser à inclure ceux qui utilisent les deux mains et qui sont gauchers ou droitiers. Lorsque les deux mains sont utilisées, la zone pour les pouces incluse ressemble à l’image ci-dessous.

Il est important de se rappeler que même s’il existe un modèle de comportement des utilisateurs, tout le monde n’interagit pas avec un site Web de la même manière. Placer les bons éléments aux bons endroits sur votre site peut jouer un rôle important dans l’expérience d’achat de vos clients.

Un autre aspect à garder à l’esprit est que la zone idéale du pouce peut varier en fonction de la taille d’un appareil mobile.

Observations réelles

Assis dans une salle d’attente, nous avons observé les différentes façons dont diverses personnes tenaient leur téléphone et essayaient d’extrapoler des informations sur leurs cas d’utilisation potentiels.

Par exemple, une personne a tenu son téléphone avec sa main gauche tout en touchant l’écran avec sa main droite, suggérant qu’il était soit à la recherche de quelque chose de spécifique nécessitant des filtres tactiles, soit en cochant des options sur une liste.

Une autre personne a tenu le téléphone avec sa main droite tout en faisant défiler avec ce même pouce, suggérant un balayage rapide dans un fil d’actualité des médias sociaux. Une vitesse de défilement plus faible aurait pu indiquer que la personne lisait, car nous essayons principalement de ralentir nos gestes lorsque nous sommes concentrés.

Pourtant, une troisième personne tenait son téléphone à deux mains, les doigts entrelacés dans le dos pour le soutenir, tandis que les deux pouces se déplaçaient tout autour de la moitié inférieure de l’écran du téléphone. Notre supposition? Taper rapidement un message sur le clavier du téléphone!

Maintenant, qu’est-ce que ces gestes ont à voir avec votre site Web de commerce électronique? Vos clients interagiront probablement avec votre site en utilisant tous ces différents gestes à un moment donné au cours de leur processus d’achat en ligne; connaître toutes les manières possibles de se comporter peut vous aider à perfectionner votre expérience sur le site Web.

Ce que vous pouvez faire pour réussir le test de la zone du pouce et satisfaire les clients

Positionnement

Lors de la conception d’un site Web, nous vous recommandons de placer les tâches importantes à portée de main. Les éléments qui devraient être facilement accessibles comprennent:

• liens populaires
• le menu de navigation
• bouton retour à la page d’accueil
• boutons d’appel à l’action (CTA) – ils sont particulièrement importants pour les magasins de commerce électronique, car ils incluent des actions telles que «Ajouter au panier»!

Bien qu’il n’y ait pas de règles de base pour savoir où placer ces tâches, les garder près du centre en bas d’une page donnée est la zone la plus accessible pour les gauchers et les droitiers.

Avoir un menu fixe en bas de l’écran est une autre façon de garder vos tâches importantes accessibles à vos clients et de leur faire gagner du temps pendant leur processus d’achat.

Espacement

Les éléments de votre site Web doivent pouvoir respirer et se démarquer de la page. Un espacement approprié permet de minimiser le risque que vos clients appuient par erreur sur le mauvais lien ou bouton, ce qui peut perturber leur expérience d’achat. Il maintient également le site propre et lisible.

À éviter

Il existe de nombreuses distractions qui peuvent rendre un site Web encombré et déroutant pour vos utilisateurs.

1. Défilement parallaxe est un effet amusant et tendance qui superpose 2 images pour créer un attrait 3D. Malgré son esthétique, sa fonctionnalité est très faible, notamment sur un appareil mobile, car les images ne sont pas liées à des pages ou des actions. Certains clients peuvent même percevoir le mal des transports lors du défilement, il est donc préférable de faire attention aux effets de mouvement. Au lieu de cela, envisagez de fournir plus de contenu non lié comme des images statiques, du texte ou des espaces blancs pour éviter les distractions liées à l’expérience d’achat. N’oubliez pas que si un élément n’ajoute pas de valeur à votre site ou contribue à la conversion, supprimez-le.
2. Placer le panier hors de portée et hors de vue. Maintenant que vous avez une meilleure compréhension de l’importance de la zone du pouce, essayez de positionner le panier dans la zone en haut ou sur un menu fixe en bas.
3. Menus « Hamburger » sont très courants sur la conception réactive. C’est généralement une icône composée de trois lignes horizontales qui représentent une navigation à gauche. Lorsque vous appuyez sur l’icône, elle se développe dans une liste de catégories et d’autres liens rapides à partir desquels naviguer. Dans de nombreux cas, la navigation de gauche s’ouvre tout en poussant le contenu du site Web vers la droite. Cela a tendance à maintenir les liens à l’extrême gauche de sorte que le pouce s’étire en essayant de les atteindre, ce qui entraîne une position inconfortable. Un solution possible consisterait à augmenter la taille de ces liens de catégories, les rendant ainsi plus faciles à atteindre. Une autre solution possible serait de s’assurer que la navigation dans le menu couvre l’écran lors de son ouverture, centrant la liste des catégories et en faisant l’objet de l’action suivante de l’utilisateur, sans avoir à partager l’espace d’écran avec d’autres contenus.

Principaux points à retenir

Un excellent service consiste à faire en sorte que vos clients se sentent à l’aise pendant leur séjour dans votre magasin. En cette ère de dépendance croissante à nos appareils mobiles, concevoir pour l’interaction naturelle de la zone du pouce avec un écran tactile peut être l’astuce pour fidéliser les clients.

Essayez toujours de vous assurer que votre site Web présente le contenu d’une manière qui garde la plupart des gestes dans la zone confortable du pouce, en évitant les étirements gênants et les éléments mal placés.

N’oubliez pas que parfois moins c’est plus. La meilleure stratégie pour éviter une expérience distrayante est de garder la conception de votre site propre et épurée. Visez à offrir une expérience d’achat simple et conviviale qui invite vos clients à revenir dans votre magasin.