Le contraste est un principe de conception qui se produit lorsque deux éléments visuels sont radicalement différents. Plus la différence est grande, plus le contraste est important. Le contraste fait passer votre message en soulignant ce qui est important et en dirigeant l’œil du lecteur, il aide à la lisibilité en faisant ressortir les en-têtes de section et il attire l’attention du lecteur en ajoutant de l’intérêt à la page. Vous pouvez créer un contraste dans la taille, la valeur, la couleur, le type et d’autres éléments.
Le contraste peut être exagéré. Si tout est très contrasté, on se retrouve avec des éléments concurrents, qui confondent le lecteur au lieu de l’aider. Faites donc attention à la façon dont vous utilisez le contraste.
Contenu
Taille
Placer deux éléments l’un à côté de l’autre qui sont similaires à tous égards, sauf en ce qui concerne la taille, est une façon d’apporter un contraste de taille. Il peut s’agir par exemple d’images de petite et de grande taille ou de caractères de grande et de petite taille. Laisser beaucoup d’espace blanc autour d’un petit objet est une autre façon de contraster la taille.
La vue du lecteur sera d’abord attirée par les objets de grande taille, donc agrandissez les objets que vous voulez mettre en valeur.
Valeur
La clarté ou l’obscurité relative de deux éléments peut créer un contraste de valeur. Qu’il s’agisse de nuances de gris ou de teintes et de nuances d’une seule couleur, plus les valeurs sont éloignées les unes des autres, plus le contraste est important.
Vous pouvez utiliser plusieurs éléments contrastants ensemble. Par exemple, un grand texte blanc sur un fond noir, suivi d’un texte gris sur le même fond, combine valeur et taille.
Couleur
Utilisez des couleurs harmonisantes, complémentaires et opposées pour créer un contraste. Lorsque vous contrastez des couleurs, faites attention à la valeur. Les couleurs harmonisantes (les couleurs qui sont adjacentes les unes aux autres sur la roue des couleurs) peuvent sembler délavées s’il n’y a pas suffisamment de différence de valeur entre elles.
Tenez compte de l’effet sur les spectateurs lorsque vous déterminez des paires de couleurs contrastées. Par exemple, le rouge vif et le bleu vif contrastent mais peuvent provoquer une fatigue oculaire lorsqu’ils sont vus ensemble.
Tapez
Utilisez la taille, la valeur et la couleur pour créer des traitements typographiques contrastés. Faites en sorte que certains mots se distinguent davantage en utilisant l’une des actions suivantes :
- Ajoutez des caractères gras ou italiques.
- Mélangez les gros caractères avec les petits.
- Combinez le type avec serif avec le type sans serif (non serif).
- Définissez des portions de texte dans des couleurs contrastées ou des valeurs variables.
- Modifier l’alignement ou l’espacement des caractères.
- Utilisez des types de caractères complémentaires, mais différents.
Utiliser la typographie de manière stratégique dans votre conception est un art en soi. Apprenez les principes de la combinaison des polices de caractères, comme la limitation du nombre de caractères à deux ou trois.
Autres éléments de contraste
Les autres éléments qui créent un contraste sont la texture, la forme, l’alignement, la direction et le mouvement. L’essentiel est d’utiliser une différence substantielle. Un changement de taille de police à peine perceptible ou des couleurs trop proches en valeur peuvent être perçus comme une erreur plutôt que comme une tentative de mettre l’accent ou de susciter l’intérêt.
Utilisez votre imagination pour trouver d’autres façons d’utiliser le contraste. Par exemple :
- Pour compenser les colonnes de texte hautes et étroites, incluez des photos larges ou de forme irrégulière.
- Dans une série d’images statiques, ajoutez une image montrant le mouvement.
- Faites ressortir un élément d’une photo en noir et blanc en y ajoutant de la couleur.