12 habitudes Web que nous devons déjà abandonner

J’ai passé près de 30 ans dans le Web et le numérique, commençant à l’époque où le « World Wide Web » regorgeait de en construction GIFs, Balises et compteurs de visiteurs! Personne ne manque ces choses !

Même si de nombreuses mauvaises expériences utilisateur ont disparu, certains désagréments quotidiens doivent encore disparaître. Dans l’esprit de SeinfeldDans le cadre de la « diffusion des griefs », voici 12 tendances web qui doivent prendre fin en 2025 !

NOTE: Cette liste met en évidence les problèmes avec de meilleures alternatives, il n’y a donc aucune excuse pour ne pas les résoudre !

1. Faux écran squelette

Le problème : De nombreux sites Web et applications utilisent écrans squelettes – des cases et des lignes comme espaces réservés – pour donner l’impression que les pages se chargent plus rapidement. Cependant, trop de sites ont abandonné la cohérence et leur mise en page ne correspond pas au contenu final.

Le correctif : Assurez-vous que votre équipe Web met à jour l’écran squelette chaque fois que la conception de la page change. Idéalement, créez le squelette avec la structure HTML réelle et utilisez CSS pour le style avant et après le chargement du contenu.

2. Précharger, disparaître et recharger

Le problème : Vous ouvrez un nouvel écran, voyez le contenu pendant un instant, puis – POOF ! – il disparaît. Vous vous retrouvez avec un écran vide jusqu’à ce que le même contenu ou un nouveau contenu réapparaisse, perdant souvent ce qui a initialement attiré votre attention.

Le correctif : Ce problème survient lorsque JavaScript charge du contenu après le chargement initial de la page. Pour éviter cela, ajoutez une logique de codage pour empêcher la suppression du contenu existant. Au lieu de cela, chargez le nouveau contenu uniquement lorsque l’utilisateur le demande (en faisant défiler ou en cliquant sur Actualiser) ou ajoutez-le au contenu existant sans perturber la vue de l’utilisateur.

3. Changements de mise en page pendant le chargement de la page

Le problème : Changements de disposition sont suivis par de nombreux outils de performance Web. Alors que les sites à chargement rapide minimisent ce problème, les pages à chargement lent peuvent conduire à des expériences frustrantes, comme le réemballage du texte ou le déplacement inattendu des boutons.

Le correctif : Les équipes doivent gérer le moment où le contenu est chargé via JavaScript. L’utilisation du rendu côté serveur peut garantir que la page se charge avec un contenu complet. Pour le nouveau contenu ajouté après les interactions des utilisateurs, concevez un moyen de l’afficher de manière prévisible. De plus, incluez toujours les attributs de hauteur et de largeur pour les images et les ressources afin d’éviter les changements de disposition lors du chargement initial.

4. Effets de survol qui déplacent les éléments

Le problème : Cette expérience frustrante se produit lorsque les interactions des utilisateurs conduisent à un comportement inattendu. Par exemple, le survol d’une icône de développement/réduction peut ouvrir automatiquement une barre latérale, obligeant les utilisateurs à cliquer par inadvertance sur des liens qu’ils n’avaient pas l’intention de cliquer.

Le correctif : Évitez d’animer des éléments volumineux ou de modifier les mises en page en survol. Si vous devez utiliser ce comportement, assurez-vous que tout contenu nouvellement animé n’est pas cliquable. Un clic mort est préférable à un chargement de page accidentel.

5. Fenêtres contextuelles de chargement de plusieurs pages

Le problème : Vous visitez un nouveau site désireux d’explorer, mais vous êtes immédiatement frappé par une bannière de cookies, un chatbot et une inscription à la newsletter qui couvre le contenu principal. Il s’agit d’un cas classique de « tout est important ».

Le correctif : Reconnaissez que tout ce que vous souhaitez communiquer n’est pas important pour l’utilisateur. Donnez la priorité aux messages les plus importants et utilisez la logique de codage pour contrôler quand et comment ces distractions apparaissent. Vous pouvez afficher une fenêtre contextuelle une fois que les utilisateurs sont sur la page depuis un certain temps, mais évitez de la placer sur le contenu qu’ils essaient de lire.

6. Déception des appâts à clics

Le problème : Appât à clics les titres sont partout parce qu’ils fonctionnent, mais ils conduisent souvent à des déceptions. Vous cliquez sur un titre comme «Le Web est-il mort ?!?» pour découvrir que le contenu ne correspond pas – laissant une conclusion fade que le Web est bel et bien vivant.

Le correctif : Visez l’authenticité. En vous concentrant uniquement sur des mesures personnalisées telles que les clics et les vues, vous risquez d’induire votre public en erreur. Suivez la « règle d’or » en traitant vos lecteurs comme vous souhaiteriez être traité. Écrivez d’abord votre article, puis créez un titre approprié, en évitant complètement les tactiques frauduleuses. Ou si vous voulez vraiment un titre choquant, faites l’effort d’avoir un contenu qui en vaut la peine (sans être trompeur).

7. Lecture automatique de vidéos avec son

