menu

Comment réaliser une landing page efficace et éthique ?

Jul 18, 2022Valentine

image1.png

“Je veux un effet Waouh”


Nombreux sont les concepteurs web ayant déjà reçus ce genre de demande de la part de leurs clients sur les derniers mois, années.

Lorsqu’on demande à notre client ce qu’il entend par effet waouh, il s’agit généralement de rendre l’esthétique du produit numérique tape à l’oeil : Des effets par ci, des illustrations par là, des vidéos et un maximum de fonctionnalités en surplus, pour faire pâlir la concurrence.
Pourtant, en tant qu’UX Designers amenés à travailler avec les utilisateurs finaux, nous savons une chose : Le premier souhait de l’utilisateur lorsqu’il arrive sur un produit est celui de réaliser sa tâche au plus vite.
Ainsi, le monde du numérique se retrouve à l’heure actuelle surchargée de sites surchargés, ayant un impact carbone démesuré.

L’éco-conception web, c’est le fait de recentrer la conception sur le besoin principal de l’utilisateur, le tout en gardant à l’esprit la sobriété et la transparence.

Par exemple pour une entreprise qui souhaite réaliser un site vitrine, l’utilisateur voudra comprendre rapidement ce que fait l’entreprise et ce qu’elle a à lui apporter. Ainsi, on comprend vite que l’accent numéro un ne doit pas résider dans le design du site et la couleur ou la forme des boutons, mais bien dans l’architecture de l’information et le wording associé. Un wording efficace, transparent et allant droit au but sera en réalité bien plus efficace qu’un design surchargé avec des textes peu travaillés.

Et cela a été prouvé de nombreuses fois dans le passé. Si l’on prend les entreprises les plus puissantes de la planète ( Qui sont évidemment à bannir dans un monde où l’éthique prime lien vers mon autre article), ils ont su se placer en leader en gardant toujours des interfaces très minimalistes : Google, et sa barre de recherche sur fond blanc a par exemple éliminé Yahoo de sa concurrence.

On comprend donc que la sobriété n’est pas un gros mot, mais bien une stratégie gagnante en tout point :

  • Gagnante d’un point de vue expérience utilisateur puisque l’utilisateur saura exactement qui vous êtes, ce que vous faites, et pourra réaliser sa tâche de manière rapide et simple. De plus, il sera plus rapide et donc accessible facilement de partout, même avec une faible connexion internet ou sur un appareil très ancien.

Enfin, un site simple permet de réduire la charge cognitive de l’utilisateur, qui passe souvent sa journée devant un écran et peux vite être agacé ou fatigué lorsqu’il fait face à un surplus d’informations

  • Gagnante d’un point de vue business, puisque cela s’est illustré avec les plus grands acteurs sur le marché : Google, Apple, Notion…



  • Gagnante du point de vue de la sobriété numérique : Votre site sera léger et émettra ainsi moins de Co2 dans l’atmosphère.



Parlons maintenant de ma méthodologie afin de réaliser des sites efficaces en toute sobriété

1. Une charte graphique éco-responsable :

La première étape, c’est de réaliser une identité visuelle éco-responsable.

  • Pour cela, je fais tout d’abord attention à l’utilisation des typographies utilisées afin, si possible, d’utiliser des polices déjà présentes dans le système comme la Helvetica ou la Courrier pour les textes de labeur. Pour les typographies importées et plus léchées, j’utilise des formats WOFF, bien plus légers et je veille à ne charger que les graisses utilisées dans le design.

On évitera également l’utilisation de vidéos longues qui émettent beaucoup de CO2 pour privilégier des photos ou bien des vidéos très courtes et optimisées.

  • Pour les photos, des astuces comme le passage en bitmap permettent de les optimiser au maximum. Pour garder de vraies photos, on privilégiera le format webp, plus léger et optimisé pour le web.

De manière générale, les photos sont à utiliser avec parcimonie car elles peuvent vite rendre un site très lourd. Ainsi, on pourra les remplacer par de fines illustrations au format SVG, qui ne doivent pas être trop détaillées afin d’éviter de les alourdir d’avantage. L’identité visuelle sera pensée pour être accessible : Des contrastes AAA, des tailles de police lisibles ( Minimum 14px ) et des polices facilement lisibles.

2. Une fois l’identité visuelle réalisée, place au wording.

Nous en avons parlé au préalable, cette étape est cruciale pour rendre votre site efficace et faire transparaitre le bon message.
Le but de l’UX Writing est d’optimiser les interactions entre l’utilisateur et l’interface, par le biais d’un discours empathique sur le tone of voice de l’entreprise.
Cela permet égalemment une meilleure usabilité sur l’interface, l’utilisateur pourra donc réaliser ce qu’il souhaite efficacement.
On sélectionnera ainsi le bon tone of voice, et il faudra veiller à réaliser des textes très courts, compréhensibles et impactants.

3. Le wording terminé, on pourra réaliser l’architecture du site.

Le but est de réaliser une architecture simple, avec le moins de pages possibles. Pour un site vitrine, on privilégiera une architecture de l’information claire et un parcours simple et fluide afin que l’utilisateur ne se perde pas dans un surplus de pages mal agencées. L’étape d’UX Writing en amont aura permis d’étoffer le contenu afin d’aller à l’essentiel et d’être efficace. On pourra donc récupérer le wording réalisé afin de réaliser l’architecture des pages par rapport à celui ci.


Pour finir, il ne reste plus qu’à appliquer l’identité visuelle sur les wireframes, et vous voilà avec un site vitrine sobre et efficace !**

Articles à la une

Top 5 des outils Open-source à utiliser en entreprise

Comment réaliser une landing page efficace et éthique ?

Être une marque éthique, qu’est-ce que cela signifie ?