La couleur et le designer web : un duo très spécial

10 janvier 2014
Par

Un billet de Caroline Jouneau-Sion, Joachim Chevry et Karine Bazouni-Marteau.

Les couleurs ne sont pas seulement de  redoutables "intercalaires", utilisées pour classer, trier des éléments, elles servent aussi à véhiculer une information. L’interprétation de cette information repose sur notre expérience personnelle, sur notre contexte culturel et sur quelques principes physico-physiologiques presque pas difficiles à comprendre. Et que les webdesigner, eux, ont bien compris.

La perception dépend du contexte culturel

ou Dis-moi ta couleur préférée, je te dirai qui tu es… 

Prenons le rouge comme exemple. On voit rouge quand on est en colère à perdre le contrôle, les bonnets de la révolte (des révoltes, à lire le blog d’Enklask) bretonne sont rouges. Le rouge est la couleur du drapeau révolutionnaire et de la toge des empereurs et des papes. C’est aussi le rouge des bouquets amoureux, du petit Chaperon Rouge et de l'enfer. Dans cette apparente ambivalence, tout n’est pas hasard et contradiction : le rouge du pouvoir c’est celui d’une matière colorante difficile à obtenir et donc très coûteuse, une matière luxueuse. C’est aussi pourquoi la mariée est en rouge dans l’occident moyenâgeux : elle revêt sa plus belle robe.

La perception d'une couleur, sa symbolique, l'effet qu'elle produit sur nos cerveaux dépend du contexte dans lequel elle s'exprime. Le contexte culturel est important : en Chine la robe rouge est celle de la sage mariée, dans l’occident contemporain celle de la séductrice (faites une recherche Google avec les mots-clef "robe" et "séduction" pour voir...).

le rouge séduction

Parfois la symbolique est utilisée comme une arme, avec plus ou moins de succès : les protestants déclarent immorale la couleur rouge qui est celle du Pape (c’est bien d’avoir essayé…) ; en 1263 à Strasbourg la guilde des marchands de garance (rouge) commande un vitrail pour la cathédrale : le contrat demande à ce que le diable soit bleu, pour donner une valeur négative à cette nouvelle couleur qui devient à la mode et menace de ruiner leur commerce (Une histoire qu’a racontée Michel Pastoureau dans sa conférence en ligne que vous trouverez ici). Ce geste un peu désespéré n’a pas empêché le bleu de devenir la couleur préférée de la plupart des européens.

Les couleurs du web

source : colorlovers.com

D’ailleurs sur le web, le bleu et le rouge restent les couleurs préférées des utilisateurs et donc les plus utilisées. Le logo de Baidu, le fameux moteur de recherche chinois, contient un bleu et un rouge extrêmement proches de celui qu’utilise Google pour son logo. Est-ce à dire que le web fait disparaître les différences culturelles dans la perception des couleurs ? Un petit tour sur le web pourrait nous en persuader : Youku, plateforme chinoise de partage de vidéos, et Youtube, son concurrent americain, sont très similaires en terme d’identité visuelle. Plus frappante encore, la ressemblance entre Renren, le site de réseaux sociaux pour étudiants chinois et Facebook. Même remarque pour les couleurs de Xaxin, QQ et Tudu qui nous rappellent étrangement Instragram, Blogger et Dailymotion.

Assisterait-on à une décontextualisation de la couleur, à la mise en place d’un code de couleurs universel ? Le bleu serait utilisé pour la communication et le social. Le jaune pour capter l’attention. Le vert pour valider une action et le rouge pour la supprimer ou l’annuler. Ça fait frissonner…

Le guide des émotions en couleur

source : Buffer

Mais rien n’est si simple… La perception de la couleur est aussi une question de domaine d’application. Du rouge sur un coeur c'est l'amour passionné, en politique un indicateur d'engagement à gauche, sur une voiture c'est l'idée du luxe. Sur une canette en métal c’est un soda, sur un manteau c’est le Père Noël (je sais, ce n’est pas un hasard). On retrouve cette idée de domaine d’application dans la législation française sur la propriété : s’il est impossible de déposer un brevet sur une couleur, il est possible de s’en réserver une dans un domaine donné : impossible d’utiliser du bleu Milka si vous vendez du chocolat, ou du orange dans le domaine de la téléphonie. Inversement, impossible de vous réserver du vert si vous déposez un logo ou un brevet dans le domaine agricole.

