Choix des couleurs pour son site web

Les couleurs dominantes que l’on choisi pour un site web ne doivent être en aucun cas être choisi pour leur seul valeur esthétique. Ce n’est pas systématique, mais le choix de la couleur est toujours l’objet d’un parti pris stratégique dans la conception d’un site internet.

De nombreux critères peuvent motiver le fait de choisir une couleur plutôt qu’une autre : la symbolique, l’ambiance, le contraste ….
Le bon choix des couleurs peut aussi fortement aider à renforcer la lisibilité, la clarté du site, aider à comprendre la hiérarchisation du contenus et les différents niveaux d’arborescence ou encore à lier ou séparer des rubriques entres-elles.

La couleur dans le web, pas seulement un choix esthétique

Même si l’accord des couleurs a une grand part de subjectivité : à chacun son goût et sa couleur, certaines couleurs ont hérité d’une signification universelle, bien qu’il est toujours possible de les contourner :

. le rouge signifie par exemple une interdiction mais pour certains sites il peut être employé pour exprimer un dynamisme, une vivacité, la jeunesse. Comme ci-dessous le rouge vif bien connu de la marque Uniqlo donne une identité visuelle « colorée et branchée » à la marque mais aussi, il fait echo au couleur du drapeau japonais (origine de la marque) :
couleur-identite-visuelle

couleurs-site-web

. le vert en revanche est souvent utiliser pour les boutons d’action dans les fiches produits d’un site ecommerce ou dans ceux que l’on trouve dans le tunnel d’achat : valider ou poursuivre la commande, ajouter au panier, il évoque la permission, dans le code de la route contrairement au rouge qui évoque l’interdiction et l’arrêt, le vert signifie « je passe ».

couleur-bouton-web

Chaque couleur aura donc une influence sur nos émotions, nos humeurs, notre ressentiment… en fonction de notre environnement culturel. Il est donc important de bien la choisir en fonction du message que l’on veut faire passer et de la cible visée : s’adresse-t-on à un public masculin ou féminin, jeune ou pas, de quel continent… Autant de questions/réponses qui vous permettront de trouver la bonne couleur pour votre site internet.

Une bonne dose de couleurs, mais pas trop

Voici quelques conseils sur l’utilisation de vos couleurs sur votre site web.
En 5 points essentiels :

Pas trop de couleurs !

Des sites avec trop de couleurs empêchent la clarté et la lisibilité et s’apparente à de l’amateurisme.
Vous n’êtes pas un enfant qui découvre ses premiers crayons de couleurs alors n’en faites pas trop ! utilisez au maximum trois dominantes colorées et pas plus, votre site n’en sera que plus clair. Et tentez de bien harmoniser les couleurs entres-elles.

Des couleurs au service de l’ergonomie de votre site web

N’oubliez pas que vos couleurs peuvent renforcer le confort de lecture, donner des points de repères, favoriser la navigation …
Conserver une certaine logique dans leur utilisation par exemple lien en rouge pour tout ce qui est cliquable sur la page, ou toutes les informations d’une même catégorie…
En revanche, aucune information ne doit être véhiculée uniquement par la couleur. Les daltoniens par exemple ne comprendrait pas l’information.

Des couleurs qui facilitent la lecture

Lire à l’écran demande beaucoup plus d’effort que lire sur un support papier : la distance entre nous et le support est plus grande, l’écran est un support plus fatiguant pour les yeux …
C’est pourquoi nous « lisons » sur internet très rapidement, l’internaute est plus pressé de trouver ce qu’il cherche au milieu du flot d’informations qu’on lui propose. Il est important de lui offrir une bonne lisibilité en travaillant les contrastes entre le fond et la forme.
Pour les zones textuelles, un contraste fort entre le texte et son fond favorise la lisibilité. En revanche, on utilisera un contraste moins fort pour des liens qui ont été déjà cliqué par exemple, qui n’ont pas besoin d’être mise en exergue. Dans tous les cas, dès qu’il y a une zone de texte importante, privilégier un fond neutre et unique, éviter les images en arrière-plan sauf si celles-ci on un jeu de transparence ou un flou qui mettra en avant le texte.
Utiliser une couleur flashy en fond si vous voulez par exemple mettre un des blocs de votre page web en avant.
couleurs-site-web
Ici par exemple, la couleur est utilisé pour le fond des boutons d’action et pour les encarts promos et sont donc bien visibles dans la page.


arborescence internet

Cet article vous a plu ?

N’hésitez pas à partager notre page facebook pour suivre nos nouveaux posts et astuces…
[button url= »http://www.lecil.fr/fr/category/webdesign/ » size= »medium »  arrow= »left »]retour aux articles web design[/button]