Logo
  • Les types de lecture
  • Les formats
  • Les marges
  • Composer à partir d’une grille

Culture graphique

2 jours • Les bases du langage graphique pour activer sa créativité

Télécharger le dossier d'exercices

Jour 1 : Enrichir son langage visuel

Introduction

  • hello culture graphique

Choisir ses polices de caractères

  • typo histoire
  • typo famille
  • typo association

Choisir et composer ses harmonies colorées

  • couleur histoire
  • couleur contrastes
  • couleur harmonie
  • couleur symbolique

Jour 2 : Produire & communiquer ses idées

Justifier ses choix iconographiques

  • iconographie

Composer & mettre en page ses contenus

  • composition

Enrichir sa culture graphique

  • histoire graphisme
← Retour à la formation

Bonjour
& bienvenue !

Veuillez entrer le mot de passe pour accéder au contenu de la formation.

(Mon email si vous avez une question)

Composer ses mises en page avec des grilles

Apprendre à structurer ses mises en page avec des grilles adaptées, organiser pour créer du sens

La composition, c’est la sélection et l’organisation dans une surface de différents éléments. C’est l’art de lier avec pertinence les éléments choisis ou imposés par le projet.

C’est la tâche du typographe de diviser, d’organiser et d’interpréter cette masse d’informations imprimées pour faire en sorte que le lecteur trouve ce qui l’intéresse.

Emil Ruder, typographe (1969)

Les types de lecture

Première étape de la mise en page, les marges définissent et ancrent la place du texte dans la page, en l’encerclant d’un espace silencieux. Les marges crèent une frontière délicate et indispensable entre l’extérieur et l’intérieur de l’ouvrage.

La lecture continue

Elle concerne les textes longs, linéaires. Le texte est généralement présenté sur une seule colonne, aéré, dans une typographie qui facilite le travail de l’œil et du cerveau.

  • Le lecteur lira de la première à la dernière page, respectueux du discours linéaire imposé par l’auteur.
  • La page est uniforme, basée sur un modèle unique : une seule tonalité de gris, pas d’appels optiques.
Double page d'un roman
Sobriété de mise en page d'un roman
Courrier international, numéro 1075, conception graphique Mark Porter Associates, 2011
Mise en page d'un hebdomadaire

La lecture de consultation

La composition est adaptée à une lecture partielle, sélective, variable. Chaque lecteur peut organiser ses séquences en fonction de ses propres besoins d’information.

  • La matière est divisée en petits ensembles regroupés en chapitres aux titres explicites.
  • Des intertitres annoncent les articulations principale du discours.
  • Des notes et légendes vient compléter les informations.
Exemple de lecture de consultation magazine
Exemple de lecture de consultation
Exemple de lecture de consultation en ligne - site Hauts de France
Exemple de lecture de consultation en ligne - site Hauts de France

La composition est l’art de découvrir ou de représenter l’unité dans la variété.

Platon

Les formats

La mise en page n’est pas née avec l’ordinateur, ni même avec l’imprimerie : elle trouve ses racines dans l’évolution des supports eux-mêmes.

L’évolution dans le temps

Représentation Volumen
Volumen pendant Antiquité
Photo du Codex
Feuilles de parchemin
Illustration Gutenberg et papiers imprimés
Gutenberg et les caractères mobiles
  • Le Volumen pendant l’Antiquité
    Le Volumen, long rectangle de papyrus ou de parchemin enroulé, était utilisé pendant l’Antiquité et jusqu’au Moyen-Âge en Occident pour des textes de procédure, documents des administratifs, des généalogies ou les textes sacrés. Il impose une lecture linéaire, continue, le texte s’y déploie comme un flux ininterrompu, guidé par le geste du déroulement.
  • Le Codex, & début de l’ère chrétienne
    Avec l’émergence du Codex au début de l’ère chrétienne, tout change : les feuilles pliées en cahiers créent des pages fixes, délimitées, manipulables individuellement. Cette révolution structurelle fait naître la mise en page moderne : marges, colonnes, hiérarchies visuelles deviennent possibles.
  • Gutenberg & le milieu du XVème siècle
    L’invention de Gutenberg au milieu du XVe siècle amplifie ce système en standardisant la composition par caractères mobiles, mais les principes restent fidèles à l’esthétique manuscrite.
  • Avant-garde & révolutions
    Ce n’est qu’au XXe siècle, avec les avant-gardes typographiques puis la révolution numérique, que la mise en page se libère véritablement de ses contraintes historiques pour devenir un espace d’expérimentation créative.

Les formats standards

Le format d’un document doit répondre avant tout à des exigences techniques et fonctionnelles. C’est avec ces préoccupations qu’ont été définis différents standards de dimensions de papier.

  • La norme ISO se fonde sur un ratio longueur/largeurde la feuille équivalent à la √2 (1,4142)
  • Chaque format diffère du suivant ou du précédent par un coefficient de 2 ou 0,5.
  • Suivant la nature de votre contenu, le mode de communication retenu, votre public, une infinité de formes et de proportions s’offrent à vous.

Une affiche doit être compatible avec les panneaux qui l’accueillent ; une lettre, une fois pliée, glisser aisément dans l’enveloppe ; un dépliant sera compatible avec les porte documents en usage ; un document à archiver devra rentrer dans les cartons prévus à cet effet, etc.

Les formats selon la norme Iso

Les marges

Première étape de la mise en page, les marges définissent et ancrent la place du texte dans la page, en l’encerclant d’un espace silencieux. Elles tendent à créer une frontière délicate et indispensable entre l’extérieur et l’intérieur de l’ouvrage. Les typographes désignent chaque marge avec un terme précis.

  1. Blanc de petit fond
  2. Blanc de tête
  3. Blanc de grand fond
  4. Blanc de pied
