Vous êtes sur la page 1sur 47

12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Trinity Advise ­ Conseil E­business, Web Management, Formation E­
marketing, E­commerce et stratégie Internet, web marketing
ConseilAudit & stratégie
FormationsEt conférences
ActualitésEt publications
TéléchargezRessources
Le cabinetA propos
LoginEnregistrez­vous

Codes des couleurs pour vendre et communiquer sur le web
You are here: Trinity Advise – Conseil E­business, Web Management, Formation E­marketing, E­commerce et
stratégie Internet, web marketing » Dossiers thématiques » Signification des couleurs en E­marketing et en
Ergonomie Web

Signification des couleurs en E­marketing et en
Ergonomie Web
J’aime 650 personnes aiment ça. Soyez le premier de
vos amis.

.
Sur la demande de plusieurs clients et stagiaires, les consultants­rédacteurs de Trinity Advise se sont mobilisés
pour vous proposer un dossier complet sur les codes couleurs web et la signification des couleurs pour
Internet. Vecteurs de cohérence graphique, les couleurs dictent de nombreux comportements à l’inconscient de
l’internaute. Elle génèrent des réactions et des émotions que nous ne savons pas concrètement évaluer et
chiffrer en e­marketing, sauf avec les nouveaux outils de test d’ergonomie web (eye tracking, mouse tracking,
neuromarketing). Comment sont perçues les couleurs sur Internet, quel est leur impact sur la navigation et
comment influencent­elles les internautes dans le tunnel d’achat ? Voici quelques explications issues de nos
travaux de recherche, qui permettront d’apporter des éclaircissements sur ce sujet. 
.

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 1/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

.
————————————————–

Sommaire :

1. Signification et choix des couleurs pour sites web (vision occidentale)

2. Approche multi­culturelle et religieuse

3. Combinaisons et contraste

4. Jouez avec les couleurs

Annotations et explications complémentaires [x]

En savoir plus

————————————————–
.
Quelle que soit l’approche e­marketing, la plupart des sites à fort trafic ont un objectif de vente de produits,
services ou informations. Or le mode de construction « traditionnelle » de sites internet veut que les entreprises
fassent appel à des agences, des freelances ou des compétences internes. Dans chacun de ces cas, le projet
commence par des propositions de maquettes graphiques internet [1], que ce soit pour un nouveau site ou un
remaniement de page.

En complément d’études d’Eye Tracking (cf. notre dossier complet sur l’eyetracking en ergonomie, ici),
deux, trois ou quatre maquettes au plus, sont présentées au responsable internet, qui décide au feeling du

meilleur template et jette son dévolu sur ce qui sera le futur web­design.  Parfois, la charte
graphique Internet [2] de l’entreprise vient mettre son grain de sel dans ce processus, pour imposer des
couleurs, des formes ou des interpolations de mouvement assez contraignantes face à une lecture sur écran,
voire tout à fait inexploitable sur certains supports digitaux.

En tout état de cause, le choix de la colorimétrie demeure aujourd’hui très subjectif car il ne dépend souvent
que des goûts d’un seul comité de décideurs. Pourtant, un site Internet est une interface de communication et de
promotion dont il faut surtout optimiser le pouvoir d’attraction vis à vis des internautes cibles.

A ce sujet, quelques rares entreprises mettent en place des tests utilisateurs et font appel à des ergonomes pour
valider en amont l’efficacité de leurs maquettes. Une tendance très positive puisqu’avant de confronter les
templates aux internautes testeurs, il est primordial de connaître le sens des couleurs, des formes et des
contrastes perçus sur un écran d’ordinateur. Nous pouvons ainsi qualifier des graphismes déjà optimisés, tant
pour l’image de l’entreprise que pour ses clients en ligne.

Le conseil de Trinity Advise pour choisir les couleurs de votre site :

Afin de préserver une certaine sobriété, nous vous recommandons de ne pas utiliser plus de trois couleurs
différentes pour la charte graphique de votre site. De plus, le choix des couleurs devra correspondre le plus
possible aux couleurs de l’entreprise (cf. couleurs du logo). Nous conseillons d’établir une couleur
prédominante, représentant la majeure partie de la page web, et une ou deux couleurs secondaires plus
dynamiques (plus vives), afin de mettre des composants de la page en exergue.

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 2/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Enfin, notez que les couleurs possèdent une symbolique implicite et influent sur le comportement des visiteurs.
Il est donc essentiel de les choisir en connaissance de cause, avec l’aide des explications proposées dans la
suite de notre dossier : panorama des bons usages et des significations des couleurs pour vos usages sur
Internet.

1. Signification et choix des couleurs pour sites Internet (vision occidentale)