Ainsi, si la symbolique des couleurs est universelle dans le domaine du numérique, elle pourrait reprendre une composante culturelle lorsqu’elle change de support. Un Chinois ne donnera pas la même signification au rouge du site web qu’il visite et au rouge de la robe traditionnelle de sa promise…

Le rôle des voisines

La symbolique est donc une composante importante de la perception des couleurs, mais en réalité ce sont surtout ses voisines qui donnent à une couleur sa signification. Le petit chaperon est rouge ? Pour Michel Pastoureau, il est surtout entouré de blanc (le petit pot de beurre) et de noir (la robe de la grand-mère), les trois couleurs fondamentales en occident au moyen-âge. Sur les miniatures de ce psautier du XIIIème s (extrait de la conférence de M. Pastoureau toujours), l’important n’est pas que la pomme soit rouge sur la première de ces pages, puisqu’elle est bleue à la page suivante.

Psautier
Psautier du XIIIème siècle, source M. Pastoureau
Psautier
Psautier du XIIIème s, source M. Pastoureau

En revanche, les deux couleurs bleu et rouge qui sont opposées au moyen-âge symbolisent l’opposition du bien et du mal. L’alliance des couleurs est parfois puissante : ajoutez du jaune au rouge et vous susciterez la faim. Ce n’est pas pour rien que le logo de ce fabricant de burgers bien connu les combine. Dans le logo Redbull, le bleu et le rouge associés prennent une autre dimension, en combinaison avec le jaune.

 Ici, le rouge communique sur l’aspect énergétique, celui qui vous fera tenir jusqu’au bout de la nuit (merci la taurine, molécule énergisante controversée ), et le bleu ne s’oppose pas, il rassure quant à l’utilisation d’une boisson qui, non-non, n’est pas du tout dangereuse pour votre coeur, la preuve, c’est un succès. Le jaune représente le soleil, la vie, le bonheur auquel nous aspirons tous. C’est ainsi qu’une marque accroit son identité visuelle et influence les acheteurs : la majorité des consommateurs que nous sommes choisit un produit pour son aspect visuel. Hé oui. C’est expliqué ici.

Voilà, vous savez tout sur la couleur du web. Elle s’appuie sur une longue histoire, a bénéficié des progrès de la connaissance scientifique, d’un vecteur qui la diffuse sur toute la planète… et s’est mise au service d’une économie basée sur la consommation.

Allez, tu peux me le dire maintenant… c’est quoi ta couleur préférée ?

Quelques liens pour aller plus loin (un internaute averti en vaut deux)

http://www.worqx.com/color/index.htm

http://pourpre.com/

http://www.lexpress.fr/culture/livre/1-le-bleu-la-couleur-qui-ne-fait-pas-de-vagues_819768.html

http://www.lexpress.fr/culture/livre/2-le-rouge-c-est-le-feu-et-le-sang-l-amour-et-l-enfer_819788.html

http://www.lexpress.fr/culture/livre/3-le-blanc-partout-il-dit-la-purete-et-l-innocence_819800.html

http://www.lexpress.fr/culture/livre/4-le-vert-celui-qui-cache-bien-son-jeu_819807.html

http://www.lexpress.fr/culture/livre/5-le-jaune-tous-les-attributs-de-l-infamie_819822.html

http://www.lexpress.fr/culture/livre/6-le-noir-du-deuil-a-l-elegance_819830.html

http://www.lexpress.fr/culture/livre/7-les-demi-couleurs-gris-pluie-rose-bonbon_819839.html

http://www.incredibleart.org/lessons/middle/color2.htm

http://fr.wix.com/blog/2013/11/04/web-design-lutilisation-couleurs/


Imprimer ce billet Imprimer ce billet

Posté dans : Billets, Histoire des médias et du web

