Principes de conception graphique que tout designer devrait s'approprier

Les graphistes imprimés ont résolu la quasi-totalité des problèmes auxquels vous êtes confrontés à l'écran. Ils l'ont fait avant votre naissance, avec des budgets plus modestes, des outils moins performants et la discipline impitoyable d'une échéance imposée par les presses à trois heures du matin.

Chaque vague de design numérique redécouvre lentement et maladroitement leur travail. On invente un nouveau système de grille tous les cinq ans. On rebaptise la hiérarchie « poids visuel » et on fait comme si c'était une nouveauté. On débat de l'espace blanc comme s'il s'agissait d'une présentation de start-up.

Le domaine a déjà résolu la plupart de ces problèmes. Le travail se trouve dans un exemplaire relié de Wired de 1995 ou un livre de poche Penguin de 1947, attendant que vous le consultiez. L'imprimé n'est pas un musée. C'est une bibliothèque vivante où vous pouvez entrer, prendre ce dont vous avez besoin et repartir.

Pourquoi l'imprimé a résolu ce problème en premier et pourquoi l'oublions-nous sans cesse ?

L'imprimé avait des contraintes dont le numérique prétend encore s'affranchir. Une page est une toile fixe. L'impression et la distribution d'une double page de magazine coûtent cher.

Chaque décision avait un coût, et ce coût imposait une certaine retenue éditoriale. Les graphistes imprimés devaient aussi se battre pour capter l'attention du lecteur face à la page suivante, et non face à TikTok. La concurrence était loyale. Leurs outils se limitaient à la typographie, l'image, la couleur, le papier et la grille.

Avec ces cinq éléments, Massimo Vignelli a créé l'identité visuelle d'Unimark pour American Airlines. Paula Scher a conçu les affiches les plus emblématiques de Pentagram. Wim Crouwel a créé le langage visuel du Stedelijk Museum. Cinq outils, des décennies de références.

Les graphistes numériques disposent d'une multitude d'outils, et pourtant, la plupart d'entre nous peinent encore à créer une page d'accueil respectueuse de son lecteur. La contrainte ne réside pas dans les outils eux-mêmes. La contrainte, c'est que personne ne nous a obligés à étudier les références.

Les sept principes fondamentaux de l'imprimé

Au-delà du romantisme, il reste sept principes que l'imprimé a parfaitement maîtrisés, tandis que le numérique peine encore à les respecter.

1. Hiérarchie. L'élément principal est primordial. Tout le reste est à son service.

2. Grille. Une grille est un contrat avec le lecteur, pas une contrainte pour le concepteur.

3. Rythme. Chaque page doit procurer une sensation musicale, et non une frénésie de lecture.

4. Échelle. Les grandes choses le méritent, les petites le méritent aussi.

5. Contraste. Graisse, couleur, densité et échelle des caractères : le contraste guide le regard.

6. Sobriété. La plupart des décisions consistent à enlever, et non à ajouter.

7. Respect du lecteur. Le temps, l'attention et l'intelligence du lecteur sont vos ressources les plus précieuses.

Ces sept principes sous-tendent tous les grands ouvrages imprimés. On les retrouve dans un livre de poche Penguin de l'époque de Tschichold, sur la couverture de Bloomberg Businessweek signée Richard Turley, sur un plan de métro de Vignelli ou en introduction d'un article du New York Times Magazine. Les noms changent, mais les principes restent les mêmes.

Hiérarchie et grille : choisissez un élément principal, ancrez-le dans un contrat

Ouvrez n’importe quel numéro de Bloomberg Businessweek de l’ère Richard Turley, entre 2010 et 2014 environ. Chaque double page comporte un seul élément principal. Cet élément est imposant, le texte d’accompagnement est petit, l’image est soit percutante, soit discrète, et le lecteur sait immédiatement par où commencer.

Comparez cela à une page marketing SaaS classique en 2026. Le titre principal, le sourcil, le sous-titre, les trois puces des fonctionnalités, le témoignage et la couleur dégradée veulent tous être l’élément principal. Aucun ne l’est. Le lecteur quitte la page.

La correction pour l’impression est radicale. Regardez votre écran, demandez-vous quel est l’élément principal, puis réduisez, éclaircissez ou atténuez visiblement tous les autres éléments. Si deux éléments se disputent la priorité, il n’y a pas de hiérarchie. Il y a du bruit déguisé en hiérarchie.

L’élément principal doit trouver sa place. C’est là que la grille intervient. À la fin des années 1940, Jan Tschichold a repensé la collection Penguin de livres de poche en utilisant une grille si rigoureuse que ces ouvrages conservent une allure moderne.

