Combien de fois avez-vous été sur un site Web, seulement pour quitter frustré et agacé par l'expérience que vous avez reçue lors de votre visite? Croyez-le ou non, c'est un phénomène assez courant, en particulier lorsque les sites Web ignorent les bonnes pratiques UX.

Si vous êtes impliqué dans l'un des aspects de la création d'un site Web, il est impératif d'éviter les problèmes UX courants, si vous souhaitez rester dans les bons livres de vos utilisateurs. Jetons un coup d'œil aux quatre pièges UX les plus courants auxquels les concepteurs sont confrontés et à la manière de les éviter ...

Formes

Les formulaires sont nécessaires pour collecter des informations sur les utilisateurs, les clients et les clients. Vous ne pouvez pas les utiliser, mais ils ne devraient pas être insupportables à remplir. Les formulaires devraient avoir très peu de questions sur les informations qu'un site Web recherche. L'un des plus gros problèmes des formulaires en ligne est l'absence d'instructions.

Mise en forme

Lorsque vous demandez à quelqu'un des informations spécifiques, insistez sur ce que vous recherchez. Si vous avez besoin d'un format spécial pour quelque chose, comme une date, une heure ou toute autre information formatée, il devrait être accompagné d'un exemple. Rien n'est plus ennuyeux que de remplir un formulaire, mais de recevoir un message d'erreur lorsque vous avez terminé.

espace réservé-texte

Texte d'espace réservé

C'est bien quand un designer va un peu au-delà et vous donne un indice sur le type d'informations qu'il recherche, en fournissant un texte de substitution dans le champ de formulaire. Bien que ce soit extrêmement pratique, il m'est arrivé plusieurs fois de rencontrer du texte d'espace réservé qui ne disparaît pas lorsque vous commencez à taper dans le champ de formulaire. C'est un énorme point de frustration pour tout utilisateur, car il doit arrêter de taper, tout sélectionner et le supprimer, recommençant tout. Ils peuvent également sélectionner le type inutile et le supprimer, provoquant une interruption de leur processus de réflexion tout en remplissant le formulaire. Lorsque vous utilisez le texte d’espace réservé pour obtenir des informations sur le type d’informations que vous recherchez, assurez-vous qu’il disparaît lorsque quelqu'un sélectionne ce champ de saisie.

Messages d'erreur

Il n'y a rien de plus frustrant que d'essayer de faire quelque chose sur un site Web, seulement pour recevoir un message d'erreur, sans assez d'informations, ou pas du tout. Si un utilisateur de site Web rencontre une erreur, il doit y avoir une explication de ce qui est incorrect et comment le résoudre. Par exemple, si vous vous connectez à un site avec un nom d’utilisateur et un mot de passe, si vous commettez une erreur avec un site, vous devez savoir lequel. Avec autant de connexions aux sites Web, il est facile d'accumuler de multiples variantes de noms d'utilisateur et de mots de passe. Il y a eu des cas où j'ai dû modifier ma combinaison usuelle de nom d'utilisateur et de mot de passe, car elle ne répondait pas aux exigences d'enregistrement d'un site Web, telles que 2 lettres majuscules, un chiffre, une lettre et un signe.

D'autres exemples pourraient inclure: si les mots de passe ne correspondent pas, lors du processus d'enregistrement, afficher un message d'erreur avant de le soumettre. Un autre exemple pourrait être que si un nom d'utilisateur est déjà pris, montrez-le avant que quelqu'un soumette son enregistrement.

Personne n'aime devoir refaire quelque chose, surtout après avoir reçu de mauvaises instructions. Votre engagement sera beaucoup plus important si vous permettez aux utilisateurs de vous fournir facilement les informations correctes la première fois.

Grands en-têtes de navigation fixes

Je ne sais pas comment cela est devenu populaire, mais je l'ai beaucoup vu, sur de nombreux sites sur le web. Le problème avec un en-tête de cette taille et tous ces éléments de navigation est que lorsque vous faites défiler la page, il bloque beaucoup de contenu. Cela est particulièrement frustrant lorsque vous devez accéder à des composants ou que le contenu remplit normalement la hauteur du navigateur, mais une partie est masquée par la navigation.

Surtout sur mobile

Ce qui est encore pire, c'est que parfois, lorsqu'un site est ramené à une taille mobile, l'en-tête de grande taille reste toujours en place. C'est une mauvaise expérience, car l'espace est déjà limité sur les écrans de smartphone. Il n'a pas besoin d'être pris en charge par un menu de navigation qui pourrait autrement être caché. Si certains éléments de navigation doivent rester visibles, transformez-les en petites icônes ou placez-les à l'écart.

Faible contraste

Mes yeux sont bons, mais je ne suis pas fan d'essayer de discerner visuellement le texte ou les icônes au fusain sur un fond noir. Personne ne devrait avoir à passer par là. Le contraste est essentiel, en particulier dans la conception de sites Web.

squarespace

Texte

Tout texte doit être facile à lire, avec suffisamment de poids pour le rendre facile à lire. 100 polices de poids n'ont pratiquement aucune place sur le Web (sauf dans quelques cas particuliers). Utiliser une police super mince sur un smartphone demande simplement des problèmes. Il doit y avoir suffisamment de contraste visuel pour que vos yeux puissent distinguer les lettres.

Couleur

Pour tous les éléments d’un site Web, le contraste entre les couleurs doit être facilement discernable. Tout texte doit avoir un fort contraste par rapport à son arrière-plan. Cela vaut également pour les liens, les éléments de navigation ou les icônes. Il ne devrait pas être difficile de trouver ce que vous recherchez.

Appels aux actions

Tout comme les autres liens et éléments de navigation, vos éléments d'appel à l'action doivent afficher un niveau de contraste élevé. Si vous souhaitez qu'un visiteur du site Web agisse, rendez-le visible, facile à lire et à charger. Trop souvent, vous verrez un appel à l'action avec un bouton qui ne se démarque pas suffisamment de l'arrière-plan. Parfois, ce n'est pas du tout un bouton, et il ne s'agit que d'un simple lien de texte entouré d'espaces blancs.

Toucher des cibles sur un mobile

Je le vois sur beaucoup de sites mobiles et c'est l'un des éléments les plus frustrants à traiter. Si vous avez un bouton ou un lien sur lequel cliquer, attribuez-lui suffisamment d'espace pour que les utilisateurs ne frappent pas accidentellement la mauvaise chose. Sur un smartphone, assurez-vous que les boutons ou les liens sont suffisamment éloignés du bord ou du coin de l’écran pour pouvoir être facilement exploités.

Souvent, un bouton placé trop près des 4 coins d’un écran est trop difficile à taper avec précision. Si vous avez de gros doigts, le smartphone risque de ne pas enregistrer votre action du tout. Cela oblige l'utilisateur à appuyer plusieurs fois pour que la fonctionnalité fonctionne. L'espace pour ces éléments est extrêmement important.

cibles tactiles

Conclusion

Ces problèmes UX courants peuvent être facilement évités avec un peu de travail supplémentaire et de prévoyance. Si vous souhaitez que les visiteurs de votre site Web utilisent et apprécient votre site, il est important de rendre le processus simple et fluide. Éviter que vos utilisateurs répètent des actions et des processus encore une fois réduit la frustration et fournit l'expérience utilisateur que tout le monde attend d'un site bien conçu.

L'image sélectionnée, Image de conception UX via Shutterstock.