Les couleurs doivent trouver un équilibre fonctionnel basé simultanément sur quatre
niveaux. D’abord du point de vue technique, les couleurs choisies doivent être aussi précises que possible.
Etant donnée la haute définition des écrans de nos ordinateurs, il est tout à fait envisageable de définir des
codes pantone ou CMJN, qui octroient une identité unique au portefeuille graphique. Deuxièmement, le choix
des couleurs doit véhiculer un message cohérent par rapport aux objectifs du site, tout en trouvant un bon
compromis avec la charte graphique existante. Ensuite, le mix des couleurs doit sublimer les éléments
structurels du site, de façon à optimiser les effets de navigation et de perception spatiale. Quatrièmement, en
tant que vecteur d’esthétisme, les couleurs doivent apporter une harmonie à l’univers visuel, pour rendre le site
plus confortable et donc améliorer l’intérêt des internautes cibles. Les couleurs web primaires, secondaires et
tertiaires (cliquez sur l’image pour zoomer)

Répartition des couleurs le long du cercle chromatique

 Pour notre dossier des couleurs sur Internet, nous classerons les couleurs
en trois catégories simplifiées : couleurs primaires, secondaires et tertiaires. Dans les procédés numériques
utilisés sur Internet, les trois couleurs primaires sont le rouge, le vert et le bleu (RVB). Une couleur Secondaire
est ainsi obtenue par le mélange à parts égales de deux couleurs primaires, tandis qu’une couleur tertiaire est
obtenue par le mélange à parts égales d’une couleur primaire et d’une couleur secondaire.

1.1. Les couleurs primaires (mode RVB)

.   Le rouge est l’une des trois couleurs primaires en synthèse additive
[3]. Signe d’énergie ou d’urgence, il est stimulant mais contradictoire. Amour ou colère, courage ou danger,
ardeur ou interdiction, cette couleur touche les sentiments et communique aussi des notions de chaleur et
d’énergie. Pour ne pas tomber dans le piège de ses significations négatives, il est important de l’utiliser avec
tact et parcimonie sur vos pages web. Trop de rouge sang donnera une impression de violence, mais un rouge
riche ou un bordeaux généreux pourront parfaitement donner une impression de force et de passion positive
s’ils sont équilibrés avec des touches de marrons, de noirs ou de blancs.

Significations :
http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 3/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Amour, passion, chaleur, sexualité, ardeur, triomphe, fête, joie, chaleur, ego, puissance, connaissance,
amitié.

Violence, colère, danger, urgence, interdit, sang, enfer.

Représentations :

Feu, lave, sang, fruits rouges (tomate, fraise), fleurs (coquelicot).

Domaines :

Luxe, mode, érotisme, sport, médias, humanitaire, communisme, vin et gastronomie.

Sites exemples :

La croix rouge, rouge agence de com, expo rouge bnf, label rouge, red design

Vidéo d’explication (anglais) :

Colors meanings : Red

Retour – haut de page

Si une couleur est tendance, c’est bien le vert. Signe de nature, de force végétale et de santé, les communicants
ayant besoin d’affirmer une appartenance au courant écolo­bio l’utilisent sans hésiter pour ajouter une touche
de verdure et de nature à leurs sites Internet. En outre le vert apaise et rafraîchit, ses nuances sont assimilées à
la chance et à l’espoir. Pas étonnant donc, que l’on retrouve beaucoup de vert sur les sites de l’univers
pharmaceutique et médical. Il est bien sûr incontournable, couplé avec du marron, pour toutes les pages web
dont le contenu se positionne sur le créneau du respect de l’environnement et du développement durable. En ce
qui concerne les valeurs négatives, le vert peut parfois être porteur d’échecs et d’infortune. Cette signification
superstitieuse touche surtout le monde la culture, car Molière serait mort sur scène en portant un habit vert
sapin. Trop de nature, tue la nature… ?

Significations :

Écologie, partage, patience, concentration, équilibre, repos, sécurité, confiance, tolérance, charité.
http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 4/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Écologie, partage, patience, concentration, équilibre, repos, sécurité, confiance, tolérance, charité.

Malchance, oppression, orgueil, solitude.

Représentations :

Pharmacie et médication (herbes), Arbres (sapin), légumes (haricots, courgettes et petits pois), Plantes
(fougères, aloé véra).

Domaines :

Découverte et aventure, nature, voyage, éducation, environnement et écologie.

Sites exemples :

Expositions à la BNF, green peace, économie solidaire, pharmacie en ligne.

Vidéo d’explication (anglais) :

Colors meanings : Green

Retour – haut de page

