web-dev-qa-db-fra.com

Images cliquables et non cliquables sur la même page

Dans mon portfolio, j'ai des études de cas, où j'explique un peu de mes projets et place des images de différentes tailles avec le texte. Alors que dans certaines images plus petites, l'utilisateur est en mesure de cliquer et d'afficher la grande version, d'autres images sont suffisamment claires sur la page (sans cliquer, l'utilisateur peut voir l'image dans presque sa taille d'origine). Mes options sont donc:

  1. différencier les images cliquables et les images non cliquables (je ne voulais pas le faire car cela ne serait pas si bon quand, par exemple, dans une colonne, vous avez une image avec une bordure et sur une autre une image sans)
  2. rendre tout cliquable même si certaines images lors du zoom ne feront que répéter l'image
  3. gardez-le tel quel, certaines images seront cliquables et d'autres non.

La question est: Est-ce un vrai problème pour les utilisateurs? S'il y a une image suffisamment claire, essaieront-ils toujours de cliquer pour en voir une version agrandie? Seront-ils plus frustrés d'essayer de cliquer et il ne se passe rien, ou seront-ils plus frustrés de cliquer et de voir une image similaire? (devinez est plus un problème pour les utilisateurs d'appareils tactiles car ils n'auront aucun effet de survol)

3
Taly Emmanuela

Offrir non moyen de faire la distinction entre les images cliquables et non cliquables va créer de la confusion, et le fait que le clic n'offre aucun avantage causera de la gêne, donc je pense que vous êtes coincé à fournir un moyen d'identifier qui les images sont cliquables et qui ne le sont pas.

Comme alternative aux bordures (qui, je suis d'accord, pourraient paraître désordonnées), vous pouvez ajouter une icône de loupe dans le coin des images qui sont cliquables:

thumbnail without iconthumbnail with icon

Une deuxième alternative serait d'ajouter des bordures à toutes les images, mais de les différencier par la couleur:

thumbnail with grey borderthumbnail with blue border

... mais il y a un compromis à faire entre faire la différence trop choquante et la rendre perceptible pour les personnes avec par exemple daltonisme.

7
user21395

Penser à l'objectif final pour l'utilisateur - c'est de voir une version plus grande. Sur un écran tactile, l'instinct initial pourrait être de faire une action multi-touch étalée pour effectuer un zoom avant pour voir l'image plutôt que l'action du simple toucher. Ce serait une solution intéressante pour remplacer l'image miniature par la grande image lorsque vous détectez l'événement afin que l'image agrandie zoomée ne soit pas un gâchis pixélisé.

Je n'ai jamais vu cela se faire auparavant et quelques requêtes Google n'ont rien donné. Quelqu'un a-t-il déjà expérimenté cette approche?

Le plus grand défi serait que les utilisateurs n'effectuent pas toujours cet événement multitouch sur l'image elle-même, donc lorsqu'il y en a plusieurs sur une page, vous devrez tous les remplacer ou déterminer lequel remplacer.

0
designninja