web-dev-qa-db-fra.com

Lequel est le plus susceptible d'être lu et traité: un texte (connexe) placé au-dessus ou au-dessous d'une image / vidéo?

Je pense à la mise en page sur des pages où l'atout principal est visuel - par exemple, une photo d'un élément de la collection sur un site Web de musée, ou une vidéo intégrée comme sur YouTube et de nombreux sites d'actualités. Parfois, un titre ou d'autres informations brèves et pertinentes sont données au-dessus de la vidéo (comme sur YouTube), et parfois du texte qui définit le contexte de l'image est affiché immédiatement en dessous (comme dans les légendes des images sur les sites d'actualités). Idéalement, vous voulez que les gens lisent le texte qui présente et/ou résume la photo ou la vidéo; il est probable qu'il s'agisse d'au plus une ou deux lignes de texte. Il peut s'agir d'un titre ou simplement d'une explication de l'objet et de son contexte.

enter image description here

Le motif F pour la lecture suggère (sans surprise) que les anglophones commencent à lire en haut de la page, puis descendent en bandes horizontales, donc mettre un titre au-dessus de l'image est logique à partir d'un " définition du contexte "point de vue - il n'est probablement pas très litigieux de dire que le contenu près du haut d'une page reçoit plus de globes oculaires que les trucs plus bas. Cependant, le cerveau est considérablement plus rapide dans le traitement des images que dans le traitement du texte , ce qui pourrait signifier que nous finissons de traiter le contenu de l'image avant d'avoir fini de traiter les mots, même si les mots sont affichés en premier sur la page. Il y a aussi une chose entière à propos de la mise en page, où les images et les espaces blancs guident l'œil - par exemple, cogapp.com semble faire un très bon travail en guidant l'œil vers le bas de la page vers la déclaration sur ce qu'ils faire. Je ne sais donc pas à quel point il est facile d'en parler dans l'abstrait, car dans une certaine mesure, cela dépendra également de la conception visuelle.

Quoi qu'il en soit, ma question: existe-t-il une preuve tangible de savoir s'il est préférable de mettre un texte connexe au-dessus ou en dessous de l'image, du point de vue de faire lire et de traiter les mots? (Je ne sais pas si la simple fixation sur les mots compterait; je veux savoir qu'ils ont réellement traité le contenu écrit de manière significative :)

21
finiteattention

Celles-ci sont appelées "lignes de coupe" et sont utilisées dans l'industrie de la presse depuis des décennies avec le texte EN DESSOUS de l'image. Je m'en tiendrai à ça.

Je dirai que le format d'impression traditionnel a l'image séparée du texte principal (généralement en haut ou sur le côté) avec une légende sous l'image.

Cela semble naturel, vous voyez une image, puis une description de ce qui se passe exactement. À partir du titre ou de la copie menant à l'article, vous avez probablement une assez bonne idée de ce que sera l'image, ce qui signifie que la description de l'image en premier généralement n'est pas nécessaire.

Cependant, les médias numériques ont souvent (mais pas comme une convention stricte) placé une copie de guidage au-dessus des images quand cela correspond au flux d'un article.

Par exemple, je pourrais conduire à une image à laquelle vous vous attendiez totalement, comme cette image de "Fail Whale" de Twitter:
enter image description here

Dans ce cas, le narratif garantit le texte descriptif avant l'image. C'est particulièrement approprié dans un style d'écriture où c'est comme si l'auteur montrant directement quelque chose à l'utilisateur, c'est comme si je vous remettais une image "Ici, jetez un œil à ceci".

Dans de nombreuses situations, cela peut être inapproprié et inattendu; la légende sous l'image est conventionnelle et des conventions existent pour guider les utilisateurs. En vertu des conventions suivantes, vous économisez beaucoup de temps et de confusion à vos utilisateurs. Les conventions sont importantes , en particulier dans les "nouvelles" formes de médias.

5
Ben Brocka

Je n'ai aucune preuve tangible, juste quelques suggestions:

  1. Respectez la norme, copiez vos pairs, c'est à cela que vos utilisateurs sont habitués. Vous parlez à la fois de vidéo et d'images, donc je ne sais pas si votre homologue est cogapp.com ou YouTube.com (avec des titres au-dessus de la vidéo).

  2. Vous insistez sur l'importance du texte sur l'image. Je crois que la mise en page du texte a plus d'importance que sa position ici, le cogapp.com fait un excellent travail avec du texte blanc sur fond noir avec suffisamment de rembourrage.

  3. Considérez la position de l'image/vidéo + texte sur le site Web. Si le texte est plus important, vous souhaiterez peut-être qu'il soit visible sans défilement. Les utilisateurs ne font pas défiler et ont généralement moniteur plus petit que vous .

  4. Ma règle générale est que le titre doit être sur une seule ligne et doit être au-dessus de l'image tandis que la description peut être multi-ligne et doit être en dessous de l'image.

J'espère que cela vous aidera un peu.

2
daniel.sedlacek

Tout contenu sera lu et traité s'il est placé et stylisé correctement.

Il est particulièrement important dans la publication en ligne car le contenu est divulgué progressivement par défilement, ce qui n'est pas le cas des médias imprimés où la taille physique concrète permet aux lecteurs de voir l'intégralité du contenu en un coup d'œil. Par conséquent, lors de la consommation de contenu numérique, l'utilisateur devra probablement faire défiler vers le bas pour lire la légende, puis remonter pour continuer à lire le contenu principal, puis faire défiler à nouveau pour ignorer l'image qui décompose le texte. De plus, dans de nombreuses publications en ligne, les légendes ne sont souvent pas conçues différemment du corps du texte, ce qui ajoute à la confusion.

Par conséquent, je distillerai la règle suivante pour le sous-titrage des images et des vidéos en ligne:

Si l'image/la vidéo commence au-dessus du pli et la hauteur, y compris la légende, est inférieure à 600 pixels (c'est-à-dire au-dessus du pli sur des écrans de 768 pixels, y compris le navigateur chrome et en-tête) et c'est la seule image/vidéo sur la page, alors vous pouvez placer la légende en dessous.

Cependant, si l'image/la vidéo passe en dessous du pli o il y a d'autres images/vidéos sur la page, la légende doit être placée au-dessus pour garantir la cohérence et éviter la confusion des utilisateurs. De plus, les légendes doivent être stylisées différemment du corps du texte dans tous les cas.

2
dnbrv

Le contenu multimédia, en particulier une image, attire immédiatement l'attention des utilisateurs, le flux naturel est ensuite de descendre, ce qui signifie que tout ce qui est au-dessus (le plus souvent une barre de navigation) est ignoré jusqu'à ce qu'il soit vraiment nécessaire. Les sous-titres pour le contenu multimédia sont mieux affichés ci-dessous pour tomber dans ce flux naturel, un utilisateur est plus susceptible de vouloir lire une description si elle suit, pas des pistes. Cependant, je pense que les titres sont meilleurs que tout contenu. Prenez en compte Youtube car ils ont probablement eu une équipe de recherche d'ethnographes sur le sujet et établissez leur mise en page telle qu'elle est actuellement, qui a également établi une sorte de norme.

1
Marty