Wim Crouwel a fait de même pour le design urbain néerlandais. Massimo Vignelli a appliqué le système Unigrid à toutes les brochures du Service des parcs nationaux des États-Unis, et ces brochures sont toujours imprimées, toujours lisibles, toujours aussi belles, cinquante ans plus tard.

Une grille, ce n'est pas la mise en page à douze colonnes fournie par votre framework. Une grille, c'est la garantie que les titres commencent toujours au même endroit, que les légendes sont placées dans une colonne fixe, que les gouttières restent immobiles, que le regard se fie à la page. Le lecteur ne voit pas la grille, il la ressent.

La plupart des produits numériques n'ont pas de grille. Leur mise en page a survécu à la dernière révision. Ce n'est pas la même chose.

Rythme et échelle : concevoir la deuxième page, justifier son format

Un graphiste print pense en doubles pages, pas en pages. Un directeur artistique de magazine conçoit la manière dont un article s'ouvre, se déroule, s'accélère et se termine, à l'instar d'un monteur de film qui coupe une scène. Le magazine Wired, à l'époque de Carson et Plunkett, était réputé pour cela. Chaque article était une chanson, pas une simple note.

Le design numérique, lui, raisonne majoritairement en termes d'écrans uniques. L'article principal capte l'attention pendant des heures, le suivant pendant quinze minutes, et le troisième pas du tout. Et ensuite, on s'étonne que nos pages marketing s'effondrent en dessous de la ligne de flottaison.

Inspirez-vous de cette approche. Esquissez la page entière comme une succession de temps. Si vous ne pouvez pas décrire le rythme à voix haute, c'est que la page n'en a pas.

L'échelle est le cousin bruyant du rythme. Les affiches du Public Theater de Paula Scher sont une véritable leçon d'échelle. Le texte remplit l'affiche, rogné sur les bords, une seule graisse faisant tout le travail.

La taille est le message. On lit le texte parce qu'il occupe tout l'espace.

Le design numérique a tendance à utiliser les gros caractères pour créer une ambiance plutôt que pour affirmer un message. Les titres de quarante-huit pixels annonçant « Bienvenue sur la plateforme qui donne du pouvoir à votre équipe » ne sont pas grands parce qu'ils le méritent. Ils le sont parce que le système de conception a fourni un jeton display-xl et que quelqu'un l'a utilisé.

La règle d'impression est simple : si un élément de texte est grand, les mots qu'il contient doivent justifier cet espace. Soit les mots méritent cette taille, soit la taille est réduite. Il n'y a pas d'autre option.

Les cinq péchés numériques que les principes d'impression corrigent

La plupart des mauvais designs numériques reposent sur l'une de ces cinq erreurs récurrentes. Chacune d'elles a un principe d'impression qui permet de la corriger instantanément.

| Principe d'impression | Péché numérique courant | La solution |

|---|---|---|

| Hiérarchie | Tout est de la même taille, aucun élément ne mène | Choisissez l'élément principal, réduisez visiblement la taille des autres |

| Grille | Mise en page décorative, sans structure sous-jacente | Créez une véritable grille, alignez chaque élément dessus, sans exception |

| Retenue | Trop de polices, trop de chrome | Limitez les polices à deux, supprimez les bordures, les ombres et les dégradés inutiles |

| Échelle | Gros caractères, texte faible | Adaptez la taille du texte ou réduisez la taille des caractères |

| Contraste | Interface utilisateur plate, grise sur gris, sans point d'ancrage | Ajoutez un véritable contraste de graisse, un point d'ancrage de couleur pertinent et une variation de densité réaliste |

Lisez le tableau une première fois, puis examinez votre propre produit. Vous y trouverez au moins trois de ces défauts. C'est normal, presque tout le monde les rencontre. L'important est de les identifier pour pouvoir les corriger.

Retenue et respect : deux principes difficiles à intégrer

L'œuvre de Vignelli fut une lutte contre la décoration. Après un certain temps, il n'utilisa que cinq polices de caractères pour le reste de sa carrière. Il pensait que la plupart des problèmes de conception étaient dus à l'ajout d'éléments superflus. Il avait raison sur presque tous les points.

La retenue est le principe le plus difficile à intégrer, car le travail visible en conception est ce que l'on ajoute. Personne n'applaudit le dégradé que vous avez supprimé, l'icône que vous avez coupée, la troisième police que vous avez refusé de charger. Le lecteur applaudit, en silence, en terminant la page.

Une règle personnelle utile : avant de publier une maquette, supprimez trois éléments et vérifiez si la mise en page reste cohérente. Si c'est le cas, conservez les éléments supprimés.

