Pop-ups: quand et quand ne pas utiliser?
En tant que développeur web, je joue beaucoup avec les popups. Tellement qu'il semble que sur chaque projet sur lequel je travaille, il y a toujours au moins une grande discussion parmi les développeurs (et les PM) sur les popups et quand nous devons les utiliser, quelles données afficher dans une popup, etc. et je reçois toujours le sentiment que l'utilisation de popups sur un site Web est en quelque sorte abusée.
Par exemple, une fenêtre contextuelle pourrait résoudre un problème d'édition de données assez rapidement (à la fois par programme pour les développeurs et pour que l'utilisateur fasse ce qu'il doit faire, ou du moins c'est ce que nous pensons), ou souvent une fenêtre contextuelle est quelque chose que le client veut, mais ces cas peuvent ne pas être appropriés À résoudre par une solution de type popup. En tant que développeur, je recherche les meilleures pratiques ou les règles de base concernant les popups:
Quand devrions-nous utiliser une fenêtre contextuelle, UX/UI sage?
Quels sont les avantages et les inconvénients de l'utilisation d'une fenêtre contextuelle?
Pour l'utilisateur, que signifie utiliser une popup? L'utilisation d'un popup implique-t-elle quelque chose sur l'action à suivre?
Eh bien, pour commencer, définissons nos termes. Il existe un certain nombre de choses différentes sur le Web qui sont appelées "popups":
- Fenêtres de navigateur séparées, généralement définies à une taille spécifique avec une réduction du chrome du navigateur
- Éléments flottants dans la fenêtre, dont l'apparence est déclenchée par l'utilisateur, qui couvrent une partie relativement petite de l'écran, souvent avec une petite flèche pointant vers l'élément qui a déclenché sa visibilité
- Éléments flottants dans la fenêtre qui couvrent la majorité de l'écran (soit par eux-mêmes, soit en `` atténuant '' le reste de la page avec une superposition semi-transparente), et bloquent les autres fonctionnalités de la page jusqu'à ce qu'elles soient fermées. (Ce dernier est plus correctement appelé "modal", mais le terme popup est souvent utilisé à mauvais escient pour lui.)
Chacun d'eux a des objectifs différents, et chacun a ses propres avantages et inconvénients:
La fenêtre de navigateur séparée "popup"
Cela était beaucoup plus utile dans les premiers jours du Web, lorsque les techniques de script et de mise en page permettant les autres options n'existaient tout simplement pas encore. Ce type présente des inconvénients importants: il se perd facilement derrière la fenêtre principale, en particulier pour les utilisateurs qui naviguent en plein écran; il fonctionne mal sur les appareils mobiles pour des raisons évidentes; vous devez construire de manière évidente pour rouvrir le popup si l'utilisateur le ferme accidentellement; et plus important encore, de nombreux utilisateurs ont configuré leur navigateur pour simplement le bloquer complètement, ou le fermeront immédiatement sans même regarder (car il a été utilisé à des fins publicitaires pendant de nombreuses années.) Cette technique est largement obsolète, à une seule exception près: contrairement à la d'autres types, cette forme de popup peut persister même si l'utilisateur navigue vers différentes pages dans la fenêtre "principale"; il existe des cas d'utilisation étroits où cela est utile.
La "popup" dans le navigateur
En règle générale, utilisez-les pour des informations ou des fonctionnalités qui:
- est petit et autonome (ne l'utilisez pas pour de gros morceaux de contenu ou des formulaires en plusieurs étapes par exemple)
- est spécifiquement lié à un élément particulier déjà à l'écran (qui servira de déclencheur pour afficher le popup)
- est facultatif (si l'utilisateur doit ouvrir le popup à chaque fois, alors son contenu appartient probablement en ligne)
- encombrerait la page si son contenu était mis en ligne (celui-ci, je dois l'admettre, est une exigence plutôt floue; cela dépend un peu du contexte en fonction du contenu de la fenêtre contextuelle, de la mise en page globale et de la quantité de fonctionnalités et de contenu déjà visible ailleurs sur la page)
- est un seul élément autonome, et non pas un ensemble d'éléments liés (auquel cas un accordéon ou une sous-vue à onglets peut être plus approprié)
La "popup" pleine page
Les modaux sont interruptifs, il faut donc les utiliser le moins possible, et uniquement pour les éléments avec lesquels l'utilisateur doit interagir avant de continuer - accords de licence ou murs payants par exemple. Ils ne doivent pas être utilisés pour des processus pas à pas - dans ces cas, une simple navigation pas à pas est plus appropriée - la seule raison pour laquelle les modaux ne sont pas en plein écran est d'indiquer à l'utilisateur que lorsque le modal sera fermé, ils seront retournés à ce qu'ils regardaient. avant l'ouverture du modal. (Si ce n'est pas le cas, n'utilisez pas de modal, utilisez à nouveau une ancienne navigation.)
Les popups modaux sont de plus en plus utilisés à des fins publicitaires (soit des publicités tierces, soit des auto-publicités de type "abonnez-vous maintenant!"). C'est un acte intrinsèquement hostile aux utilisateurs (la conception web est devenue de plus en plus hostile aux utilisateurs dans ces dernières années) et est en grande partie la raison pour laquelle les guerres de blocage des publicités se réchauffent si rapidement.
Personnellement, je crois que cela échange un gain à court terme (oui, un certain pourcentage d'utilisateurs "s'abonneront maintenant" qui autrement n'auraient pas pu le faire) contre une catastrophe à long terme (les utilisateurs, en règle générale, n'aiment pas être ennuyés ou interrompus. ) S'engager dans ce type de comportement forme essentiellement vos utilisateurs à utiliser des bloqueurs de publicités au lieu de visualiser le Web sans filtrage, ce qui nuit finalement à tout le monde; et cela encourage un certain pourcentage d'utilisateurs à cesser tout simplement de visiter votre site.
Voici un très joli résumé de NNGroup
- L'utilisateur est sur le point de prendre une mesure qui a de graves conséquences et est difficile à inverser.
- Il est essentiel de collecter une petite quantité d'informations avant de laisser les utilisateurs passer à l'étape suivante d'un processus.
- Le contenu de la superposition est urgent et les utilisateurs sont plus susceptibles de le remarquer dans une superposition.
Il y a deux raisons principales pour lesquelles ils fonctionnent (Avantages):
Les lecteurs et les visiteurs de vos pages ont une courte durée d'attention. Ils
ne peut pas s'abonner ou soumettre des informations sur les prospects non pas parce qu'ils ne le font pas
comme ce qu'ils voient, mais parce qu'ils ont été distraits, s'ennuient,
ou vous ne disposez pas d'un bouton d'appel à l'action clair. Interruption des fenêtres contextuelles
leur départ, mettant en avant et au centre une opportunité d'engagement.Les lecteurs et les visiteurs se concentrent sur votre précieux contenu. Les gens concentrés sur une certaine tâche éprouvent quelque chose appelé "cécité par inattention", ce qui signifie qu’ils ne remarquent pas quelque chose d’évident quand ils se concentrent sur quelque chose de spécifique. Les fenêtres contextuelles brisent la cécité par inattention et encouragent une conversion qui aurait pu se produire si votre visiteur avait pu voir votre "demande".
Inconvénients de l'utilisation de fenêtres contextuelles
1 . De nombreux visiteurs, en particulier ceux qui connaissent les technologies Internet, n'aiment pas les fenêtres contextuelles. Certaines personnes les détestent tellement, elles quitteront immédiatement un site avec une fenêtre contextuelle.
2 . Certaines fenêtres contextuelles, en particulier celles qui contiennent des scripts, peuvent ralentir le temps de chargement de votre page, ce qui est un facteur dans les conversions ainsi que dans le référencement.
3 . Rien de moins que le bon message au bon moment peut être ennuyeux et distraire les visiteurs de leur expérience.
Veuillez vous référer à cette lien pour en savoir plus sur les popups.