Historiquement le bleu est associé aux garçons, contrairement au rose pour les
filles. Il est couleur d’uniforme et donc signe d’autorité. Notez qu’il fut choisi par l’Union Européenne pour
son drapeau mais aussi comme couleur officielle du tri sélectif (les poubelles bleues sont destinées aux
journaux pour le recyclage du papier). Dans une autre dimension, à la fois ciel et mer, le bleu et ses nuances
sont étroitement liés à la sagesse, à la sérénité et au rêve. Couleur de communication, il crée une sensation de
confiance, de vérité et de sécurité, ce qui explique pourquoi de nombreux sites de banques et de conseil
l’utilisent. Couleur préférée des occidentaux, il est aussi écho de la vie, de l’intuition et de la découverte, et
peut avoir un côté rafraîchissant qui le rend très pertinent pour les pages web du secteur de l’agro­alimentaire
ou du voyage. Ses aspects de pureté risquent toutefois d’être amenuisés si son teint est trop foncé et son
utilisation est trop récurrente. Dans ce cas, il est conseillé de trancher avec un peu de blanc, de pastels beiges,
roses ou azur pour l’alléger.

Significations :

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 5/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Sérénité, protection, sérieux, rêve, sagesse, vérité, loyauté, fraîcheur, pureté et paix.

Autorité, colère, peur, dirigisme, mélancolie.

Représentations :

Eau et pureté (océan et sources), ciel, fleurs (lys, bleuet).

Domaines :

Univers « corporate », aéronotique, informatique et nouvelles technologies, environnement, voyage,
croyances.

Sites exemples :

France bleu, LCL, France.fr, Nations Unies, Ifremer, Ushuaia, Agence de l’eau, gan

Vidéo d’explication (anglais) :

Colors meanings : Blue

Retour – haut de page

1.2. Les couleurs secondaires (par synthèse additive numérique, cf. [3])

.   Soleil et bonheur, le jaune est une couleur joyeuse et stimulante qui
apporte du mouvement et véhicule la notion de fête. Pour mettre en avant votre communication évènementielle
ou pour booster des promotions, le jaune vif sera idéal, car il est la couleur de l’ouverture et du contact social.
En revanche, évitez de sur­utiliser le jaune pastel car il est synonyme de maladie et de morosité. Par ailleurs,
trop de jaune signifie le mensonge et la traitrise. Pour atténuer son effet, préférez du marron franc, du noir ou
de l’orange.

Mix de couleurs :

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 6/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Rouge + Vert (synthèse additive, cf. [3])

Significations :

Créativité, curiosité, espoir, fête, joie, chaleur, puissance, richesse, immortalité, amitié.

Lâcheté, égoïsme, mensonge, jalousie, orgueil, alerte.

Représentations :

Poste et coursiers, or, sable, soleil, œuf, fleurs (marguerite).

Domaines :

Tourisme, agro­alimentaire, assurance et crédit, musique, information.

Sites exemples:

Cofidis, yellowprod, pages jaunes, pastis.fr, rencontre.fr

Vidéo d’explication (anglais) :

Colors meanings : Yellow

Retour – haut de page

Aimé ou détesté, le violet est la couleur par excellence des rêveurs, des musiciens et des personnes spirituelles.
Parfois appelé mauve, cette couleur apporte des valeurs d’assurance et de sérénité, elle suggère la douceur, le
rêve et l’épanouissement. Contradictoirement, de nombreux hommes occidentaux perçoivent dans le violet de
l’inquiétude, de la malhonnêteté et de l’instabilité, tandis que les femmes sont plus positives à son égard et
voient en cette couleur des signes de réussite sociale et de fortune. Cette teinte est donc à double tranchant et
peut être difficile à accorder avec d’autres couleurs que le blanc, le noir ou le marron. Préférez là pour un usage

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 7/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

secondaire dans un site internet, pour que des touches de mauve apportent une sensation d’apaisement dans
votre charte graphique.

Mix de couleurs :

Bleu marine + Rouge

Significations :

Délicatesse, intelligence, passion, discrétion, modestie, délicatesse, amitié, méditation.

Mélancolie, excentricité, tristesse, solitude, deuil, insatisfaction, vanité.

Représentations :

Électricité, fruits (raisin, myrtilles, figues), légumes aubergine), fleurs (violette, iris, bougainvilliers).

Domaines :

Art et Culture, luxe, musique, études, croyances, affaires (business) et féminité.

Sites exemples :

Violet studio, villa violet, blog culturel.

Vidéo d’explication (anglais) :

Colors meanings : Purple

Retour – haut de page

C’est la couleur du cliché : pour les filles qui « voient la vie en rose » (en opposition au bleu des garçons).
Signe de rencontre et de séduction, il fait surtout référence à la romance et aux souvenirs des friandises
http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 8/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

acidulées de l’enfance. Utilisé comme couleur principale sur un site, le rose portera de fortes valeurs de
bonheur et de féminité, tandis que s’il est dispersé par petites touches, en contraste avec des univers plus
sombres en fond de page, il apportera une touche de délicatesse et de dynamisme. Soyez prudent avec cette
couleur, qui peut rapidement devenir criarde et impliquer des effets contraires à ceux initialement escomptés
(kitch, trop féminin, trop enfantin).

