Les conseils netao : 10 bonnes pratiques pour un webdesign réussi

Comment séduire en un coup d’œil les visiteurs de votre site, leur donner envie d’y rester et surtout d’y revenir ?

Le contenu est bien sûr important, mais c’est le webdesign qui a le beau rôle.
Les internautes ont des automatismes lorsqu’ils naviguent sur des sites, acquis au fur et à mesure de l’évolution des sites web.

Pour que votre site leur plaise, netao vous explique tout !

Les secrets d'un webdesign réussi

Bonne pratique #1
Le choix des bonnes couleurs

La mise en place d’une charte graphique pour une marque et son site est primordiale. Elle permet de définir une unité dans les couleurs (mais aussi dans les polices, le style…). Une base de trois couleurs est amplement suffisante et permet d’adopter la même cohérence visuelle sur l’ensemble des pages.

Astuce : travailler une même couleur en camaïeu permet une belle montée en gamme visuelle.

Bonne pratique #2
L’utilisation des polices

Les polices de caractère bâton, plus lisibles, sont à privilégier pour les textes (Verdana, Helvetica…). Les polices stylisées sont plutôt à réserver aux grands titres car elles sont moins faciles à décrypter sur des textes longs. Il convient d’appliquer une taille de police qui ne soit pas trop petite, afin de faciliter la lecture. La cohérence visuelle doit être travaillée : il faut veiller ne pas changer de police à chaque page, et à adopter la même pour l’ensemble du site.

Astuce : choisir une seule police et la décliner en gras, italique, majuscule ou petites capitales.

Bonne pratique #3
Le respect des contrastes

Un bon contraste entre la couleur de fond et la couleur de police facilite la lecture. Ainsi, si le fond est foncé, le texte doit être de couleur claire, et inversement. À noter que les fonds clairs fatiguent moins l’oeil, l’idéal est donc une écriture foncée sur un fond blanc.

Astuce : préférer un gris anthracite à un noir. C’est moins agressif à l’œil.

Bonne pratique #4
La répartition des éléments

Les visiteurs de votre site ont des habitudes de navigation, car la plupart des sites respectent les mêmes conventions. Ainsi, le logo doit apparaître dans le header (en-tête), traditionnellement en haut à gauche. Il est recommandé d’y insérer un lien qui permet à l’internaute de rejoindre la page d’accueil où qu’il se trouve sur votre site. Une bonne répartition des éléments (logos, barre de navigation…) permet une bonne lecture de la page que vous naviguiez sur un ordinateur ou sur un mobile.

Bonne pratique #5
Le principe de lecture

Il est démontré que l’oeil de l’internaute balaie la page selon le principe de lecture en Z : de gauche à droite et de haut en bas, en dessinant un Z.  Sachant cela, il est important de positionner les éléments les plus importants aux endroits stratégiques de la zone parcourue par l’oeil.

Astuce : positionner les éléments importants aux endroits de changement de sens de lecture.

Bonne pratique du webdesign

Bonne pratique #6
Le responsive design

Depuis 2015, Google a recensé plus de trafic sur smartphone que sur ordinateur. Les sites doivent donc être pensés en priorité pour la navigation sur smartphone et tablette puis adaptés pour les ordinateurs.

Bonne pratique #7
La hiérarchisation des éléments

Pour que les visiteurs accèdent facilement à vos pages, il est essentiel de leur indiquer le chemin en hiérarchisant les contenus par l’utilisation des niveaux de titre, la création des passerelles entre les pages (avec des boutons par exemple), ou l’utilisation d’aplats de couleur pour identifier les zones à mettre en avant…

Astuce : définir une couleur référentielle pour les aplats des boutons de call to action

Bonne pratique #8
La gestion des blancs

Une page trop remplie est fatigante pour le regard et envoie trop d’informations. Les zones de blanc permettent à la page de respirer. D’ailleurs, les espaces « blancs » peuvent tout à fait être en couleurs, tant qu’ils ne contiennent ni texte ni photo. Par contre, on peut tout à fait y insérer un bouton, qui sera ainsi bien visible.

icônes

Bonne pratique #9
L’utilisation des éléments graphiques

L’usage d’éléments graphiques permet la compréhension des contenus par votre visiteur. On peut par exemple utiliser des pictogrammes ou des icônes pour accompagner un lien. Des barres verticales ou horizontales de couleur peuvent aussi permettre de mettre en valeur les éléments importants (tant que la charte graphique est respectée) en y intégrant par exemple un bouton.

Bonne pratique #10
Les colonnes de texte

Une bonne méthode pour faciliter la lecture de textes longs est l’utilisation de colonnes. À l’instar d’un journal, le texte ainsi composé est plus fluide et agréable à lire. Cela limite aussi le nombre de caractères par ligne : entre 60 et 85 caractères sont le ratio idéal pour une lecture fluide.

Un site au webdesign attrayant, et ergonomique tout en étant riche en contenus est assuré de capter ses visiteurs et de les voir revenir.

Le bon KPI pour en juger est le nombre de pages vues par visite.
Plus il est élevé, plus votre site est séduisant et votre ergonomie réussie.

Chez netao, nous appliquons au quotidien les bonnes pratiques du webdesign lors de la création des sites internet de nos clients
en y ajoutant des années d’expérience et une adaptabilité tout terrain !

Pour en savoir plus sur la création de sites par netao