Comment bien choisir les couleurs de son site web ?

Posté le 18/10/2016 - par Amy Wiggenhauser - dans Web Design

La couleur sur le web est un élément primordial pour l’image de votre entreprise. Le web étant avant tout visuel, il est donc légitime de se poser les bonnes questions pour choisir sa palette. Parfois, le choix s’impose de lui-même si votre entreprise dispose déjà d’une charte graphique ou d’un logo avec des teintes que vous souhaitez garder. Mais, si vous souhaitez modifier ces couleurs ou si vous créez votre concept, une étape de réflexion sur le nuancier s’impose.

Dans cet article, je vous propose de faire le point sur les contraintes, les éléments auxquels penser et les outils qui pourront vous aider pour faire votre choix.

Le contexte du web

La luminosité et les couleurs sur le web

L’affichage des pigments sur internet se différencie de l’impression sur papier, car les écrans numériques sont lumineux. Cette dimension de luminosité disparait sur les cartes de visites, les prospectus, mais est intimement liée aux écrans des ordinateurs, smartphones et tablettes. 

Les écrans utilisent le mode RVB (ou RGB en anglais) pour afficher de la couleur. C'est-à-dire, les trois teintes primaires sont le rouge, le vert et le bleu, et leur addition donne le blanc.

Note : en imprimerie, c’est le mode CMJN (ou CMYK en anglais) qui est utilisé. Les couleurs primaires sont le cyan, le magenta et le jaune, et leur addition donne le noir. 

Tous les écrans utilisent le mode RVB. Cependant le rendu peut varier légèrement d’un écran à l’autre à cause du calibrage du moniteur (réglage du contraste, de la luminosité, de la tonalité).

Historiquement, certains écrans étaient par le passé limités à 256 couleurs. De ce fait, il existe une palette de 256 nuances historiques, considérées comme « sûres » pour l’affichage sur internet. Cette limitation n’a plus de véritable fondement de nos jours car les écrans permettent maintenant l’affichage de milliers de teintes sans aucun souci. Les couleurs sur internet sont représentées en notation hexadécimale ou en notation RGB, permettant toutes deux de représenter plus de 16 millions de tonalités différentes. Et il ne faut pas s’en priver !

L’effet de mode

Comme dans tous les domaines, le web est soumis aux effets de mode, que ce soit pour la présentation des sites web ou pour leur design et leurs coloris. Il existe des tendances, que l’on peut décider de suivre ou de ne pas suivre afin de se démarquer. Les plus beaux designs sont parfois des exceptions.

Naviguer sur le web au quotidien et consulter de nombreux sites est la solution pour observer les couleurs et les tendances du moment.

La lecture et l’œil humain

Les couleurs servent à mettre en avant l’image de votre société et votre identité, mais aussi à mettre en valeur le contenu de vos pages. Vos pages web sont destinées à être vues et à être lues. Les couleurs sont donc un moyen d’attirer l’attention sur certaines informations importantes.

Les visiteurs seront amenés à rester plusieurs minutes à regarder leur écran pour parcourir votre site. Pour cela, il est important de penser au confort visuel de votre public. Ces dernières années, les teintes pastel ont pris une place importante dans de nombreux designs. Elles ont l’avantage d’être douces et reposantes, tout en laissant ressortir les illustrations.

Les couleurs les plus lumineuses pourront créer une identité forte pour votre site. Mais elles auront tendance à fatiguer l’œil humain si elles sont utilisées sur de larges surfaces ou en trop grand nombre. A utiliser donc avec mesure.

Les coloris foncés sont généralement reposants pour l’œil, et permettront aussi d’ajouter des notes fortes à votre palette. Attention toute fois à utiliser suffisamment de contraste entre le texte et le fond des pages pour que la lecture reste facile et agréable.En général, se limiter à 3 couleurs différents (hormis le noir et le blanc) est un bon nombre pour ne pas se tromper. 

Les contraintes

Si votre logo ou votre charte graphique contient déjà des couleurs, votre choix sera sans doute orienté en fonction de ces nuances.

Si vous créez votre concept :

• Peut-être souhaitez-vous vous démarquer de vos concurrents, auquel cas, observez les palettes qu’ils utilisent et essayer d’en choisir des complètement différentes
• Si votre domaine d’activité est associé à des couleurs dans l’esprit de vos clients potentiel, vous souhaiterez peut-être utiliser des teintes qui soient liées à ces coloris, afin que votre entreprise puisse être reliée à votre domaine d’activité du premier coup d’oeil
• Si vous choisissez des couleurs pour une impression papier, penser à les convertir en mode CMJN pour éviter les surprises, car le rendu dans ce mode est toujours différent du mode RVB
• Les teintes que nous regardons ont un effet sur notre inconscient, qui est à notre vécu personnel et à notre culture. Penser au public que vous visez et adaptez si besoin votre palette en fonction du message que vous souhaitez véhiculer.

Des outils pratiques

• Créer de belles palettes avec Adobe Kuler : https://color.adobe.com/fr/create/color-wheel/
• La palette historique de 256 couleurs « sûres » pour le web : https://websafecolors.info/color-chart
• La symbolique des nuances courantes : https://fr.wikipedia.org/wiki/Symbolisme_des_couleurs