Le problème : De manière inattendue, la lecture automatique de vidéos avec son peut être choquante, surtout si l’utilisateur se trouve dans un endroit calme ou écoute déjà autre chose. Cela crée une expérience chaotique.

Le correctif : Évitez d’être envahissant. Ce que vous voulez peut ne pas correspondre à ce que votre utilisateur préfère. Même si vous ne recevrez peut-être pas d’éloges explicites pour avoir coupé le son des vidéos en cours de chargement, irriter votre public pourrait le faire fuir.

8. Voler la concentration de manière inattendue

Le problème : Page web les éléments peuvent avoir le focusgénéralement pour les champs de formulaire ou les éléments interactifs. Définir correctement le focus peut améliorer l’expérience utilisateur, mais utiliser JavaScript pour changer le focus une fois que les utilisateurs ont interagi avec d’autres parties de la page peut être extrêmement ennuyeux.

Le correctif : Utilisez les attributs HTML intégrés pour définir le focus sur un élément lors du premier chargement de la page. Soyez prudent avec les changements de focus JavaScript qui ne devraient se produire qu’en réponse aux actions de l’utilisateur, comme cliquer sur un bouton pour ouvrir un modal. Ceci est également important pour l’accessibilité et la navigation au clavier.

9. Des formulaires qui veulent tout

Le problème : La recherche montre que les formulaires plus courts se convertissent mieux. Les formulaires longs qui nécessitent un défilement peuvent sembler accablants. Par exemple, une inscription à une newsletter par e-mail ne doit demander qu’une adresse e-mail. Vous n’avez pas besoin d’un nom d’entreprise ou d’un numéro de téléphone immédiatement.

Le correctif : Même si votre entreprise souhaite collecter des informations détaillées, envisagez d’utiliser des méthodes alternatives telles que profilage progressif. Cette approche améliore l’expérience utilisateur et encourage un engagement continu sans surcharger les utilisateurs dès le départ.

10. Erreurs de forme prématurées

Le problème : La validation des entrées utilisateur est cruciale pour garantir une saisie correcte des données, comme les formats de courrier électronique et la sécurité des mots de passe. Même si la validation en temps réel peut améliorer l’expérience utilisateur, elle devient frustrante si des erreurs sont signalées avant que les utilisateurs aient fini de taper.

Le correctif : Évitez de marquer la saisie comme incorrecte trop tôt. Par exemple, si un champ email devient rouge après le deuxième caractère, cela perturbe le flux. Utilisez plutôt des événements « changement » ou « flou » pour valider la saisie uniquement une fois que l’utilisateur a fini de saisir ses informations.

11. Entrée de formulaire oubliée

Le problème : La validation des entrées utilisateur sur la page est utile, mais la validation côté serveur est essentielle pour la sécurité. Lorsque le serveur détecte une erreur, il renvoie souvent les utilisateurs vers le formulaire. Si cela est mal fait, cela peut effacer leur entrée précédemment saisie. Cela peut être incroyablement frustrant !

Le correctif : Implémentez une logique de codage pour conserver la saisie originale de l’utilisateur lors de l’actualisation de la page. Même si vous devrez peut-être exclure des informations sensibles telles que des mots de passe ou des numéros de carte de crédit, la préservation des autres entrées permettra d’éviter de punir les utilisateurs pour des erreurs mineures.

12. Cibles des liens externes

Le problème : Il peut être frustrant de cliquer sur un lien pour quitter le site actuel, surtout si vous n’avez pas fini de lire le contenu. Vous avez souvent envie de revenir là où vous vous êtes arrêté, et vous risquez d’être complètement distrait et de ne jamais revenir.

Le correctif : Bien que les utilisateurs puissent ouvrir manuellement des liens dans de nouvelles fenêtres, cela ajoute des efforts inutiles. Les auteurs de contenu peuvent définir les liens pour qu’ils s’ouvrent dans une nouvelle fenêtre en utilisant la cible « vierge ». Une solution encore meilleure consiste à utiliser une simple fonction JavaScript qui ajoute automatiquement cet attribut cible aux liens menant à différents domaines. Cette approche discrète garantit une expérience utilisateur plus fluide, même si les auteurs oublient de la définir.

Conclusion

Nous sommes souvent tellement concentrés sur nos objectifs et nos indicateurs que nous négligeons l’aspect humain de l’expérience utilisateur. De nombreux utilisateurs « vivent simplement avec » de mauvaises expériences et ne peuvent se plaindre qu’à eux-mêmes. Je suis fan de ravir les utilisateurs et d’éliminer les frustrations inutiles.

J’espère que partager ce qui « me fait travailler » nous incitera tous à améliorer l’expérience utilisateur sur le Web. Avec l’esprit de De fête à l’esprit, exprimons nos doléances sur le Web et engageons-nous à faire mieux au cours de la nouvelle année !

……

Si vous recherchez un partenaire numérique soucieux d’une expérience utilisateur de qualité, contactez votre responsable de compte Perficient ou utilisez notre formulaire de contact pour entamer une conversation.