Advertisement
  1. Web Design
  2. Design Theory

Définir et reconnaître les couleurs

by
Read Time:4 minsLanguages:
This post is part of a series called Design School for Developers.
Introducing Wireframes to Your Design Process
Understanding the Qualities and Characteristics of Color

French (Français) translation by Henri Lotin (you can also view the original English article)

Lorsque vous designez pour n’importe quel support - et pas seulement sur le web - la façon dont vous utilisez la couleur dans vos créations aura un impact comment ce design est perçu, compris et interprété. Il est important de se rappeler que la couleur fait ressortir les émotions (bonnes et mauvaises) aussi bien chez les individus et dans la culture.

Vous référant en grande partie à votre phase de recherche, il est sage de s’assurer que vous comprenez votre audience cible et comment la couleur l'affecte. Ensuite, vous pouvez gérer le design du site web et ce à quoi le site ressemble et se comporte à travers l’utilisation habile de la couleur.

Avant que vous puissiez commencer à travailler avec la couleur dans vos créations, vous devez mieux comprendre ce que la couleur est. Cela peut sembler assez ridicule - bien sûr, vous connaissez la différence entre rose et bleu - mais c’est vraiment plus sur la compréhension de la différence que la couleur peut faire dans le design ; Comment la couleur évoque les sentiments chez une personne ou dans culture et comment la couleur peut être utilisée efficacement dans vos créations pour aider à faire de meilleures expériences pour vos utilisateurs.


Le cercle chromatique

Une roue chromatique est un diagramme qui montre les teintes de couleurs principales et comment ces couleurs se rapportent les unes aux autres. Les roues chromatiques les plus courantes disposent de six ou douze couleurs.

color-wheelcolor-wheelcolor-wheel

Les couleurs principales de la roue (rouge, orange, jaune, vert, bleu et violet) sont représentés sur les deux roues, avec l’ajout éventuel de six couleurs supplémentaires (rouge-orange, jaune-orange, jaune-vert, vert-bleu, bleu-violet et rouge-violet).

Comme vous pouvez le voir, toutes les couleurs supplémentaires sur la couleur de plus grande roues se rapportent aux couleurs principales qui sont déjà là - en effet, ils sont « entre-deux » des couleurs originales elles-mêmes.


Couleurs primaires

Vous reconnaîtrez sans doute celles-ci comme étant les trois couleurs primaires : rouge, bleu et jaune.

color-wheel-primarycolor-wheel-primarycolor-wheel-primary

Les couleurs primaires sont les couleurs de base de toute roue chromatiques et du spectre des couleurs dans son ensemble. Pour créer n’importe quelle autre couleur, vous devrez utiliser une combinaison de deux ou trois des couleurs primaires.


Couleurs secondaires

Elles sont violet, orange et vert.

color-wheel-secondarycolor-wheel-secondarycolor-wheel-secondary

Les couleurs secondaires sont créées lorsque vous mélangez deux couleurs primaires. Celles-ci se trouvent également juste en face de couleurs primaires sur la roue chromatique, comme elles sont des couleurs entre les deux qui ont été mélangées pour rendre cette couleur secondaire.

Remarque : Nous faisons référence à ces dernières couleurs opposées, contrastées comme étant complémentaires - lorsqu’elles sont mélangées, ces combinaisons complémentaires (par exemple rouge + vert) produisent une couleur neutre.


Couleurs tertiaires

Les couleurs tertiaires sont créées lorsque vous mélangez un primaire et une couleur secondaire. Par conséquent, il y a des couleurs plus tertiaires que primaires ou secondaires, en raison de plus de combinaisons qui peuvent être faites.

color-wheel-tertiarycolor-wheel-tertiarycolor-wheel-tertiary

Sur la roue chromatique, celles-ci se situent entre chacune des couleurs primaires et secondaires.


Familles de couleurs

Quand je pense aux couleurs, il existe deux grandes familles élémentaires qui ressortent pour moi - les couleurs chaudes et couleurs froides. Une petite astuce qui rend facile à déchiffrer à quelle famille les couleurs appartiennent, est de diviser la roue des couleurs en deux moitiés.

Couleurs chaudes

Les couleurs qui appartiennent à la famille chaudes sont les rouges, oranges et jaunes. Toutes celles-là évoquent un sentiment de chaleur de certaines manières - rouge est passionné et fougueux, et orange et jaune sont estivales, comme le soleil.

color-wheel-warm-familycolor-wheel-warm-familycolor-wheel-warm-family

Couleurs froides

les couleurs qui appartiennent à la famille froide sont les bleus, les verts et les violets de la roue chromatique. Celles-ci évoquent naturellement un sentiment plus calme que les autres couleurs, elles sont plus discrètes que les couleurs chaudes, reliant plus étroitement à l’eau, la nature et autres.

color-wheel-cool-familycolor-wheel-cool-familycolor-wheel-cool-family

Significations de la couleur

Tout d’abord, c’est une bonne idée de commencer à apprendre ce que signifie chacune des couleurs principales. Il est important de se rappeler que chaque couleur aura une signification différente selon la personne à qui vous vous adressez et où que vous soyez dans le monde. N’oubliez pas que, comme la population est large, les couleurs ont souvent des significations personnelles pour des individus ou des groupes. Cela signifie que bien que l’interprétation classique (ou supposée) de cette couleur peut signifier une chose, comment un individu interprète cette couleur peut être complètement différent.

En design web - ou n’importe quel design, vraiment - vous ne pouvez jamais vous permettre de faire des hypothèses rigides sur vos utilisateurs. Toutefois, la couleur est un domaine où il y a une petite exception à apporter. Comme la couleur évoque une signification personnelle pour chaque individu, il faut essayer d’y aller avec la supposition la plus large de ce qu’une couleur peut signifier pour votre audience cible - sauf si vous êtes assez chanceux d'avoir plus de recherches et informations adaptées qui se prêtent à choisir des palettes de couleurs dans votre projet.

Vous devez également penser à comment votre couleur sera utilisée - à la fois dans un sens pratique sur le web, mais aussi physiquement par ceux qui utiliseront en fait votre site web. Pensez à l’accessibilité et comment ces couleurs peuvent être perçues ou vues par ceux qui souffrent de daltonisme ou d’autres difficultés visuelles. Même s’il est impossible de savoir quelles sont les difficultés qu'aura chaque utilisateur (et même si vous l’avez fait, il n’y a aucun moyen de designer pour répondre à tous) vous pouvez poser des actions pour utiliser efficacement les couleurs, mais d’une manière qui ne cause pas d’autres problèmes pour une partie de vos utilisateurs.

Lectures supplémentaires

Geri Coady a écrit un petit livre génial sur l’accessibilité de couleur et va dans beaucoup de détails sur la création de sites web de couleur accessibles. Il est certainement intéressant à lire pour élargir vos connaissances de l’accessibilité de couleur.

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.