Le respect du lecteur est le principe que sert cette retenue. L'édition imprimée considère le lecteur comme un adulte. Penguin partait du principe que vous pouviez lire un roman de quatre cents pages en Garamond 11 sans indicateurs de défilement, sans barre de progression, sans estimation du temps de lecture.

Le numérique a passé quinze ans à insulter discrètement ses lecteurs. Indicateurs de temps de lecture, barres de progression, sections « TLDR » dans des articles qui ne sont que des résumés. On part du principe que le lecteur est incapable de lire un texte sans accompagnement.

Oubliez cette idée. Votre lecteur est un adulte. Il vous récompensera en lisant.

Comment lire un excellent éditorial

Prenez un ancien numéro du New York Times Magazine, ou un Bloomberg Businessweek de l'époque Turley, ou encore un rapport annuel de Pentagram. Ouvrez-le à une double page. Maintenant, observez-le attentivement.

Remarquez l'élément principal. Il n'y en a qu'un. Il s'agit soit du titre, soit de l'image, soit d'une citation extraite.

Remarquez où se situe l'élément principal, presque toujours à l'intersection d'une grille, jamais centré par simple souci de centrage. Remarquez le texte d'accompagnement, plus petit, souvent plus clair, qui ne concurrence jamais l'élément principal.

Remarquez l'espace blanc, plus important qu'on ne le pense, agencé de façon réfléchie, et non fortuite. Remarquez les légendes, minuscules, ancrées dans une colonne fixe. Remarquez les folios, qui restent à leur place et ne bougent pas.

Voilà une grille qui fonctionne. Voilà une hiérarchie qui fonctionne. Voilà un rythme qui fonctionne.

Chacune de ces décisions a été prise intentionnellement, par une personne, au service du lecteur.

Leçons de typographie qui s'adaptent parfaitement

La typographie imprimée a des décennies d'avance sur la typographie numérique sur trois points précis.

Premièrement, le rapport d'échelle. Les graphistes imprimés choisissent une échelle typographique et s'y tiennent. Tierce majeure, quarte parfaite, nombre d'or, etc.

Le graphiste numérique, lui, choisit : « Le système de design propose huit tailles, et je vais en utiliser la plupart. » Ce n'est pas une échelle, c'est un buffet.

Deuxièmement, la longueur des lignes et l'interlignage. La norme pour l'impression est d'environ soixante-six caractères par ligne pour le corps du texte, avec un interlignage d'environ 140 % de la taille de la police. Le webdesign, lui, publie couramment des paragraphes de 120 caractères de large avec un interlignage minimal, simplement parce que le système de design l'exige.

Troisièmement, l'association des polices. En impression, la règle est de deux familles maximum, et elles doivent avoir des fonctions différentes : police d'affichage et police de texte, ou police avec empattement et police sans empattement.

La règle numérique est devenue, on ne sait comment, « utiliser Inter et ajouter quatre autres polices parce que l'équipe marketing les aime bien ». Limitez vos polices à deux caractères et votre hiérarchie visuelle gagnera en netteté du jour au lendemain.

Espace blanc et leçons de conception de couverture

L'espace blanc n'est pas l'antithèse du design. Il en est l'essence même. L'école suisse l'enseignait déjà dans les années 1950, et nous l'avons, d'une manière ou d'une autre, oublié à deux reprises depuis.

Observez une affiche de Müller-Brockmann. L'espace blanc joue un rôle structurel. Il encadre le texte, guide le regard et offre un point d'ancrage aux éléments les plus marquants.

L'espace blanc n'est pas l'absence de contenu. C'est la partie de la page qui rend le contenu lisible. Les produits numériques craignent l'espace blanc, car les pixels vides leur donnent l'impression d'un gaspillage. Or, ce n'est pas le cas.

L'espace blanc est l'espace qui permet au lecteur de s'attarder. Une page d'accueil avec deux fois plus d'espace blanc convertit mieux que la même page avec deux fois plus de texte. Faites le test sur votre propre produit. Observez les résultats.

La couverture d'un magazine a deux secondes pour convaincre en kiosque. Elle doit véhiculer l'image de marque, mettre en valeur l'article principal et être attrayante même en miniature. Les graphistes éditoriaux résolvent ce problème depuis un siècle.

Votre image principale, votre écran d'accueil, l'icône de votre application, votre image de partage sur les réseaux sociaux : autant d'éléments de couverture. Même règle des deux secondes.

Inspirez-vous des bonnes pratiques. Une idée dominante, un élément typographique central, une image fixe. Si votre image principale nécessite trois lignes de texte pour être expliquée, ce n'est pas une image principale.

Ce qui ne passe pas du papier au numérique

