web-dev-qa-db-fra.com

Rendre une page liée plus évidente?

J'ai un portfolio similaire à celui affiché ci-dessous. L'une des personnes à qui j'ai montré le portfolio m'a demandé si je pouvais mettre une version en direct du jeu/de la page Web en action, ou en avoir une vidéo. C'est exactement ce que j'ai lorsque vous cliquez sur le titre réel qui est un lien. Je me demande quelle est la bonne façon de rendre plus évident que vous pouvez cliquer sur le texte et être lié à une autre page?

enter image description here

4
ComputerLocus

Bons points sur le contenu du texte mais je ne suis pas d'accord sur le lien soulignement de lien - Je ne pense pas que la convention actuelle consiste à souligner les liens. Certainement pas lors de la liaison au sein du contenu d'un site que vous êtes essentiellement (c'est toujours votre contenu).

Le texte de soulignement a des problèmes pour lisibilité

Un magazine intéressant a résolu ce problème en rendant le soulignement plus subtil ... Je pense que cela fonctionne bien (d'autres endroits utilisent des lignes pointillées): subtle grey underline from smashing magazines website

La vérité est que Google mis à part, vous le voyez de moins en moins sur le web. Je pense que c'est principalement pour des raisons esthétiques. Demandez à la plupart des graphistes qu'ils diront la même chose. C'est devenu la convention. Le soulignement crée trop d'encre de données. Ça a l'air bruyant.

Au lieu de cela, certains sites utilisent le soulignement en survol comme ce site (StackExchange) et Apple. Pas vraiment sûr de la valeur de cela, car à ce stade, l'utilisateur a probablement déjà l'intention de cliquer (intéressé à savoir ce que les autres pensent).

La plupart des sites Web utilisent un changement de couleur pour indiquer un lien et la couleur choisie dépend des conventions graphiques sur le site. Facebook a fait un bon choix en choisissant le bleu comme couleur de signature car Google a déclaré avoir effectué le test définitif qui révèle que les liens bleus sont cliqués plus souvent ).

Ma règle d'or personnelle sur les sites Web est de faire en sorte que tout ce qui est cliquable soit de la même couleur (par exemple, les boutons et les liens) et qui sera l'une des couleurs clés du site.

Dans les applications Web, cela peut devenir plus complexe. Par exemple, comme je le note sur StackExchange, certains sites attachent des fonctionnalités différentes à différentes couleurs, par exemple le texte en gris est un lien vers les parties fonctionnelles de l'application Web et le bleu est un lien vers le contenu. Comme toujours, vous devez concevoir en fonction de votre contexte/complexité.

Donc, pour cet exemple, je mettrais simplement en évidence le texte du titre des deux liens en orange.

Mettre à jour Ajouter un bouton de lecture sur les images est également une bonne idée (comme suggéré par le commentaire de PhilW ci-dessous). De nombreuses recherches montrent que les gens ont tendance à ne pas lire le texte mais à faire attention aux images.

2
Lisa Tweedie

Les utilisateurs sont habitués à ce que les liens soient soulignés et colorés (généralement en bleu, car c'est le comportement par défaut du navigateur), ce sont donc probablement les moyens les plus évidents de transmettre des moyens. Donner aux liens un état de survol (même si cela signifie simplement intensifier la couleur de la police) est également un indice utile.

Si le soulignement et la coloration de ces titres posent problème - par exemple, si la conception visuelle que vous avez choisie ne le permet pas - alors d'autres stratégies incluent uniquement le soulignement à l'état stationnaire (en essayant toujours d'utiliser une couleur de titre bleue par défaut si possible), et s'assurer que le texte dans le lien indique qu'il conduit à plus de ressources.

Une autre idée est d'amener les ressources que vous liez à l'avance. S'il y a des photos, vous voudrez peut-être indiquer la présence d'une galerie. S'il s'agit de vidéos, pensez à montrer un petit lecteur vidéo qui ouvre une fenêtre plus grande dans une visionneuse ou une fenêtre modale. Cela rendra non seulement le contenu plus visible, mais cela signifie également qu'un utilisateur peut immédiatement deviner la valeur de cliquer sur d'autres liens multimédias, car vous avez déjà prouvé que vous fournissez un contenu pertinent.

4
Jimmy Breck-McKye

Eh bien, le changement le plus évident que vous devriez faire est de souligner vos liens. Bien qu'écrit en 2004, l'article de Jakob Neilsen Guidelines for Visualizing Links est toujours très approprié.

Les liens textuels doivent être colorés et soulignés pour obtenir la meilleure possibilité perçue de cliquabilité, bien qu'il existe quelques exceptions à ces directives.

Cependant ce n'est qu'un point. Même si vos titres l'étaient ont souligné que ce n'étaient pas des liens vers. Vous devez ajouter un lien réel dans le corps du texte "Voir une vidéo de ce jeu en action" ou "Jouer une démo de ce jeu" reliant à la démo vidéo/jeu. Ne faites pas réfléchir le visiteur du site, faites des liens aussi évidents que possible et expliquez clairement quoi vers lesquels les liens les mènent.

3
JonW

Ce message de l'Institut Baymard intitulé "UI: Indicateurs appropriés pour les éléments cachés" est une excellente ressource.

http://baymard.com/blog/trigger-indicators

0
Max