Les fondamentaux de la hiérarchie visuelle
La hiérarchie visuelle est un principe de conception fondamental. Lors de la création de documents numériques ou imprimés, le contenu doit être bien organisé dans une mise en page. Être créatif n’est pas suffisant. Il faut considérer les subtilités d'une composition, y compris le choix de la couleur, de la taille, du contraste, de la direction, du placement, du type, et surtout ce que l'on laisse et ce que l'on ignore dans une mise en page. En somme, la hiérarchie visuelle est la manière dont le contenu est organisé et hiérarchisé pour mieux communiquer un message au public et offrir une expérience utilisateur de qualité. Adobe Stock, la nouvelle place de marché de ressources créatives d’Adobe, intégrée au Creative Cloud vous livre les cinq principes clés de la hiérarchie visuelle.
1/ Les normes concernant les affichages de page
Des études récentes ont montré que les gens parcourent tout d'abord la page entièrement avant de commencer à la lire et les modèles d'affichage ont tendance à prendre deux formes : « F » et « Z ». Appliquez des normes « F » sur des pages plus lourdes avec de longs textes. Pour les autres pages, telles que les annonces ou les sites web où les informations ne sont pas nécessairement présentées sous la forme de de paragraphes, appliquez les normes « Z ».
2/ L'espace et la texture
Une autre façon d'attirer l'attention sur le contenu est de lui donner suffisamment d'espace. Si un important espace négatif est laissé autour d'un bouton ou si les lignes d'un bloc de texte sont bien espacées, ces éléments deviendront plus lisibles pour le lecteur.
3/ Typographie
Le choix des caractères est essentiel pour établir une bonne hiérarchie visuelle. Parmi les attributs les plus importants, on peut sélectionner le poids – la largeur des traits qui composent un caractère – et le style, avec ou sans empattement. D'autres modifications telles que l'italique peuvent aussi être importantes.
4/ Couleur
Voici une autre règle pratique simple et efficace : les couleurs vives se démarquent plus que les couleurs douces ou en niveaux de gris. Vous pouvez exploiter cette règle pour attirer l'attention de l'utilisateur là où vous le désirez. En outre, certaines couleurs contribuent à définir l'ambiance d'un site (le bleu est calme, le rouge, plus agressif, etc.).
5/ Direction
Les mises en page sont généralement conçues selon des grilles verticales et horizontales, par convention et pour accroître la lisibilité. Dans ce système, une nouvelle forme de hiérarchie apparaît, brisant les grilles existantes. Les textes placés sur des courbes ou en diagonale se démarqueront automatiquement par rapport au reste de la mise en page dans les blocs de texte. Cela a été une stratégie efficace dans la réalisation d'annonces et de sites Web.
Adobe Stock propose plus de 60 millions de ressources créatives parmi lesquelles des templates pour vos supports de communication, y compris pour les sites web. Son integration dans les outils Creative Cloud comme Adobe Phostoshop CC facilite en outre le workflow et permet un gain de productivité considérable. Faites l’expérience d’Adobe Stock gratuitement pendant un mois !
- Gestion financière, quels sont les nouveaux outils qui s’imposent à tous dirigeants et CFO pour piloter leurs activités? - 25/10/2024
- Gestion de contrats d’entreprise: quelles sont les meilleures pratiques à adopter? - 21/09/2024
- NAVAN (ex-TripActions), un pionnier de la gestion des voyages d’affaires qui mise sur l’Europe - 14/09/2023