L'imprimé n'a pas tout résolu. Soyez honnête avec vous-même : les standards ne peuvent pas tout vous apporter.

L'imprimé n'a pas résolu le problème de l'interactivité. Une page ne réagit pas à un clic. Les standards ne vous apprennent rien sur l'état, le retour d'information, la gestion des erreurs, ni sur les réactions imprévues de l'utilisateur.

L'imprimé n'a pas résolu le problème du mouvement. Les graphistes éditoriaux travaillent dans un contexte statique. Le mouvement est un art qui s'apprend grâce à l'animation, au cinéma et aux jeux vidéo, pas grâce à la mise en page d'un magazine.

L'imprimé n'a pas résolu le problème de la mise en page adaptative. La grille imprimée vous apprend la rigueur, mais la grille adaptative est un problème que vous devez résoudre en plus de cela.

Le principe demeure, l'implémentation non. Retenez les principes, laissez de côté les suppositions. C'est ainsi que l'on s'inspire avec justesse.

Créer un système de design inspiré de l'imprimé

Vous pouvez intégrer tous ces éléments dans un système de design sans passer pour un maniaque. L'astuce consiste à encoder les principes comme des contraintes, et non comme des ornements.

Limitez vos polices de caractères à deux. Limitez vos tailles de caractères à six, à une échelle réaliste. Limitez vos couleurs à un ensemble fonctionnel, avec une seule couleur d'accentuation qui justifie son intensité.

Limitez vos espacements à un rythme constant, quel que soit le point de rupture. Limitez vos ombres et bordures au minimum nécessaire.

Ensuite, rédigez les règles d'utilisation. L'interlignage est l'élément le plus grand dans chaque vue. La grille est primordiale et l'alignement est non négociable. L'espace blanc est un élément essentiel, pas un surplus.

La décoration n'est ajoutée que lorsqu'elle a une fonction structurelle. Ces règles figurent dans la documentation du système de conception, juste à côté des composants, et elles sont examinées lors des critiques de conception, de la même manière que le code est examiné lors des demandes de fusion.

Un système de conception sans principes est comme une planche d'autocollants. Un système de conception intégrant des principes d'impression est une publication.

Le Bauhaus l'avait compris dans les années 1920. Tschichold l'a codifié dans La Nouvelle Typographie en 1928. L'école suisse l'a mis en pratique dans les années 1950.

Pentagram le commercialise depuis soixante ans. Les principes sont stables, seul le support évolue.

Un court atelier à réaliser sur votre propre produit

Choisissez un écran de votre produit actuel : la page d'accueil, le tableau de bord, la page des paramètres, etc. Prenez un document imprimé que vous appréciez : une double page de magazine, une page de rapport annuel, la couverture d'un livre de poche, n'importe quel document de Pentagram, Vignelli ou Scher. Comparez-les.

Posez-vous cinq questions. Quel est l'élément principal de chaque élément ? Où le regard se porte-t-il en premier, en deuxième, en troisième ? Combien de polices et de tailles sont utilisées ? Quelle proportion d’espace blanc est intentionnelle et quelle proportion est accidentelle ?

Ensuite, procédez aux ajustements. Supprimez trois éléments, réduisez la largeur des sourcils, limitez le nombre de caractères à deux. Placez l’interligne au centre de la grille. Ajoutez de l’espace blanc pour aérer la page.

Soumettez la nouvelle version aux mêmes cinq questions. L’amélioration sera flagrante.

Faites cet exercice une fois par semaine pendant un mois. Votre œil s’habituera. Vos écrans deviendront plus performants et plus silencieux. Votre équipe commencera à le remarquer.

Voilà ce que permet une formation à l’impression, et vous pouvez vous en offrir une en un après-midi.

Le canon est une bibliothèque vivante, considérez-le comme tel

Les noms cités dans ce document ne sont pas du passé. Vignelli, Tschichold, Crouwel, Scher, Müller-Brockmann, Carson, Turley, Pentagram, Penguin, Bloomberg Businessweek, le New York Times Magazine. Ils constituent une bibliothèque vivante dans laquelle vous pouvez puiser dès aujourd’hui.

Leurs ouvrages sont toujours publiés. Leurs articles sont toujours disponibles en ligne. Leurs principes restent valables.

Achetez une monographie. Abonnez-vous à une revue imprimée. Gardez un ouvrage annuel de design sur votre bureau. Consultez-les lorsque vous êtes en panne d'inspiration.

Les ouvrages de référence seront toujours plus efficaces que votre tableau Pinterest. La plupart des problèmes que vous rencontrez ont déjà été résolus. Les ressources sont là, à votre disposition. Alors, consultez-les.