3 commentaires pour “ La couleur et le designer web : un duo très spécial ”

  1. Mathilde Buleté-Herbaut le 16/12/2014 à 11:04

    Les différences culturelles soulevée sur la perception du rouge sont intéressantes dans le sens où un symbole n'aura jamais le même sens en fonction de son contexte. Permettez-moi de nuancer un peu votre propos. Il n'existe selon moi pas un rouge mais "des" rouges, qui ont d'ailleurs des significations très différentes et doivent être utilisés comme vous l'avez démontré en connaissance de cause.

    Le rouge profond par exemple est celui qu'on associe généralement au luxe. Il est élégant, rafiné, très mature. C'est le rouge des tapis de cérémonies, de l'intérieur des boîtes à bijoux de luxe. Le rouge brique, un peu plus sombre, véhicule des valeurs fortes et chaudes. C'est le côté "cuisson" du rouge, celui qui donne un aspect traditionnel à une interface. On trouve aussi le rouge "ginger", qui tire sur l'orangé. Sa couleur épicée et exotique l'associe plus facilement avec des sujets qui tournent autour de la nourriture.

    Il n'y a que le rouge vif dont vous exposez d'ailleurs très bien les différents aspects qui ait une "double face" tranchante. Il véhicule des valeurs "positives" ou en tout cas vendeuses comme la séduction, mais peut devenir également très agressif utilisé à mauvais escient.

    On peut d'ailleurs se rendre aisément compte de toutes les variantes de rouges qui existent et des différentes émotions ou contextes qu'ils suscitent chez les utilisateurs en se rendant sur le site de création de palette de couleurs de Adobe.

    Je trouve que l'utilisation de la couleur comme vecteur de sens est d'autant plus complexe que tous les utilisateurs n'ont pas accès à l'intégralité de sa perception. Certains souffrent de différents types de Daltonisme qui rend très délicat la conception d'une interface comprise de manière unique. Les seules constantes qui ne sont pas trop modifiées d'un type de daltonisme à l'autre, ce sont les bleus. C'est d'ailleurs la raison pour laquelle facebook est bleu, Mark Zuckerberg souffrant de daltonisme, c'est la couleur qu'il perçoit le mieux.

    Enfin, je trouve très justifié de parler de "concurrence" de couleurs au niveau des entreprises. La forme et la couleur de logotypes sont nettement reconnaissables. Ca a d'ailleurs été le centre d'un jeu sur smartphone : Logo Quiz. Avec un petit bémole cependant, la vache Milka est violette, et non bleue ;)

  2. afaraldi le 16/12/2014 à 10:35

    Un billet très intéressant sur la place qu'occupent les couleurs dans notre perception du monde "physique" mais aussi "numérique".
    On a ainsi l'impression que selon les canaux utilisés, la période où l'information est délivrée, l'aire géographique visée, les stratégies des designers liés à la couleur ne seront pas les mêmes. On sait d'ailleurs, que les couleurs jouent un rôle d'autant plus important pour des objets transcanaux, car elles constituent un repère (par exemple pour un événement, il est mieux que les couleurs du site et celles affichées lorsqu'il se déroule soient les mêmes, les couleurs du site de la sncf ne sont pas sans rappeler en partie celles de ma carte de réduction..., sncf bien sûr).
    En revanche, on peut ajouter que le genre a lui aussi son rôle à jouer comme l'évoque cet article de slate : http://www.slate.fr/lien/71709/petite-psychologie-couleur-marketing (j'en profite pour qu'on le sache une fois pour toute : non, le rose n'a pas toujours été la couleur féminine par excellence, étant donné qu'il se rapprochait plus du rouge vif à l'origine il évoquait le rouge des pantalons militaires, étant ainsi plus facilement attribué aux hommes ; pareil pour le bleu, qui a été pendant très longtemps la couleur de sainte vierge avant tout, et ainsi associé ainsi à la pureté virginale, cf. http://www.femininmasculin.org/du-bleu-pour-les-filles-et-du-rose-pour-les-garcons-et-alors/).
    Un denier point que j'aimerais souligner. Après avoir vu cette vidéo (https://www.youtube.com/watch?v=fYuJZH0TzL8) sur les couleurs complémentaires, j'en avais déduit (pauvre naïve) qu'un webdesigner devait toujours rechercher un certain équilibre entre les couleurs, afin de favoriser un certain apaisement visuel et de susciter l'envie de continuer la navigation sur un site... Et bien apparement le mix des couleurs a lui aussi pour but de faire réagir, de provoquer quelque chose d'attendu chez l'utilisateur. Il ne s'agit pas de le laisser de marbre devant son écran !
    Merci, de m'avoir ouvert les yeux.

  3. Remy le 11/02/2014 à 0:05

    Juste pour info le manuscrit que vous montrez n'est pas tiré d'un psautier mais du Speculum humanae salvationis, le psautier arrive juste après dans sa conférence, avec la scène de la flagellation.

Laisser un commentaire

Master Archinfo

> Référentiel de compétences

> Présentation, Programme, Candidature

> INF01 Introduction à l’architecture de l’information