Mix de couleurs :

Rouge + blanc

Significations :

 Charme, intimité, beauté, féminité, romantisme, séduction, bonheur, tendresse, jeunesse.

Rétrograde, naïveté, indécision, immaturité.

Représentations :

Amour, flamants roses, barbie.

Domaines :

Enfance, confiserie et pâtisserie, loisirs, art et peinture, femmes.

Sites exemples :

Théatre de chaillot, barbie, rencontre en ligne. 
Retour – haut de page 
.
Tweet
 . . 
.

1.3. Les couleurs tertiaires

Définition : En synthèse additive, une couleur tertiaire est une couleur obtenue par le mélange à parts égales
d’une couleur primaire et d’une couleur secondaire.

Tonus, fraîcheur et fruité, l’orange porte bien son nom. Elle
est une couleur forte, riche et acidulée, qui véhicule de fortes valeurs de communication et de créativité.
Utilisée sur les sites Internet, elle apporte de la bonne humeur, de l’optimisme et de l’ouverture d’esprit.
N’hésitez donc pas à utiliser cette couleur très dynamique pour ensoleiller vos pages et vos textes. A bonne
dose, les sites web de nombreux assureurs, organismes de crédit et fabricants de produits agro­alimentaires ont
bien compris que l’orange insuffle du positif dans le tunnel d’achat, surtout lorsqu’il est utilisé en contraste
avec des petites touches de rouge ou de jaune. Attention cependant, une overdose d’orange peut générer un
effet d’agression visuelle ou carrément faire tourner votre graphisme à la mode 70′s.

Mix de couleurs :

Rouge + Jaune

Significations :

 Loisirs, santé et vitalité, optimisme, créativité, communication, honneur, joie, sécurité.

 Feu, alerte, agression, kitch.

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 9/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Représentations :

Fruits et fraîcheur (abricot, orange, melon), soleil, fleurs (tournesol).

Domaines :

Divertissement, sport, forme et fitness, communication et mobilité, agro­alimentaire (fruits).

Sites exemples :

Orange telecom, orangina, club fitness, jusdorange.org

Vidéo d’explication (anglais) :

Colors Meanings : Orange

Retour – haut de page

Le marron est une couleur de mélange, neutre, imprécise
mais riche, qui peut toutefois signifier la sagesse et le temps, à travers la terre et le bois. Maternelle voire
rassurante, le marron trouve ses racines dans tous les éléments de la nature, ce qui lui insuffle de fortes valeurs
de développement durable et d’écologie. Elle est aussi un référent incontournable de la volupté et de la douceur
culinaire à travers les univers du chocolat et du café. Son avantage principal est qu’elle peut être mariée en
fond de page (taupe, beige, crème) avec presque toutes les autres couleurs (surtout le blanc, noir, rose, violet et
bordeaux). Attention cependant de ne pas faire des maquettes qu’en dégradés de marrons, ce qui conférerait à
votre site un contre­effet de désuétude.

Mix de couleurs :

Rouge + Vert + Bleu

Significations :

Calme, philosophie, terroir, nature, recyclage, douceur, neutralité.

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 10/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Saleté, déjections, boue, vieillesse.

Représentations :

Terre, bois, chocolat et café.

Domaines :

Culture, histoire, environnement, confiserie, luxe.

Sites exemples :

Ferrero chocolats, herodote, chacun son café, promod.

Retour – haut de page

1.4. Autres couleurs

D’un point de vue optique, le blanc n’existe pas en tant que couleur,
puisqu’il est la synthèse chromatique de toutes les longueurs d’ondes de couleurs. Pur, équilibré, neutre, le
blanc véhicule surtout des valeurs positives en occident. Il est notamment lié au mariage, à la virginité et à la
religion. Vous pouvez utiliser le blanc comme couleur de fond ou comme couleur de police si votre teinte
principale est assez sombre. Nous vous recommandons d’essayer de le remplacer par des couleurs en pastels ou
crèmes, car le blanc peut rapidement générer un effet de vide ou de contenant creux. De plus, trop de blanc
générera automatiquement un affaiblissement de l’identité visuelle sur Internet.

Significations :

 Pureté, innocence, liberté, paradis, propreté, fraîcheur, richesse, virginité.

Vide, absence, solitude, peur.

Représentations :

 Lait, neige, lumière, Dieu.

Domaines :

Religion, hiver, mariage, mode, actualités.

Retour – haut de page

Teinte hybride, mélange de noir et de blanc, le gris n’est pas tout à fait une couleur, historiquement associé à
des univers de tristesse, de vieillesse voire de mort. Il suffit aussi de constater les éléments qui le représentent
(poussière, souris, béton) pour s’apercevoir qu’il n’est pas très positif au regard actuel des occidentaux.
Pourtant, il se marie très bien avec de nombreuses couleurs vives et peut apporter un bon équilibre de sobriété
ou d’élégance s’il est dispatché par petites touches de sérieux et de rigueur. Autres aspects positifs, le gris

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 11/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

