Un blog qui parle de webdesign, graphisme, méthodologie ...

icone rss  icone twitter  bouton de retour vers le portfolio pixenjoy

Design: la couleur

Cet article s’insère dans une série d’articles consacrée aux éléments du design. La couleur est un vecteur puissant de communication mais c’est aussi un des éléments les plus délicat à manipuler.

Introduction

La couleur est un élément du design qui ne laisse personne indifférent. C’est même bien souvent le premier critère remarqué et discuté lorsqu’un webdesigner présente une maquette graphique. La couleur a donc un pouvoir attractif important auquel beaucoup de gens sont sensibles.

Cela est parfois problématique car la couleur a tendance a occulter les autres composantes d’un webdesign alors que celui-ci doit s’apprécier sur bien d’autres critères. De plus, même si la couleur répond a quelques règles d’utilisations, son ressenti est très subjectif et personnel. La couleur est certes un élément de communication puissant mais il faut savoir s’en détacher pour prendre en compte les autres éléments d’un design.

J’ai déjà abordé le thème de la couleur dans l’article « L’harmonie des couleurs » ou je parle des différentes techniques d’harmonisation des couleurs basées sur l’utilisation de la roue chromatique. Je n’aborderai donc ici la couleur que de manière globale, en tant qu’élément fondamental du langage graphique.

Caractéristiques de la couleur

La couleur peut communiquer une humeur, décrire une réalité, ou codifier une information. On peut l’utiliser pour camoufler un objet ou au contraire pour le faire ressortir de son environnement. A travers une gamme infinie de teintes, de valeurs et de saturations, la couleur donne vie aux créations graphiques. Mais la couleur est subjective et versatile. Selon l’éclairage, l’environnement, les états d’âmes (psychologiques, culturelles, religieuses …) du spectateur, la couleur peut être perçue différement.

On constate également que les couleurs interagissent entre elles. Ainsi, notre perception d’une couleur peut être influencée par la ou les couleurs qui l’entourent. Par exemple une couleur claire nous paraitra plus brillante sur un fond sombre que sur un fond pâle.

Enfin rappelez-vous qu’il est possible de décliner une couleur en couleurs similaires simplement en faisant varier sa saturation et/ou de sa valeur. Cela démultiplie la gamme des possibilités pour vos choix de palette chromatique.

Choix d’une palette de couleur

Le choix d’une palette de couleur pour son webdesign est une étape critique mais importante. Fixer les couleurs qui seront utilisées dans un design permet de maintenir une cohérence graphique. Il est a noter également que le choix d’une couleur ne se fait jamais de façon individuelle mais doit se faire en fonction des autres couleurs sélectionnées.

En ce qui concerne les accords, vous pouvez utiliser la roue chromatique selon les techniques expliqués dans l’article « L’harmonie des couleurs ». Vous pouvez également vous inspirer de ce que vous voyez dans la nature ou d’une bibliothèque online de palette chromatique.

Lorsque vous choisissez vos couleurs, pensez à l’atmosphère que vous voulez dégager mais ayez conscience que les couleurs et le message véhiculé seront différents selon la culture, la religion, la mode, l’expérience, la position sociale et la tranche d’age de votre public. Il faut donc que vous preniez en compte les caractéristiques de votre cible et le contexte dans lequel s’inscrit votre projet.

Langage et symbolique des couleurs

Le message véhiculé par une couleur est assez empirique et rattaché à une collectivité sociale, culturelle pour une époque donnée. Au cours des siècles, l’histoire a façonné l’identité des couleurs qui restent ensuite dans l’inconscient collectif.

Voici un panel des évocations transmises par les principales couleurs. Vous verrez que souvent les couleurs possèdent leur côté sombre et leur côté positif.

ATTENTION ! les indications suivantes ne doivent pas être considérées comme une vérité absolue. Il ne s’agit pas de mettre les couleurs dans des cases d’évocations immuables. Donc pour ne pas brider votre créativité, sachez si besoin, vous détacher des informations suivantes.

Noir

C’est la couleur des extrêmes politiques de droite comme de gauche, du deuil, des juges et des arbitres mais c’est aussi devenu la couleur des berlines de luxe avec chauffeur, des smoking et des objets design des grandes marques. Combiné avec le blanc, le noir devient classique, intense et graphique.

