La ligne de flottaison, les images et les titres

Il y a beaucoup de questions à propos de l’UX design auxquelles vous devrez répondre durant votre carrière. Il y en aura auxquelles vous n’auriez jamais pensé. Bref aujourd’hui, nous allons apprendre certains truc à propos de la ligne de flottaison, des images et des titres visuels de vos pages.

Vous venez juste d’arriver ? Vous voudrez peut être commencer par qu’est ce que l’UX design.

La ligne de flottaison

Un des plus old-school principe encore à la mode est la ligne de flottaison qui – dans le cas miraculeux où vous n’en auriez jamais entendu parler – est la partie de votre design qui est visible avant de scroller.

Chaque chose avant la ligne de flottaison aura un maximum de visibilité. Malgré ça, des études que j’ai pu lire, vous pouvez vous attendre à ce que 60 à 80% de vos utilisateurs vont dérouler la page pour voir s’il y a des choses intéressantes en dessous.

Tout ce qui est au-dessus de la ligne de flottaison doit informer les utilisateurs de ce qu’ils peuvent trouver en dessous.

Attention : c’est à la mode de mettre une grande image en haut des pages (ou des carrousels qui prennent toute la hauteur de l’écran). Si on a l’impression d’être à la fin du site alors qu’il y a d’autres choses à voir en dessous, les gens pourraient partir plutôt que de scroller. Et si vous avez besoin d’ajouter une icône qui dicte à vos utilisateurs d’aller voir plus bas, c’est que votre design n’est pas bien conçu.

Pour en apprendre un peu plus sur la ligne de flottaison (EN).

Les images

La plupart des UX designer traitent les images comme elles n’était pas utile, comme de la déco. Mais les images guident le regard des utilisateurs, donc pensez aux images !

Les images avec des gens plus particulièrement, attirent l’attention plus que n’importe quoi d’autre.

En règle générale, plus l’image va créer de l’émotion, plus attirante elle sera.

Conseil : pour les images avec des personnes dessus, essayez de trouver une image où la personne de la photo regarde en direction de l’élément de votre design que vous souhaitez que l’utilisateur regarde. La différence est asse impressionnante, regarder par vous-même ces images d’eyes tracking :




La seule chose que change dans ces deux designs, c’est le regard de l’enfant sur la photo.
Les résultats nous montrent clairement que l’utilisateur se concentre beaucoup plus sur le contenu sur la deuxième image. À vous de faire votre choix.

Les titres

Après les photos de gens, les utilisateurs regardent les textes les plus gros et les plus contrastés : les titres. Donc quand vous ajoutez un gros titre dans votre design, vous êtes en train de choisir ce que vont scanner les gens et où sera attiré leur regard.

C’est pourquoi il est très important que votre titre soit aligné avec le contenu le plus important auquel il est relié. Attention si ce contenu n’est pas très important, vous allez attirer un peu trop l’information dessus. S’il n’est pas aligné, l’utilisateur va chercher un autre point mis en valeur après le titre (comme un autre titre, une image, un bouton mis en avant…).

Donnez quelque chose d’intéressant à l’utilisateur avant qu’il utilise le scroll.
Rendez évident le fait que l’utilisateur doive scroller.
Choisissez des images qui vont donner de l’émotion et diriger le regard de l’utilisateur.
Utiliser des titres pour diriger le regard de l’utilisateur.

Sources

  1. Ligne de flottaison, image et accroche marketing

A propos de la traductrice

Diane Wattiez

Diane Wattiez est une freelance passionnée et spécialisée en intégration et Web-Design.