signifie de la neutralité et du respect. Attention cependant, une surabondance de gris implique
systématiquement une impression de tristesse et de mélancolie.

Significations :

Neutralité, respect, calme, douceur, rigueur.

Tristesse, anonymat, solitude, monotonie, mélancolie.

Représentations :

Béton, égouts, pluie, poussière, animaux (souris, éléphants).

Domaines :

Construction, design, école, univers « corporate ».

Retour – haut de page

Mix saturé de toutes les couleurs, le noir n’est pas vraiment une couleur, mais se
marie très bien avec toutes les teintes. Il porte de valeurs fortes et profondément ancrées dans les mentalités
occidentales. Le noir peut être assez dévalorisant dans certains contextes, puisqu’il est lié au deuil, à la peur et
à la tristesse. En revanche, il peut aussi apporter des aspects valorisants aux compositions graphiques de sites
Internet, puisqu’il peut les rendre élégantes, stylées et haut de gamme. Notre conseil : évitez de l’utiliser seul
ou accompagné de gris en fond de page, et préférez des couleurs vives en complément (hors mis le rouge vif
qui signifierait alors le sang et la mort !).

Significations :

 Neutralité, sobriété, volupté, douceur, luxe, nuit, mystère.

Mort, deuil, obscurité, tristesse, monotonie.

Représentations :

Nuit, espace, corbeau, satin, smoking et robe de soirée.

Domaines :

Cinéma, art, photographie, interdit, luxe.

2. Approche multi­culturelle et religieuse :
Selon les régions du globe, les couleurs ne sont pas interprétées de la même façon. Or aujourd’hui l’Internet
brise les barrières géographiques et ouvre les frontières de l’information à de nouveaux horizons.

Il s’agit alors de communiquer ou vendre auprès d’univiers socio­culturels étrangers, souvent très méconnus,
mais lorsque les sites web internationaux sont construits pour s’adresser à des internautes cibles ayant des
visions tout à fait différentes de nos perceptions occidentales, gare aux erreurs de colorimétrie.

Pour mieux comprendre et interpréter les grandes significations des couleurs de par le monde, voici une
infographie remaniée qui apporte des explications pertinentes.

Si vous souhaitez obtenir la version haute définition de cette carte, vous devez être membre. Créez un compte
(gratuit) sur notre site, ici. Vous recevrez un e­mail de confirmation contenant le code d’accès à notre espace
« boîte à outils » dédiée à l’ergonomie web, ou vous aurez accès au fichier et à d’autres téléchargements

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 12/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

dédiés.  Infographie en haute définition disponible pour les membres ici. 

Pour télécharger cette fiche sur les couleurs en chine, en haute définition, vous devez être membre.

Créez un compte (gratuit) sur notre site, ici.

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 13/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Téléchargez la Fiche E­
marketing N°4 : Ergonomie ­ Les codes couleurs en Chine (59).

Retour – haut de page

3. Combinaisons et contrastes
Le cycle des couleurs

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 14/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Ci­contre, le cycle des couleurs, ou cercle chromatique, est une sorte de roue sur laquelle
se positionnent progressivement des différentes couleurs correspondant aux trois degrés de base de l’univers
chromatique : primaire, secondaire et tertiaire. Il permet d’identifier les teintes et indique leur concordance et /
ou possible co­habitation. Sur cette roue de couleurs, on trouve les couleurs froides (des verts au violet en
passant par les bleus) ainsi que les couleurs chaudes (depuis les rouges vers l’orangé jusqu’aux teintes de
jaune).

Les couleurs analogues

Les couleurs analogues sont celles qui se positionnent de façon directement mitoyenne
dans le cercle chromatique. Elles offrent souvent des trios de couleurs très présents dans la nature. De ce fait,
des pages web les utilisant offrent généralement un graphisme cohérent, riche et harmonieux.

Les couleurs complémentaires

Les couleurs complémentaires sont positionnées de façon diamétralement opposée dans
le cercle chromatique. Ces couleurs sont toujours contrastées et très démarquées graphiquement l’une de
l’autre. Lorsque l’on utilise une teinte donnée en fond d’écran, sa couleur complémentaire est souvent le
meilleur compromis pour colorier les textes et les petits blocs d’information.

Les couleurs complémentaires par analogie

Les couleurs complémentaires par analogie (split complémentaire) correspondent à un
trio de teintes permettant de donner un design avec un haut degré de contraste, toutefois moins fort que celui
créé avec la couleur complémentaire directe. Il s’obtient en utilisant les deux couleurs voisines d’une teinte et
en les utilisant avec la couleur opposée de cette teinte. 
.

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 15/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Analogie triangulée (triade isocèle).

