Bien choisir et utiliser les couleurs sur son site web

Auteur
Akli Goudjil
Lecture
4min
Lus
60x

Il n’est pas toujours évident de choisir les couleurs pour un projet. On peut vite se sentir submergé par l’infinité de choix. C’était d’ailleurs mon cas pendant quelques temps avant que je décide de mettre en place un système simple et efficace qui permettra de trouver les bonnes couleurs pour le bon projet.

Dans cet article, je vais vous partager mon processus en trois étapes que j’utilise sur tous mes projets de web design pour trouver les couleurs adaptées.

1 – Choisir la couleur dominante

Certains clients ont deja des couleurs pour leurs marques ou une idée des couleurs qu’ils souhaitent. Dans ce cas c’est assez simple car vous avez deja la couleur dominante avec laquelle travailler. Il faudra effectué quelques variations mais l’idée principale est déjà donnée.

Dans d’autres cas, on part de zero, le client ne sait pas du tout ce qu’il souhaite et là, c’est bien plus complexe. Il faut choisir la bonne couleur dominante pour le client mais pour ça il faut avoir une idée de ce que les couleurs représentent. Il va falloir questionner le client sur son projet, sur les émotions et idées qu’ils souhaitent partager pour trouver la couleur adaptée à son objectif. 

Cela met bien en avant une idée que j’ai partagé dans un autre article comme quoi le Design n’est pas de l’art. Je vous invite à le lire, il est très interessant et transforme l’idée du design en quelque chose de plus concret et mathématique.

Je vais prendre l’exemple de ma propre marque Akli G. Dont les couleurs vacillent entre le bleu et le violet.

Il est nécessaire de savoir ce que ces couleurs signifient et voir si elles renvoient le bon messages aux clients. 

Voici un schéma des couleurs et des émotions qu’elles représentent.

Le bleu représente la sécurité, la stabilité le calme et le violet la sagesse et la connaissance. 

L’idée est que l’union de ces couleurs renvoient une image de sécurité, d’assurance et et d’expertise.

Mon objectif est que mes prospects et clients sachent tout de suite que je suis capable de gérer correctement leurs projets et leur procurer un sentiment de sécurité et de sérénité quant à la qualité du travail que je délivrerai.

2 – Ajouter deux couleurs supplémentaires

Il n’est pas toujours simple de décider quelles couleurs présenter au clients (surtout quand il ne sait pas lui même ce qu’il souhaite). On ne peut pas ajouter toutes les couleurs que l’on trouve cohérente. Il faut trancher et décider. Ça peut-etre un processus long et difficile à mettre en place.

C’est pourquoi il m’arrive d’utiliser un super outil en ligne qui s’appelle mycolor.space

Il suffit d’indiquer la couleur dominante et il vous générera des palettes qui sont compatibles avec la couleur dominante. 

C’est un super outil d’inspiration, il ne faut pas suivre bêtement ces indications. Mais ça donne une orientation très utile pour choisir les couleurs du projet. Ca  vous donne une idée d’autres couleurs qui peuvent se combiner.

Une fois les 2 couleurs supplémentaires choisis on se trouve avec une palette de 3 couleurs. En général, il convient de ne pas ajouter des couleurs. Au risque de perdre en cohérence et en professionnalisme. A moins de le faire pour une raison particulière ou artistique, je ne recommande pas d’avoir plus de 3 couleurs dans son identité visuelle.

Une autre méthode que j’utilise pour m’inspirer des couleurs, c’est tout simplement d’aller me balader dans la rue ou dans la nature. Nous vivons dans un monde en couleur. L’inspiration est tout autour de nous. Je m’inspire des publicités, des logos des commerces, de la nature…

Rappels, le blanc et le noir sont des couleurs en design, ils ont leurs propres signification et utilité.

03 – Appliquer la règle 60/30/10

Nous voila donc avec une palette de trois couleurs. Il faut maintenant dosé la quantité de couleurs de chacunes.

Pour cela, il existe une règle très simple mais très efficace. C’est la règle du 60/30/10.

La couleur dominante = 60% (Les fonds)

La couleur secondaire = 30% (éléments principaux tel que les titres ou les textes)

La couleur n°3 = 10% (Cette couleur est la pour donner un petit éclat de couleurs, boutons, Appels à l’action, offres…)

Et voila, il suffit maintenant de jouer avec ces couleurs, 

On n’est pas obliger de respecter le 60/30/10. Parfois on peut mélanger les couleurs fonction de l’objectif et décider que sur une page la couleur 10% deviennent la couleur 60%.

Il y a de nombreuses possibilité créatives en jouant avec la règle 60/30/10 et donne de la versatilité à votre site internet.

Sommaire