www_logicabox_com.png
www.logicabox.com

- Les ténèbres, la mort, le deuil, l’angoisse, la peur.
- Le mystère, l’austérité, l’humilité, l’autorité.
- La sophistication, le luxe, l’élégance.

Blanc

Le blanc nous rappel les nuages, la neige, les lieux aseptisés, les robes de mariées, la lumière, Dieu …

www_area404_de.png
www.area404.de

- Pureté, propreté, hygiène, innocence, classe.
- Espoir, vérité, bonté, douceur, tranquillité, calme, raffinement, Divin.
- Deuil en Asie.

Gris

C’est la couleur des costumes de l’administration, des banquiers et des assureurs mais aussi du ciel ombragé, de la poussière. Malgrès des connotations négatives, le gris est une couleur très pratique pour faire des transitions avec d’autres couleurs. C’est une couleur passe partout.

www_mikelipkin_com.png
www.mikelipkin.com

- Sobriété, neutralité, classicisme, conservatisme, professionnalisme, élégance discrète.
- Ennui, mélancolie, tristesse, calme, espoir.
- Saleté, vieillissement.
- Sagesse, plénitude, connaissance, intelligence (matière grise).

Marron

C’est la couleur de la terre rassurante et du terroir. On la trouve en abondance dans la nature aussi bien minérale que biologique. C’est aussi la couleur des uniformes de combats des soldats, de la saleté, des robes de certains moines qui pronne l’humilité et la pauvreté.

www_jpeckjewelers_com.png
www.jpeckjewelers.com

- Stabilité, assurance, ancrage dans les valeurs.
- Saleté, pauvreté, violence.

Bleu

Le bleu fait penser au ciel, à l’eau. C’est la couleur froide par excellence. C’est aussi la couleur des grandes institutions (l’Europe, l’ONU …). C’est une couleur très plébiscité aujourd’hui probablement pour sa discrétion. C’est une couleur qui manque un peu de caractère.

www_thenewline_com.png
www.thenewline.com

- Discrétion, docilité, discipline, sagesse, conformisme, consensualité.
- Calme, sincérité, paix, immatérialité, méditation, rêverie.

Rouge

C’est une couleur franche, chaude, imposante et ambivalente qui s’oppose à la froideur et la discrétion du bleu. On la trouve peu dans la nature, c’est probablement pour cette raison que l’observateur la repère rapidement. C’est une couleur dont la fabrication est depuis longtemps maitrisée par l’homme. On trouve du rouge en abondance dans les peintures rupestres. C’est la couleur du sang, de la chaleur de l’enfer, de la puissance mais aussi de la passion et de l’amour. En politique, le rouge a d’abord été la couleur des aristocrates en Occident puis celle de la révolution et des mouvements politiques de gauches.

www_unfpa_org_endingviolence.png
www.unfpa.org/endingviolence

- La passion, l’amour, la chaleur, le dynamisme, l’excitation, la force, la puissance.
- La violence, la guerre, l’agression, le danger, la peur, l’interdiction.

Jaune

Le jaune est chaud car c’est la couleur du soleil mais aussi du souffre, du citron, du pollen, de la lumière. C’est une couleur sacrée en Asie. Comme le rouge, le jaune est plus rare dans la nature que le brun ou le vert, c’est donc une couleur que l’on repère facilement et qui capte le regard. Cependant c’est la couleur la moins appréciée en Occident. On a aussi associé le jaune à l’automne, au déclin, à la maladie puis à la trahison (couleur de la robe de Judas), à la tromperie, au mensonge, à l’ostracisme (l’étoile juive).

www_i-amonline_com.png
www.i-amonline.com

- Joie, espoir, optimisme, spontanéité, dynamisme, conscience, idéalisme, action.
- Accueil, luminosité, chaleur
- En Asie : prospérité, réussite, intellect, spiritualité, noblesse.
- Inquiétude, exclusion, étranger, apatride, méfiance, trahison.

Vert

Le vert est le symbole de la nature verdoyante. Parmi toutes les couleurs, c’est celle dont nous percevons le plus de nuance. C’est le symbole du printemps donc du renouveau, de la croissance, du renouveau. C’est une couleur assez neutre qui inspire le calme. On trouve également le vert dans le milieu de la finance, c’est la couleur de l’argent. Enfin c’est la couleur de l’instabilité car associé au jeux de hasard, au destin, au sort, à la chance.