Les couleurs obtenues par analogie triangulée sont des teintes équidistantes dans le cercle
chromatique (triangle isocèle). L’avantage de ce type de combinaison pour les sites web est qu’il donne des
jeux de couleurs équilibrés mais très colorés et vifs. Utilisez­les de préférence pour des sites ayant besoin de
véhiculer des valeurs de dynamisme et de création.

————————————————–

Retour – haut de page

Module de choix de couleurs web : générez des teintes, des contrastes et des thèmes de couleurs pour votre site internet. Cliquez
ici pour l’essayer.

 Rendez­vous sur la page
du sélecteur de couleurs web, ici. Retour – haut de page ————————————————–

4. Jouez avec les couleurs

Découvrez le sens des couleurs avec une approche ludique ! Ici.

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 16/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

————————————————–

Annotations et explications complémentaires :

[1]  Une maquette graphique Internet (en anglais « template »
ou « web design ») est un prototype épuré de page web présentant les éléments graphiques, la navigation et la
colorimétrie du futur site.

La maquette permet de formaliser les aspects conceptuels du site et constitue généralement l’étape de
validation de cette phase, pour ensuite passer à la phase de réalisation. Dans certains cas, la maquette graphique
peut parfois être déclinée en plusieurs exemplaires relativement aboutis, afin de de les faire tester par des
internautes et ainsi choisir le meilleur modèle. La plupart des agences web proposent deux à trois maquettes
graphiques avant de concevoir la version finale d’un site. En savoir plus, ici. et là.

[2] On appelle « charte graphique Internet » (en anglais graphic charter) le document de synthèse qui
récapitule les règles de présentation des composants graphiques d’un site Internet, traduisant son identité
visuelle. Elle définit l’habillage graphique de la page : tailles et gabarits, couleurs et apparences des textes,
images et boutons, positionnement relatif des composants de la page. Plus d’info ici.

[3] La synthèse additive des couleurs est l’opération consistant à combiner la lumière de plusieurs sources

émettrices colorées afin d’obtenir une nouvelle couleur.  En synthèse additive, les couleurs
http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 17/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

primaires généralement utilisées sont au nombre de trois : le rouge, le vert et le bleu (RVB ou RGB). –
L’addition de ces trois couleurs donne du blanc. – L’absence de couleur donne du noir. – L’addition deux à
deux de ces couleurs primaires permet d’obtenir les couleurs secondaires.

Autre mode d’analyse en colorimétrie, la synthèse soustractive des couleurs est l’opération consistant à

combiner l’effet d’absorption de plusieurs couleurs afin d’en obtenir une nouvelle.  Par exemple,
la superposition sur une surface blanche de deux filtres colorés, l’un jaune et l’autre bleu, permet d’obtenir du
vert. Une couleur obtenue par synthèse soustractive de plusieurs autres sera forcement plus sombre qu’elles. En
synthèse soustractive, les couleurs primaires sont au nombre de trois : le cyan, le magenta et le jaune + le noir
(d’où le CMJN). En savoir plus, ici.

——————————————————————–

Retour – haut de page

Téléchargements complémentaires :

Pour télécharger les fichiers, vous devez être membre. Créez un compte (gratuit) sur notre site, ici. 
.
Fiche E­marketing N°2 : Signification des couleurs pour le web (occident) (229)

Fiche E­marketing N°5 : Couleurs, Equivalence Hex <> RVB (96) 
.

En savoir plus / Liens externes :

­ Tous les noms des déclinaisons de couleurs par ordre alphabetique

­ Faire un audit des couleurs de son site

­ Utilisation des effets de lumière sur les couleurs

­ Lexique du graphisme et des couleurs

­ Tutoriel vidéo pour l’utilisation des couleurs web avec Illustrator.

­ Recommandations de Microsoft sur l’usage des codes couleurs pour Internet.

­ Liens de signification entre couleurs et musique.

­ Signification des couleurs en religion et en ésotérisme.

J’aime 650 personnes aiment ça. Soyez le premier de
vos amis.

top

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 18/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

15 reponses to “Signification des couleurs en E­marketing et en Ergonomie Web”

1. 
aaccord says:
18 janvier 2011 à 10:46

Mille mercis pour dossier complet très instructif. Les couleurs ont effectivement des significations
différentes selon que l’on a un point de vue européen ou asiatique. +1 ! 

2. 
Nicolas BOURNEZ DESVIGNE says:
18 janvier 2011 à 2:32

Bonjour,

Nous avons complété le dossier de la signification des couleurs web avec une page dédiée aux outils de
choix de couleurs pour sites internet, ici : 
http://trinity­advise.com/outils/codes.couleurs.web/codes.couleurs.internet.html

3. 
Stadelmann says:
19 janvier 2011 à 10:23

