Choisir les couleurs d’un site web est plus compliqué qu’une visite chez Leroy Merlin !

Allons tout de suite à l’essentiel : si vous aimez le mauve et que le jaune vous fait mal aux yeux, si vous trouvez que le vert et le rouge sont mal assortis et que le bleu fait plus garçon que fille, il est temps de mettre vos idées de côté.

Les couleurs d’un site web ne sont pas une histoire de goût et encore moins une question de plaire à vous ou à qui que ce soit dans votre entreprise. Comme pour les mots, les formes et la construction de votre site, les couleurs répondent à des règles, à une logique d’accessibilité pour vos clients et à l’image de votre entreprise.

Pour admettre cela, et faire abstraction de vos goûts personnels, il est important de comprendre certaines choses.

 

Pourquoi les couleurs d’un site web sont importantes ?

La question se pose : pourquoi les couleurs ont-elles de l’importance ? Les nombreuses études sur le sujet, et surtout le recul que nous avons depuis le lancement du premier site web, nous permettent de l’affirmer haut et fort. Les couleurs :

  • Stimulent les conversions
  • Assoient une identité de marque
  • Aident les utilisateurs à naviguer sur un site web

Tantôt modernes, tantôt classiques, sérieuses, féminines ou encore joviales, les couleurs ont une identité propre à laquelle l’esprit humain associe automatiquement des caractéristiques.

couleurs marque

Source : 99designs

Comme en décoration intérieure, il existe des tons « froids » et des tons « chauds ». L’erreur serait de traduire ces couleurs et les termes associés et de les interpréter. Vous vous doutez bien que la logique va plus loin que cela…

tons froids et chauds

Qu’on se le dise (et c’est ce que nous disons à nos clients) : les couleurs d’un site web sont porteuses d’une symbolique et d’un sens. Elles influencent la perception des visiteurs par rapport à la marque.

En conséquence, les couleurs d’un site web ne peuvent / ne doivent pas être choisies au hasard ou pour faire plaisir aux décisionnaires.

Les mots d’ordre des couleurs d’un site web

Maintenant que nous sommes d’accord sur le fait que le choix des couleurs d’un site web se fait intelligemment et sur la base d’une logique cohérente, passons à la suite…

Les couleurs d’un site, généralement présentées dans un moodboard par une agence de communication digitale, doivent répondre à trois mots d’ordre :

  • Positionnement
  • Lisibilité
  • Cohérence

Petite leçon sur les couleurs

Juliette, notre graphiste de talent, nous rappelle la logique de la palette des couleurs choisies pour notre client Finegan.

Charte graphique Finegan

Source : Charte graphique Finegan

La palette se compose de 3 couleurs principales :

  • La couleur mauve ajoute de la modernité et de la luminosité
  • Le bleu poudré, plus doux, permet d’amener de la fraîcheur
  • Le jaune Crayola s’accorde avec les autres couleurs pastel et apporte un côté fraternel
  • Les deux couleurs secondaires, à savoir le bleu plus sombre et la couleur orange sanguine de Finegan, sont celles de l’enseigne Finegan
  • Trois couleurs annexes et complémentaires ont été ajoutées pour les arrière-plans et les textes

Un autre ? Juliette, c’est à toi !

Moodboard Gatewatcher

Source : Moodboard Gatewatcher

Le choix des couleurs pour Gatewatcher, spécialiste de la cybersécurité, a été motivé par plusieurs éléments :

  • La couleur rouge représente le danger ; elle est ici utilisée pour avertir d’un risque
  • Le noir offre un côté sérieux et fait ressortir le rouge
  • Le blanc a été choisi pour les typographies et les aplats
  • Les textes, quant à eux, sont en gris
  • Du côté des couleurs secondaires, elles représentent les solutions proposées par Gatewatcher
    • Le jaune foncé
    • Le violet
    • Le bleu
    • Le vert

Choisir les couleurs d’un site web : les règles et le process

Choisir les couleurs d’un site web n’équivaut pas à une visite chez Leroy Merlin pour refaire la chambre du cadet lors d’un week-end pluvieux. Si vous ne voulez pas que votre vitrine digitale B2B se transforme en site ludique pour enfants au premier coup d’œil, voici quelques règles à suivre :

1. Prenez le temps de comprendre la théorie des couleurs

Attention, il ne s’agit pas ici de vous plonger dans des livres interminables et autres tutos sur la théorie des couleurs. Il s’agit d’avoir quelques connaissances sur les principes utilisés pour combiner les couleurs de manière harmonieuse. La théorie des couleurs se base sur le cercle chromatique, un arrangement de couleurs dans un cercle (on l’aurait deviné !) montrant les relations entre les couleurs primaires (rouge, bleu, jaune), les couleurs secondaires (vert, orange, violet), et les couleurs tertiaires (combinaisons des primaires et des secondaires).
Comprendre la manière dont ces couleurs interagissent et se complètent est grandement utile !