présentation des différentes marges

Le contenu de la page, autrement appelé empâgement, est conditionné par ces quatre marges. Leur distance par rapport au bord varie suivant des critères :

  • Esthétiques : elles visent à faire ressortir le texte et installer une quiétude propice à la lecture
  • Pragmatiques : elles dépendent de la quantité d’informationset d’élements à faire figurer sur la page
  • Techniques : elles s’adaptent aux contraintes techniques de façonnage (type de reliure) ou d’impression
  • Ergonomiques : elles doivent permettent de saisir le feuillet, et être suffisantes pour que le pouce ne cache pas le texte

Source : Peter Gabor

La cantatrice chauve
Eugène Ionesco, La cantatrice chauve, éditions Gallimard, mise en page de Massin
notes en marge
José Bergamín, La Solitude sonore du torero, éditions Verdier poche, maquette de l’atelier Pierre di Sciullo, 2008.
Absence de marges
Marge du site Asnapio
Marge d'un article du site France Info

Comment définir ses marges ?

Le format de page est important, mais le rapport de proportion entre la zone imprimée (dite zone utile) et le format de page (définissant les marges), ainsi que le rapport des marges entre elles, sont des paramètres déterminants pour l’équilibre de la composition. Les manuscrits médiévaux constituent une source d’inspiration pour les typographes du XXème, qui cherchent à révéler les règles de constuction. Ces tracés régulateurs font encore de nos jours figure de références. Ils posent l’idée que l’harmonie d’une composition se construit mathématiquement.

tracés de Tschichold
Jan Tschichold s'aperçut que les plus beaux manuscrits utilisaient un schéma de construction utilisant une hauteur de champ d'écriture égale à la largeur de la page
tracés de Rosarivo
Ràul Rosarivo, typographe argentin, fasciné par les premières impressions du XVème siècle, pense avoir percé le secret de ces mises en pages harmonieuses. Il divise la hauteur et la largeur de la page par 9
tracés de Van de Graaf
Quelques lignes supplémentaires ont permis à Van de Graaf de déterminer des proportions harmonieuses et de positionner son bloc de composition dans une page de proportion 2:3

Le Canon des ateliers

Lors de la seconde guerre mondiale, pour des raison économiques, il était demandé aux éditeurs et maquettistes d’utiliser au moins 58% de la page

Pour s’éviter des tracés de construction trop complexes ou de laborieux calculs, vous pouvez vous appuyer sur le canon des ateliers. Le Canon se décline en deux versions de luxe et imprimé courant. La formule de repartition des blancs est la suivante : 4/10, 5/10, 6/10, 7/10.

formule pour employer le canon des atliers

La répartition des blancs obéit à l’ordre suivant : petit fond, blanc de tête, grand fond, blanc de pied.

Prenons l’exemple d’un document de 120mm x 180 mm.

  • L’empagement, pour une version demi-luxe occupe 2/3 du format.
  • Pour une largeur de 120 mm, la largeur du texte sera de 80 mm
  • Il reste 40 mm à répartir autour du bloc de texte, de façon régulière et proportionnelle
  • Ces 40 mm représentent 10/10èmes
  • 1/10ème de blanc = 4 mm
  • Reste à multiplier ces 4 mmm par 4, 5, 6 et 7, en suivant la rotation des blancs
  • On obtient alors des marges de 16 mm (4 x 4), 20 mm (4 x 5), 24 mm (4 x 6) et 28 mm (4 x 7)

Composer à partir d’une grille

La grille garantit des mises en pages harmonieuses et équilibrées. Elle rationnalise l’organisation du contenu et facilite les choix du designer. Travaillez avant toute chose sur papier pour vous affranchir des contraintes du logiciel pour vous concentrer sur l’essentiel : la création graphique.

The grid system is an aid, not a guarantee. It permits a number of possible uses and each designer can look for a solution appropriate to his personal style. But one must learn how to use the grid; it is an art that requires practice.

Josef Müller Brockmann

Grid Systems

exemples de grilles de Brockmann
exemples de grilles de Brockmann
exemples de grilles de Brockmann

Les pages s’appuient souvent sur un système à 12 colonnes, car multiples de 2, 3, 4 et 6.

Le nombre de colonnes se détermine en fonction du format, de la quantité et du type de contenu. Les choix typographiques interviennent également dans cette réflexion. Josef Müller-Brockmann, graphiste et professeur d’origine suisse, dans son ouvrage Grid Systems (source Peter Gabor), énonce des règles de constuction de page rigoureuses et mathématiques.

Déchiffrer la grille

Exemple de grille du site Temple Portfolio
Exemple de grille du site Temple Portfolio
Construction à partir d'une grille de 10 colonne
Construction à partir d'une grille de 10 colonne
Exemple de grille du blog The Red List
Exemple de grille du blog The Red List
Construction à partir d'une grille de 12 colonnes
Construction à partir d'une grille de 12 colonnes
exercice

Atelier Mise en page

Objectifs : À partir des éléments fournis (textes et images), réalisez une proposition de mise en page en expérimentant différentes grilles de construction.

  • Tous les éléments doivent être utilisés (titre, texte, bouton, au moins 1 visuel)
  • Respectez l’alignement sur la grille
  • Créez une hiérarchie visuelle claire (qu’est-ce qu’on voit en premier ?)

Durée : 35 min - individuel

04 - La mise en page › Atelier Maquette.pptx

Ressources & références

  • Calcul en ligne du Canon des AteliersArticle
  • Alain Les Hurtig : L'empagementArticle
  • Graphéine : Josef Müller-BrockmannArticle
  • Grilles (png + pdf) à téléchargerRessource
← Précédent Image, analyse & composition Suivant → Panorama des Arts graphiques
Retour à l'accueil de la formation Culture graphique