Bonjour et merci pour cet article complet et enrichissant. On oublie parfois tout le sens que peuvent
porter des couleurs mais aussi l’influence de la mode et des cultures.

4. 
jem_svenska says:
10 février 2011 à 10:56

Je suis tombé sur cet article en faisant mes recherches 
pour mon mémoire (la génération 2.0 chinoise: nouveaux marchés et 
tendances web). Excellent article! Rien de mieux que cette 
confirmation pour les suppositions que j’avais de l’interprétation 
des couleurs par un utilisateur chinois. Merci !

5. 
Matthieu ­ Blog Business / Webmarketing / Management says:
13 février 2011 à 10:10

Bonjour,

Un grand merci pour ce formidable dossier, très complet et bien détaillé. L’approche culturelle est
vraiment un plus dans ce type d’article! Bravo

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 19/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

6. 
Parapharmacie discount says:
8 mars 2011 à 5:30

Article très intéressant

7. 
valérie says:
9 mars 2011 à 2:30

J’ai partagé cet article sur mon blog, sur facebook, je le trouve excellent ! détaillé, précis, visuellement
très réussi et agréable à lire et à relire !   ) 
Merci beaucoup ! 
Valérie

8. 
zanskar says:
11 mars 2011 à 10:01

Bonne synthèse et l’approche culturelle est intéressante pour ceux qui vendent à l’export

9. 
henri ungar says:
17 juin 2011 à 11:11

je suis enseignant, et j’ai trouvé vos explications très riches pour compléter mes cours à des élèves en
BTS , sur l’élaboration d’un cahier des charges d’une charte graphique

10. Conception d’un site e­commerce : le choix des couleurs | idealo.fr/blog | News, Trends & Facts says:
9 février 2012 à 2:07

[...] de consultants­rédacteurs de Trinity Advise publiait en janvier 2011 un dossier sur la signification
des couleurs en E­marketing et en Ergonomie Web. Leur étude comprend plusieurs aspects : la
signification et le [...]

11. 
Noyau says:
29 mai 2012 à 9:47

Très bon article qui synthétise parfaitement toutes les notions essentielles sur les couleurs leur sens et
accommodations. Cela fait pas mal de temps que je cherche toutes ces informations et elles sont ici
parfaitement synthétisées.

Merci beaucoup

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 20/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

12. 
Charles says:
10 juillet 2012 à 11:24

Un article tout simplement top ! si on ne connait pas, c’est utile si on connait, c’est bien de relire ! a
garder sous la main !!

13. 
danielle says:
3 novembre 2012 à 7:02

je trouve sa très jolie cava me servie pour mes modèles merci encore

14. 
Nom says:
23 janvier 2013 à 10:19

Bonjour, 
Pourais­je savoir qui est ou sont l’auteur de cet artcicle svp?:) 
PS: très bon article   
Merci de me répondre.

15. 
Margaux says:
25 octobre 2013 à 11:13

Super article, merci beaucoup.

Ecrire une reponse ou un commentaire

Nom  Name (required)

E­Mail Adress  Mail (will not be published) (required)

Site web  Website

Submit

Recherchez sur le site
http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 21/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

  Search 

Catégories des parutions
Choisir une catégorie

Suivez­nous !

Flash News – Twitter

Like 7 people like this. Be the first of your friends.

Vidéo à la une

'What google knows about you ?', interview sur CNN d'Eric Schmidt, CEO de Google.

Abonnez vous à nos publications

Abonnez­vous

Publications récentes

Eye Tracking en Ergonomie Web et en E­Marketing : définitions, explications et dossier complet sur
l’oculométrie

Sommaire : 
1 – Introduction : les bases de la lecture écran /web 
2 – Eye tracking : comment ça marche 
http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 22/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

3 – Matériel et outils 
4 – Logiciels 
5 – Utilisation et Interprétation 
6 – Acquisition d’outils ou achat de prestations 
7 – Conclusion : chiffres, théories et mobilité 
____________________________________________________________________________________

1. Les bases de la lecture écran / web et de l’eye­tracking

Avec l’émergence [...]

Gérer les bloggeurs pour optimiser sa E­réputation

Une marque peut devenir très cotée sur internet sans avoir besoin d’utiliser sa planche à billets  notamment en
se servant des bloggeurs, véritables seigneurs qui ont le pouvoir de vie et de mort sur leurs terres digitales. 
Mais comment faire en sorte que ces web­influencers parlent positivement de la marque ? 
La réponse n’est pas évidente [...]

Un petit cours illustré de social Media

Si les marques ont indéniablement compris l’importance des médias sociaux dans leurs stratégies marketing,
elles ont parfois du mal à en saisir les us et coutumes. 
Trois niveaux d’utilisation des réseaux sociaux sont généralement opérés par les marques. 
Le premier niveau concerne les entreprises un peu dépassées par l’évolution d’internet qui se contentent de
communiquer, d’envoyer des [...]

