Les images et l’expérience utilisateur (UX)

Sur quoi se base l’expérience de l’utilisateur ? Sur le design, le texte ou les images ? Comment les images contribuent-elles à l’expérience de l’utilisateur ?

Passionné depuis toujours de typographie, j’ai exulté quand j’ai su qu’en 2006, Information Architects, une petite agence web de Tokyo, au Japon, écrivit deux articles sur son blog. Le titre a semblé provoquer une certaine agitation :

95% du web, c’est de la typographie.

Cela ne devait effectivement pas être une surprise, mais c’est exact. Car qu’est-ce qui facilite l’expérience ? Les mots, le plus souvent. Parce que tout individu est à la recherche d’information (donc de contenu) sur le web.

images expérience utilisateur : 95% du web, c'est de la typographie !
95% du web, c’est de la typographie !

Dans ce fameux article, ils sont allés dans le même sens que Cameron Moll. Parce qu’il précise qu’il faut traiter la typographie en design web comme une interface utilisateur.

Images et expérience utilisateur : l’UX n’est pas l’UI

Beaucoup se demandent encore : Mais quel est le rapport avec l’expérience utilisateur ? Tout simplement, je voulais montrer la différence entre l’expérience utilisateur (UX) et le design d’interface utilisateur (UI).

Planification d'une interface utilisateur (UI)
Planification d’une interface utilisateur (UI)

Techniquement, l’expérience utilisateur est un ensemble de disciplines :

  1. L’architecture de l’information connecte les gens au contenu d’une manière plus compréhensible pour eux.
  2. Le design d’interaction traite des interactions spécifiques entre les utilisateurs et un écran. Il le fait en se basant sur les principes de l’Interaction Homme-Machine.
  3. L’utilisabilité traite du fait de s’appuyer sur des données pour déterminer le bien-fondé des décisions de design. Elle est définie par la norme ISO 9241-11:1998.
  4. Le prototypage peut être défini comme la création d’une version préliminaire à partir de laquelle les autres formes sont développées.
  5. Le design visuel porte sur l’utilisation de l’aspect visuel d’un produit pour en améliorer l’expérience utilisateur.

Une interface utilisateur est bien loin d’une expérience utilisateur. L’expérience de l’utilisateur ne s’arrête pas au bord de l’écran. Au lieu de cela, c’est un voyage de bout en bout, de l’engagement initial avec une organisation au dernier moment
Paul Boag

L’excellent livre de Golden Krishna montre juste comment une bonne expérience a si peu à voir avec l’interface utilisateur.

Mais dans le cadre de cet article, nous nous concentrerons sur les points de contacts (touchpoints) digitaux. De plus, nous n’aborderons pas en profondeur le design thinking (qui est le côté business du design).

Ce que nous devons avoir à l’esprit est que sur un site web, l’aspect esthétique global permet aux individus de décider si oui ou non ils peuvent faire confiance au site (ou au propriétaire du site).

images expérience utilisateur : Tenez compte de l'avis de vos utilisateurs
Tenez compte de l’avis de vos utilisateurs

De plus, des recherches ont démontré que cela prend seulement 50 millisecondes (!) aux individus pour se faire une opinion sur l’attrait esthétique d’une page web.

Ainsi vos chances pour convaincre un nouveau consommateur pourraient disparaître bien avant qu’il n’ait commencé à lire votre contenu.

Alors, optimisez vos images !

Quelques statistiques sur les images et l’expérience utilisateur

65% des individus sont des apprenants visuels, 90% de l’information qui arrive au cerveau est visuelle. Et les présentations avec des aides visuelles sont 43% plus convaincantes. Il est donc plus logique d’utiliser des types de contenu pour lesquels les individus ont une résonance psychologique innée.

Le marketer Jeff Bullas affirme que les articles avec des images ont 94% de plus de vues que ceux sans.

Comment mettre les images au service de l’expérience utilisateur

Lorsque nous pensons à l’utilisabilité, les images ne sont pas la première chose qui nous vient à l’esprit. Souvent en tant que designers UX, nous sommes tellement concentrés sur la solidité de l’architecture de l’information, sur la convivialité des flux de navigation, sur les appels à l’action et sur la pertinence des étiquettes, que les images sont une réflexion ultérieure.

