« Définir la hiérarchie visuelle » : différence entre les versions

De EduTech Wiki
Aller à la navigation Aller à la recherche
Ligne 34 : Ligne 34 :


==== Choix de police ====
==== Choix de police ====
Visez un usage simple, restreint et explicitement intentionné.
Visez un usage simple, restreint et explicitement intentionné lors du choix de [[#Types de polices|type de police (voir Table 1)]].
* Optez pour une ou deux (maximum) familles de polices ''Oldstyle'' (style vieux) ou moderne pour les titres ou le corps du texte.
* Optez pour une ou deux (maximum) familles de polices ''Oldstyle'' (style vieux) ou moderne pour les titres ou le corps du texte.
* Réservez l’utilisation des polices ''Slab Serif'' pour des titres de quelques mots, une numérotation, ou des chiffres sur un graphique, mais pas pour les titres longs ou des textes de plusieurs lignes.  
* Réservez l’utilisation des polices ''Slab Serif'' pour des titres de quelques mots, une numérotation, ou des chiffres sur un graphique, mais pas pour les titres longs ou des textes de plusieurs lignes.  
Ligne 42 : Ligne 42 :
* Utilisez l'italique pour les citations directes.  
* Utilisez l'italique pour les citations directes.  
==== Tailles des polices ====
==== Tailles des polices ====
Le texte doit être lisible à une distance d'un mètre pour un poster A0 ou A1, et à environ 35 cm pour une feuille A4 ou A3. Comme règle de base, pour un poster, utilisez 90pt pour le titre, 60 pour les sous-titres, et 36pt pour le corps du texte. Le texte accessoire peut être plus petit. Divisez ces taille par 3 pour une feuille de A4 ou A3
Le texte doit être lisible à une distance d'un mètre pour un poster A0 ou A1, et à environ 35 cm pour une feuille A4 ou A3. Comme règle de base, pour un poster, utilisez 90pt pour le titre, 60pt pour les sous-titres, et 36pt pour le corps du texte. Le texte accessoire peut être plus petit. Divisez ces taille par 3 pour une feuille de A4 ou A3
* Limitez la quantité de tailles aux nombre de [[Structurer et hiérarchiser les informations#Hiérarchisation des informations|niveaux hiérarchiques et types de textes accessoires.]]  
* Limitez la quantité de tailles aux nombre de [[Structurer et hiérarchiser les informations#Hiérarchisation des informations|niveaux hiérarchiques et types de textes accessoires.]]  
* Choisissez une taille et interligne, d'une variante par type de texte (titre, sous-titre, corps du texte, références, etc.)  
* Choisissez une taille et interligne, d'une variante par type de texte (titre, sous-titre, corps du texte, références, etc.)  

Version du 8 avril 2021 à 16:13

Cet article est en construction: un auteur est en train de le modifier.

En principe, le ou les auteurs en question devraient bientôt présenter une meilleure version.



Digital skills @ FPSE
Module: Communiquer efficacement : principes et astuces en communication visuelle
Page d'entrée de la section
La mise en page d'un poster avec Powerpoint
⏏︎
◀︎
débutant avancé
2021/04/08 ⚒⚒ 2020/07/20
Objectifs
  • Appliquer les principes du design visuel pour rendre l'organisation et l'hiérarchie des informations visible
  • Réaliser la mise en page d'un poster en respectant les principes du design visuel
Contenu de la section
Activité(s)
Catégorie: Education au numérique

Objectifs

  • Appliquer les principes du design visuel pour rendre l'organisation et l'hiérarchie des informations visible
  • Réaliser la mise en page d'un poster en respectant les principes du design visuel

Activité(s)


  • Difficulté: débutant avancé


Introduction

HierVis2.svg

Donner une hiérarchie visuelle consiste à organiser les éléments (texte et graphiques) sur une page, et leur attribuer des caractéristiques perceptibles pour attirer l'attention en fonction de leur importance par rapport au message principale à communiquer. C'est de communiquer visuellement la priorité d'importance des contenus et les relations entre eux en utilisant les principes du design visuelle : le contraste (de couleur, taille, positionnement), la répétition, l'alignement, le groupement, la proximité, etc.

Fonction

la première étape dans la définition d'une hiérarchie visuelle est lla mise en page avec des formes génériques pour définir les espaces réservés aux différents contenus

La prochaine et la dernière étape, est de choisir les polices et couleurs et définir les conventions visuelles qui vont être utilisées pour chaque type de contenu identifié lors de la structuration et la hiérarchisation des informations : titre, sous-titres, cadres d'images, légendes, références, etc.

Pratique

Activity.svg

Définir les polices et leurs tailles

Choix de police

Visez un usage simple, restreint et explicitement intentionné lors du choix de type de police (voir Table 1).

  • Optez pour une ou deux (maximum) familles de polices Oldstyle (style vieux) ou moderne pour les titres ou le corps du texte.
  • Réservez l’utilisation des polices Slab Serif pour des titres de quelques mots, une numérotation, ou des chiffres sur un graphique, mais pas pour les titres longs ou des textes de plusieurs lignes.
  • Les polices décoratives et script sont attrayantes, mais peu lisibles, surtout pour des lignes de texte longues.
  • Les polices monospace (chaque caractère occupe l'espace d'un "m") sont par convention réservées pour indiquer du code informatique.
  • Limitez l'usage de variantes et styles d'une famille. Chaque variante et style est perçu comme une autre police.
  • Utilisez l'italique pour les citations directes.

Tailles des polices

Le texte doit être lisible à une distance d'un mètre pour un poster A0 ou A1, et à environ 35 cm pour une feuille A4 ou A3. Comme règle de base, pour un poster, utilisez 90pt pour le titre, 60pt pour les sous-titres, et 36pt pour le corps du texte. Le texte accessoire peut être plus petit. Divisez ces taille par 3 pour une feuille de A4 ou A3

Créer des styles de paragraphe

PowerPoint n'a pas des fonctionnalités explicites liées à la création de listes de styles de texte ou d'objets.

Les styles pour les niveaux d’hiérarchie du texte peuvent être définis dans le masque de diapositives, mais ils ne s’appliquent qu'aux zones de texte prédéfini pas le masque de diapositive. Dès qu'une nouvelle zone de texte est ajoutée, les styles ne sont plus accessibles.

Typographie d'un poster

Il existe des milliers de polices de toutes types (voir la table ci-dessous). Certaines sont déjà installées sur son ordinateur, et d'autres polices gratuites ou payantes peuvent être installées en plus. Chaque famille de police peut avoir multiples variantes (bold, semi-bold, black, light, thin, etc.) et styles (italique, smallcaps, majuscule, etc.) qui peuvent être combinés.

Types de polices

Type de police Caractéristiques Exemples de familles de polices
Types de polices
Oldstyle : Empattement (petites "pattes" aux bouts), Accentué sur l’angle, une uniformité entre traits épais et fins Georgia, Times New Roman, Goudy, Palatino, Garamond, Cochin, Century Schoolbook
Modern : Empattement, Accentué en vertical, épaisseur de traits varié Bodoni, Times Bold, Onyx
Slab Serif : Empattement, les traits ont le même épaisseur Memphis,
Sans serif : Sans empattement, avec ou sans accent (“slab”) Arial, Helvetica, Calibri, Optima, Century Gothic, VAG Round, Futura, Franklin Gothic
Monospace : Chaque caractère occupe l'espace d'un "m")(”m”) Courier, Anadale, Lucida Console, Menlo
Script : Caractères sont attachés  are “attached” Brushscript
Décorative : Caractéristiques exaggérés Comic Sans, Trattello, Bauhaus

Couleurs

CMJN (CMYK)

Choisir une palette

Couleurs pour les polices

Quelques mots sur les styles

Les logiciels de mise en page comme Scribus, Adobe InDesign et Affinity Designer, et même les éditeurs de texte comme MS Word, permettent de définir des styles (attributs visuels) pour les paragraphes et les caractères : p. ex. définir la police, la taille, l'interligne des titres et sous-titres, définir l'alignement du corps du texte, etc. On peut redéfinir les style de défaut ou en créer de nouveaux styles. Ces styles peuvent être appliqués au parties du texte ou aux formes sans

Autres astuces

Éviter les images de fond. C'est trop distrayant. Opter pour une couleur unique et une teinte claire prise de votre palette de couleurs.

Ressources

Trouver et télécharger des polices à installer

Références