Savoir initier une démarche en S.M.O (Social Media optimization)

Depuis quelques années, les entreprises réalisent que l’évolution du digital et l’émergence des communautés en
ligne les obligent à revoir leurs stratégies marketing. Et lorsqu’elles celles­ci se décident à créer un plan de
social media, les résultats et le succès sont assez divers. Trinity Advise vous avait déjà présenté le S.M.O
(Social Media optimization) ici. [...]

Burberry : Le luxe maîtrise le e­marketing

Alors qu’on imagine l’univers du luxe plutôt sur les défilés de mode ou sur l’avenue Montaigne, il paraît
incongru d’imaginer les grands noms de la couture dans l’e­commerce. Pourtant Burberry renverse les clichés
et démontre par ses récentes initiatives digitales que le luxe s’acclimate à merveille aux nouvelles technologies. 
Pour sa dernière campagne de prêt à [...]

Les marques investissent le social gaming

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 23/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

53 millions : c’est le nombre d’internautes américains qui ont joué au moins une fois à un jeu via un réseau
social. Et la tendance va s’accélérer, les experts s’attendant à une progression de 28% en 2011 pour atteindre
plus du ¼ des internautes américains. 
Le plus connu d’entre eux est sans doute le jeu FarmVille [...]

Une e­publicité fruitée et efficace

Comment s’assurer que la publicité interactive de demain sera aussi bonne que celle d’aujourd’hui ? La
réponse nous vient d’une entreprise dont plus de 80% des volumes dépendent de la pub et qui elle aussi est
plutôt bonne sur le sujet, Oasis. 
Depuis quelques années, la marque de boissons a abandonné le refrain de Carlos 1 [...]

E­merchandising innovant : après le e­commerce et le m­commerce, voici le TF1­commerce

Le fameux label « Vu à la télé » ne suffirait­il plus ? D’après un sondage réalisé par la régie publicitaire de TF1
(1ère chaine TV privée française), 77% des téléspectateurs sont prêts à aller sur un site web pour obtenir plus
d’informations sur les produits « vus à la télé ». Comme si les [...]

Keywords cloud

Analyse et tracking CMS  Dossiers thématiques Droit Internet E­business E­commerce E­
communication E­mailing  E­marketing E­merchandising E­publicité E­réputation Ergonomie web Evènements
Geek attitude Internet Logiciels Marketing Mobile / Téléphonie Matériel / Hardware Media News Réseaux
sociaux SEO­SEM Social Media Syndication et collaboration Systèmes d'information Technologies Trinity Advise
Web Design

Like 7 people like this. Be the first of your friends.

Login

Nom d'utilisateur : 

Mot de passe : 

 Se souvenir de moi

Login »

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 24/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

Enregistrement
Perdu votre mot de passe ?

Rubriques du blog
Choisir une catégorie

Recherche

  Search 

Suivez­nous

Parutions

Eye Tracking en Ergonomie Web et en E­Marketing : définitions, explications et dossier complet sur
l’oculométrie

Sommaire : 
1 – Introduction : les bases de la lecture écran /web 
2 – Eye tracking : comment ça marche 
3 – Matériel et outils 
4 – Logiciels 
5 – Utilisation et Interprétation 
6 – Acquisition d’outils ou achat de prestations 
7 – Conclusion : chiffres, théories et mobilité 
____________________________________________________________________________________

1. Les bases de la lecture écran / web et de l’eye­tracking

Avec l’émergence [...]

Gérer les bloggeurs pour optimiser sa E­réputation

Une marque peut devenir très cotée sur internet sans avoir besoin d’utiliser sa planche à billets  notamment en
se servant des bloggeurs, véritables seigneurs qui ont le pouvoir de vie et de mort sur leurs terres digitales. 
Mais comment faire en sorte que ces web­influencers parlent positivement de la marque ? 
La réponse n’est pas évidente [...]

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 25/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

© Copyright Trinity Advise – Conseil E­business, Web Management, Formation E­marketing, E­commerce et
stratégie Internet, web marketing Tous droits réservés ­ Informations légales ­ Politique de Confidentialité ­
Site déclaré auprès de la CNIL

RSS

top
Expand
next previous
Close

Previous

0/0

Next

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 26/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 27/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 28/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 29/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 30/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 31/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 32/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 33/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 34/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 35/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 36/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 37/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 38/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 39/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 40/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 41/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 42/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 43/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 44/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 45/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 46/47
12/11/2016 Signification des couleurs en E­marketing et en Ergonomie Web | Conseil Internet, Formations E­Marketing | Trinity Advise

http://trinity­advise.com/choix­de­couleurs­pour­mieux­vendre­et­communiquer­sur­le­web/ 47/47