Les statistiques nous prouvent ces derniers jours que les images ont de plus en plus d’impact sur l’UX de nos sites web et de nos plateformes digitales.

Qu’est-ce qu’une bonne image en UX ?

C’est une question qui a largement été explorée, et continuera à évoluer avec le web et avec des techniques comme le responsive design. En règle générale :

Les photos les plus utilisables et efficaces communiquent clairement quelque chose à l’utilisateur, sont utiles, sont conformes à la marque, évoquent une réponse émotionnelle et influencent l’utilisateur de la manière dont le designer l’a souhaité.
— James Chudley

Jared Spool identifie trois types différents d’images :

  • images de navigation,
  • images de contenu
  • et images ornementales.
images expérience utilisateur : jared spool
Jared Spool
  1. La première catégorie, les images de navigation, supportent l’architecture de l’information et le flux de navigation d’un site, et aident l’utilisateur à choisir où aller ensuite.
  2. Les images de contenu fournissent aux utilisateurs des informations supplémentaires qu’ils n’obtiendraient pas à partir d’une description écrite. Airbnb aurait doublé ses revenus en améliorant les images de contenu qui montrent aux gens où ils séjourneraient.
  3. Les images ornementales sont des images décoratives qui ne contiennent pas d’informations. Cette troisième catégorie doit être utilisée avec modération car ces images sont souvent moins favorables à une bonne expérience utilisateur.

8 conseils pour utiliser les images en UX

Avec tout cela à l’esprit, voici quelques conseils et astuces pour vous assurer que vos images sont aussi utilisables que possible et contribuent à une excellente expérience utilisateur :

1. Design content-first

Y compris les images ! Même si vous n’avez pas accès aux images finalisées, prenez l’habitude d’inclure des images de direction (artistique) ou proto-contenu.

2. Tenez compte de votre mise en pages

Cela inclue l’élimination des recadrages maladroits. Tout comme le choix d’images qui complètent la mise en pages et le format que vous utilisez dans votre design.

3. Utilisez le texte de manière appropriée

La superposition de texte sur les images peut constituer un énorme défi d’utilisabilité.

4. Utilisez les yeux pour attirer le regard

La psychologie comportementale explique que nous sommes attirés à regarder où apparaissent les yeux sur une photo ; et cela peut être utilisé à votre avantage lors du design d’une page. Le but étant d’attirer l’attention sur un titre ou un CTA.

5. Spécifique c’est mieux que générique

Dans vos images, visez à utiliser votre spécificité à votre avantage. Une des raisons pour lesquelles les images de certaines banques d’images sont devenue un cliché est la nature générale et vague de ces images.

6. Racontez votre histoire avec des images

Lorsque vous utilisez une photographie, assurez-vous que l’image est la bonne pour ce que vous essayez de transmettre.

7. L’accessibilité est cruciale

L’accessibilité de l’image est cruciale pour rendre votre site web utilisable par le plus d’individus possible. Les images contenant des informations importantes devraient avoir des balises alt descriptives qui transmettent les mêmes informations que l’image.

8. La performance c’est de l’UX !

Une énorme manière dont les images ont une incidence sur l’expérience utilisateur est le temps de chargement.

Vous rassurer que les images sont optimisées pour le web réduira le temps (irritant) que les utilisateurs passent à attendre que leur expérience se charge.

Si vous ne savez pas comment y arriver à partir de vos logiciels de création, Imagify est une solution simple pratique pour tout utilisateur de WordPress.

Ce qu’il faut retenir sur les images et l’expérience utilisateur

L’article est long, je l’avoue, mais il me semblait important de couvrir ces différents aspects et de documenter mon point de vue sur la question.

Si vous avez des questions et surtout des compléments à cet article, n’hésitez pas à nous en faire part dans les commentaires.

couverture livre étapes création site web

Vous est-il déjà arrivé de tomber sur le template du site web de vos rêves ?

Mais qu'après de longues heures de personnalisation vous vous retrouvez avec quelque chose de moche ?

Tôt ou tard, cela finit par créer de la frustration. Ce livre est fait pour que la frustration disparaisse.

Article ajouté au panier
0 Produit - 0,00