2. Utiliser une palette de couleurs limitée

Un design de site web efficace utilise souvent une palette de couleurs limitée. De deux à cinq couleurs suffisent généralement. Plus simplement, disons qu’une couleur principale, une ou deux couleurs secondaires, et une ou deux couleurs d’accent suffiront pour attirer l’attention sur des éléments spécifiques.

3. Prendre en compte la psychologie des couleurs

Les couleurs peuvent évoquer différentes émotions et associations. Par exemple, le bleu est souvent associé à la confiance et à la tranquillité, tandis que le rouge peut évoquer l’énergie et la passion. Il est important de comprendre comment les couleurs peuvent influencer l’émotion et la perception de votre marque.

4. Assurer un contraste suffisant

Le contraste entre la couleur du texte et la couleur de fond est essentiel pour la lisibilité. Les couleurs de texte sombres s’affichent mieux sur des arrière-plans clairs et vice versa.

5. Penser à l’accessibilité

Tout le monde ne perçoit pas les couleurs de la même manière ! Les daltoniens ont du mal à distinguer certaines couleurs, par exemple. Prenez cela en compte, même si ces personnes représentent une minorité.

 

Les couleurs d’un site web, c’est notre quotidien. Tout projet de refonte de site passe par un travail de réflexion sur les couleurs, mais également les images, les formes, le logo, etc. Un travail que l’équipe de MyDigiCompany a plaisir à mener conjointement avec ses clients. La différence de notre agence ? Nous partageons l’expertise avec des mots simples, des explications abordables. Avec MyDigiCompany, vos projets prennent vie tandis que vous maîtrisez les process et comprenez chacune des étapes, pour vous approprier votre site web, votre outil de communication et votre image en ligne.

Parlons de votre site web… des couleurs, mais aussi du reste !

10-etapes-dune-refonte-reussie

Jeanne

Business developer
guillemets

"Mieux vaut vivre avec des remords, qu'avec des regrets"

Mis à part les salsifis et les mille-pattes, Jeanne aime tout et tout le monde. Organisatrice hors-pair, dynamique et enjouée, Jeanne a un sourire contagieux, en face à face comme au téléphone. Ses études en alternance, jusqu’au Master, lui ont permis de goûter à plusieurs secteurs d’activité, de l’équipement sportif à la nourriture bio pour animaux domestiques. Originaire de Coulommiers, Jeanne est incollable sur le fromage du même nom mais chez MyDigiCompany, c’est en qualité de Business Developer qu’elle mettra en pratique sa maîtrise de la méthode SONCAS pour fédérer nos clients.

Le gif préféré de Jeanne

giphy-jeanne

Qui suis-je ?

Google ou Microsoft ?
Google

Thé ou café ?
Thé

PC ou MAC ?
Mac

CAC40 ou startup ?
Startup

Beatles ou Stones ?
50 cent

Picasso ou Rembrandt ?
Picasso

Réseau social préféré ?
Instagram

#girlsgang
#epicurien
#clesvacances

Gabriel

Intégrateur Front
guillemets

J'ai voulu dormir, et j'ai fermé les yeux - Tal

