web-dev-qa-db-fra.com

Une page "Aperçu" doit-elle être une fenêtre contextuelle ou sur la même page?

Nous avons actuellement une page qui affiche un aperçu d'une autre page (newsletter) sur un iFrame au moment où le fichier est téléchargé.

Est-ce mieux que de fournir un bouton qui dit "Aperçu", qui, lorsque vous cliquez dessus, ouvrira la page d'aperçu dans un onglet pop-up/nouvel?

Je pose cette question car bien que l'actuel que nous avons supprime l'étape supplémentaire de cliquer sur "Aperçu" (car ils le voient immédiatement sur la même page), je me sens distrait par les autres éléments de l'interface utilisateur entourant la section "Aperçu". De plus, il y a deux barres de défilement (le navigateur et l'iFrame). Et aussi, je verrais toujours l'aperçu même si je n'en ai pas besoin si je suis sur cette page.

Contrastez qu'en voyant l'aperçu sur un nouvel onglet ou une fenêtre contextuelle, je vois l '"Aperçu" seul. Je trouve plus facile de revoir la page "aperçu" bien que je devais cliquer sur un bouton avant de le voir. Et je ne le vois que quand je le veux.

Existe-t-il des directives UX à ce sujet? Une fenêtre contextuelle est-elle meilleure dans cet exemple?

1
catandmouse

Si un aperçu n'est pas une étape obligatoire et pas si fréquent, ne forcez pas un utilisateur à le regarder. Le bouton "Aperçu" est une bonne décision dans ce cas. Le point UX ici est de ne pas surcharger l'utilisateur avec des étapes secondaires (facultatives) mais de lui donner le contrôle pour le faire.

Pour minimiser la distraction, il est bon d'afficher le bulletin d'information dans une fenêtre contextuelle, en observant l'extérieur. Cette option est préférable à l'affichage dans un nouvel onglet pour les raisons suivantes:

  • Un nouvel onglet pourrait interrompre le flux. Après sa fermeture, il n'y a aucune garantie de revenir à l'onglet précédent (si plusieurs onglets sont ouverts).
  • Un nouvel onglet pourrait être bloqué par des plugins de blocage des publicités.
  • Aucun onglet de fermeture de fermeture ne pourrait créer un tas d'aperçus et l'utilisateur pourrait y perdre et le navigateur pourrait diminuer ses performances.
2
Alexey Kolchenko

Mes 2 cents:

Dépend de ce que vous voulez faire sur la page d'aperçu et de l'appareil sur lequel cet aperçu est censé être affiché

- si l'appareil est mobile ou tablette et que vous souhaitez une fonctionnalité d'impression, optez pour une fenêtre contextuelle avec une instruction dont l'utilisateur a besoin pour fermer la fenêtre lui-même. Étant donné que la fonctionnalité d'impression est susceptible de recharger à nouveau l'application en mode d'aperçu sur la plupart des appareils mobiles, en particulier Android appareils. Aussi Android ne prennent pas en charge la fenêtre de fermeture automatique) opération (preuve - voir connexion facebook sur Android)

- si l'appareil est un ordinateur de bureau ou un ordinateur portable, la fenêtre activée par iFrame ou DHTML est correcte tant que le développeur a pris soin de supprimer les nœuds inutilisés du DOM après la fermeture de la fenêtre contextuelle.

- si l'appareil est un ordinateur de bureau ou un ordinateur portable et si l'aperçu est un aperçu avant impression et que le style est complètement différent du site réel (conçu spécialement à des fins d'impression, par exemple la facturation), le pop-up

- Pour la prévisualisation des e-mails, la prévisualisation des messages sur les forums, etc.

0
ripu1581

La convention la plus courante que je vois est un petit aperçu (miniature) avec la possibilité d'agrandir l'aperçu en cliquant dessus. Concernant les images, cette approche est utilisée dans Windows, OSX, Facebook, Twitter, Reddit et bien d'autres. La petite image donne à l'utilisateur une idée générale de ce qu'il regarde, et l'utilisateur peut cliquer sur l'image pour l'agrandir afin de rassembler tous les détails associés à l'image.

0
Keiwes

Vous pouvez initialement afficher votre page avec le lien "Afficher l'aperçu" quelque part et un iframe caché. Lorsque l'utilisateur clique sur ce lien, vous affichez votre aperçu directement sous ce lien sur la même page et changez le lien en "Masquer l'aperçu".

0
Serg