exxonmobil_rafflesmuseum_net.png
exxonmobil.rafflesmuseum.net

- Nature, vie, renouveau, santé, guérison, croissance, fertilité, vigueur.
- Propreté, fraicheur, écologie.
- Gratuité.
- Jeunesse, immaturité.
- Calme, relaxation, sérénité.
- Bienveillance, confiance, générosité.
- Instabilité, hasard, chance ou malchance, fortune ou infortune, mauvais oeil
- Sécurité, autorisation, permission.
- Hygiène
- Réussite, statut social, stabilité

Orange

Proche du jaune et du rouge, le orange est une couleur chaude qui inspire la joie, la chaleur, l’énergie, la vitalité. C’est une couleur qui attire l’attention et que l’on rencontre dans le matériel de survie et de signalisation.

www_openfitness_fr.png
www.openfitness.fr

- Chaleur, joie, luminosité.
- Engagement, tonus, santé
- Force, excellence.
- Spontanéité, créativité.

Rose

Le rose évoque immédiatement la fleur du même nom, la délicatesse, le calme, le gout sucré des friandises, la couleur des chambres des petites filles, le romantisme. Le rose apaise, diminue l’agressivité.

www_teamworx_ie.png
www.teamworx.ie

- Tendresse, féminité, douceur, romantisme.
- Apaisement.
- Mièvrerie.
- Rose vif : branché, drôle, énergique.

Violet – Mauve – Pourpre

Peu fréquent dans la nature, il est associé au demi-deuil, à la vieillesse. C’est une couleur peu populaire et parfois associée à la vulgarité lorsque le violet est trop criard.
C’est la couleur des Rois en Occident car la difficulté à l’obtenir la rendait rare et précieuse.

www_cofradiadelbuenjesus_org.png
www.cofradiadelbuenjesus.org

- Pourpre Royale : pouvoir, passion, luxe, richesse, élégance, puissance, autorité, arrogance.
- Mauve : spiritualité, cérémonie, mystère, magie, compromis, médiation, création.
- Mauve : sensualité, intensité, retro, glamour, rêverie.
- Mauve/Violet/Prune : mélancolie, nostalgie, vieillesse, funéraire, dépression.
- Violet lavande : nostalgie, romantisme, tranquillité.
- Fushia : énergie, joie, enthousiasme.

Impact psychologique des couleurs

couleurPsycho.png

Conclusion

Jongler avec les couleurs est un art difficile car leur perception est subjective et très personnelle. Cependant c’est un outil de communication puissant pour les graphistes. En effet, les couleurs ont une longue histoire qui a laissé des traces dans l’inconscient collectif de l’humanité. Il semblerait aussi que les couleurs aient un influence psychologique sur notre comportement et nos ressentis.

En webdesign, il est préférable, sauf cas particuliers, de travailler avec une gamme réduite de couleurs. Cela facilite le travail de cohérence et perturbe moins l’internaute dans sa perception du message. Bien souvent, le webdesigner choisie une couleur dominante neutre pour le fond d’écran et une couleur tonique pour l’emphase des éléments importants.

Lorsque l’on travaille avec les couleurs, il est aussi important de vérifier que l’on a choisi un bon rapport de contraste entre le texte et le fond pour favoriser la lisibilité.

Sources :

- Ouvrage « Le petit livre des couleurs » de Michel Pastoureau & Dominique Simonnet – Edition Panama/Essai
- Ouvrage « L’harmonie des couleurs, le guide » de Tina Sutton & Bride M. Whelan – Edition Pyramyd
- Ouvrage « Graphisme et ergonomie des sites web » de Cristina Barroca – Edition Dunod

2 commentaires
S'abonner aux commentaires via RSS
(URL de trackback)

  • 1. tatou
    le 02.09.08 (12:26)

    très bon article sur la couleur, une suite logique de l’artcile « harmonie des couleurs »

    il ya juste une remarque qui me semble importante concernant la couleur en générale c que vous n’avez pas citer les 7 contrastes de johan itten, pour moi c’est une référence

  • [...] Design : la couleur [...]




Votre e-mail ne sera pas publié.