Fraîchement arrivé de SupdeWeb Paris, Gabriel (#Gab) fait aujourd’hui partie de l’équipe MyDigiCompany en qualité d’intégrateur front. Entre un premier bachelor commercial puis un second en web design, Gabriel a pris une année qui n’a rien de sabbatique puisqu’il en a profité pour retrousser ses manches et apprendre les bases de son futur métier. A coup de tutos, de formations, de tests grandeur nature et de frustrations en tout genre, Gab s’est montré un autodidacte accompli, ce qui l’a conforté dans son choix. Ancien joueur de foot, cet adepte de musculation et de moto est persévérant. Pour peu qu’il soit convaincu d’un projet, il ne lâche rien ni personne. Têtu ? Non. Jusqu’au-boutiste ? Carrément !

Le gif préféré de Gabriel

Qui suis-je ?

Google ou Microsoft ?
Google

Thé ou café ?
Thé même l’été

PC ou MAC ?
PC

CAC40 ou startup ?
Startup

Beatles ou Stones ?
Kyo

Picasso ou Rembrandt ?
Tout dépend si on parle du peintre ou de la voiture

Réseau social préféré ?
Instagram

#rizpates
#moto
#genoudoctogénaire
#hashtag

Rio

Chief Happiness Officer
guillemets

"Les chiens n'ont qu'un défaut : ils croient aux hommes" (Elian Finbert)

Rio a rejoint MyDigiCompany en mai 2020 en tant que chief Happiness Officer pour le plus grand bonheur de toute l’équipe… ou presque.
Fan d’écologie, il déteste la voiture et préfère les longues balades en forêt.

Le gif préféré de Rio

Qui suis-je ?

Google ou Microsoft ?
Microsoft comme son père

Thé ou café ?
Qu’est-ce que c’est ?

PC ou MAC ?
Pas fan des écrans, préfère les rapports canins

CAC40 ou startup ?
Startup

Beatles ou Stones ?
Nino Ferrer

Picasso ou Rembrandt ?
Edvard Munch

Réseau social préféré ?
Dogstagram

#vomitenvoiture
#toutlemondemekiffesauflinda
#beaugoss
#jepueetalors

Manon

Chef de projet digital junior
guillemets

La vérité est dans la simplicité. (Maxime Lagacé)

Tourangelle d’origine, Manon est arrivée dans la capitale pour ses études en vue d’obtenir un Bachelor « Chef de Projet Digital ». Les ronds dans les ronds, les carrés dans les carrés: chez MyDigiCompany, Manon met son sens de l’organisation en pratique, participant à des projets d’envergure. Capable et volontaire, Manon est montée sur le plus grand plongeoir dès le premier jour et n’a pas tardé à prendre ses marques.
A l’équipe (parfois) survoltée, Manon ajoute sa sensibilité, percevant les choses au-delà des paroles et des faits. Un excellent chef de projet en devenir…

Le gif préféré de Manon

Gif Manon

Qui suis-je ?

Google ou Microsoft ?
Les deux

Thé ou café ?
Thé parfois café

PC ou MAC ?
Mac

CAC40 ou startup ?
Startup

Beatles ou Stones ?
Queen

Picasso ou Rembrandt ?
Ines Longevial

Réseau social préféré ?
instagram

#instagram
#carnet
#gateaufaitmaison
#sensible

Clémence

Chef de projet
guillemets

"Fais de ta vie un rêve et d'un rêve une réalité"

Dès son plus jeune âge, Clémence entretient son goût pour l’international et son accent du sud des Etats-Unis est resté intact lorsqu’elle s’exprime dans la langue de Michael Moore. Une école de commerce et un Master dans le Marketing Digital en poche ont permis à Clémence de se frotter au monde de la publicité, dans une régie parisienne, en charge des programmes marketing online et offline. Sportive, guitariste de haute voltige, touche-à-tout, Clémence est spontanée et toujours de bonne humeur. Une bouffée d’oxygène qui fait du bien !

Le gif préféré de Clémence

Gif Clemence

Qui suis-je ?

Google ou Microsoft ?
Google

Thé ou café ?
Bière

PC ou MAC ?
Mac

CAC40 ou startup ?
Startup

Beatles ou Stones ?
Beatles (mais sinon Taylor Swift)

Picasso ou Rembrandt ?
Cecilia Giménez

Réseau social préféré ?
skyblog

clemence
#minimoys
#chats
#frites
#mangerdemanieregénérale
#concentration
#musique

Nat

Directeur Associé / Expert Hubspot
guillemets

Ce qui ne te tue pas te rend moins mort.

Ceinture noire multi-disciplines, star d’UX (désolé), adepte d’Hubspot et addict aux fonctionnalités utiles, il passe plus de temps à regarder Netflix qu’à côtoyer de vrais humains. Toujours prêt à dégainer sa caméra ou ses bonnes idées.

Le gif préféré de Nat

Qui suis-je ?

Google ou Microsoft ?
Google

Thé ou café ?
Café (n’a jamais cru au thé, qui est finalement du jus d’herbe)

PC ou MAC ?
Anciennement MAC (et anciennement riche, donc)

CAC40 ou startup ?
Startup, parce qu’on dirait le nom d’un boys band

Beatles ou Stones ?
David Bowie

Picasso ou Rembrandt ?
Edward Hoper

Réseau social préféré ?
Tinder

nat
#netflix
#NBA
#hubspot
#domotique
#herniediscaledemerde

Cyril

Développeur Back-End
guillemets

Si les ouvriers construisaient les bâtiments comme les développeurs écrivent leurs programmes, le premier pic vert venu aurait détruit toute civilisation

Bayonnais d’origine, Cyril est un développeur infatigable. Piqué par le virus informatique depuis son plus jeune âge, il va jusqu’au bout des choses, prêt à sacrifier ses weekends et ses soirées pour que … ça marche. Programmé pour durer, Cyril est à l’écoute des clients, prêt à rendre service. Et quand il s’autorise une courte pause en dehors des écrans, c’est sur son vélo qu’on le trouve, ou sur le canapé, devant un match de foot !

Le gif préféré de Cyril

Qui suis-je ?

Google ou Microsoft ?
Qwant

Thé ou café ?
Thé, café, bières, whisky (sans glaçons, c’est ca qui rend malade)

PC ou MAC ?
PC….Apple c’est le Mal

CAC40 ou startup ?
Startup

Beatles ou Stones ?
Beatles, Stones et surtout Septic Flesh

Picasso ou Rembrandt ?
Rembrandt

Réseau social préféré ?
La vie ;)

Cyril
#randovélo
#larzac
#rocker
#php
#jaimepasparis