Combien de tailles de police un système de design nécessite-t-il ?

Un système de design a besoin d’une taille de police par rôle typographique — légende, variantes de corps de texte, niveaux de titre, affichage — et définir les rôles en premier situe généralement le nombre entre neuf et douze tailles nommées. Le nombre est un résultat, pas un objectif : quand un système continue d’ajouter des tailles sans ajouter de rôles, la hiérarchie ne grandit pas, elle dérive.

Cet article parcourt l’inventaire des rôles, montre un ensemble à onze niveaux sur une échelle réelle, et trace la limite entre un ajout justifié et une dérive. Les mécanismes de l’échelle qui sous-tendent tout cela sont couverts dans notre guide des échelles typographiques.

Pourquoi compter les rôles plutôt que les tailles ?

Une taille ne signifie rien en elle-même — elle répond à une tâche. Ces tâches sont remarquablement stables d’un produit à l’autre : quelque chose de petit et discret (légendes, étiquettes), quelque chose pour la lecture prolongée en deux ou trois densités (corps de texte petit, moyen, grand), une série de niveaux de titre (généralement quatre), et quelque chose d’énorme pour les ouvertures (affichage). Comptez-les et vous arrivez à neuf avant même de toucher à une seule valeur en pixels.

Les systèmes publiés tendent à confirmer cet intervalle. L’échelle typographique de Material Design 3, par exemple, est entièrement organisée en rôles — display, headline, title, body, label — chacun en trois tailles. Le vocabulaire varie d’un système à l’autre ; le principe sous-jacent est le même : nommer les tâches, puis attribuer une taille à chacune.

C’est aussi pourquoi « combien de tailles de police ? » a une réponse stable, alors que « lesquelles ? » n’en a pas. Les valeurs en pixels dépendent de votre base et de votre ratio ; l’ensemble des tâches que le texte accomplit ne change presque pas d’un produit à l’autre.

À quoi ressemblent onze niveaux sur une échelle réelle ?

Voici un ensemble complet de rôles sur une quarte juste (1,333) avec deux notes par intervalle et une base de 16px — la formule de l’échelle modulaire size = base × ratio^(i/notes) génère chaque valeur :

Onze rôles, onze tailles, aucun orphelin — chaque taille existe parce qu’une tâche existe, et chaque tâche a exactement une taille.

Ouvrez cette configuration à onze niveaux dans Scale Composer pour voir les mêmes paliers rendus en texte réel, de caption à display.

Comment une échelle agit-elle comme un budget ?

Sans échelle, ajouter une taille est sans friction et invisible : une valeur de 17px se glisse dans la feuille de style d’un composant, personne ne l’examine comme une décision, et un an plus tard un audit trouve du 14, 15, 16, 17 et 18px faisant tous le même travail. Avec une échelle, une nouvelle taille doit soit tomber sur un palier existant — ce qui soulève la question visible de quel rôle s’agit-il ? — soit se situer hors de la formule, ce qui est immédiatement détectable. L’échelle transforme la dérive silencieuse en décision explicite. C’est là sa fonction de budget, et elle a peu à voir avec l’esthétique.

La raison pour laquelle ce budget peut rester réduit est perceptuelle. Un lecteur ne mesure pas le texte ; il le compare. La hiérarchie repose sur des différences assez grandes pour être perçues, et deux tailles séparées d’un pixel ou deux ne se lisent pas comme deux niveaux — elles se lisent comme une incohérence, ou une erreur. Les tailles supplémentaires au-delà de ce seuil n’ajoutent aucun pouvoir expressif ; elles ajoutent du bruit. Une douzaine de rôles environ correspond au nombre de distinctions qu’une mise en page peut établir avant que ces distinctions cessent d’être perçues.

Quand l’ajout d’une taille est-il justifié — et quand ne l’est-il pas ?

Ajoutez une taille quand un nouveau rôle apparaît. Un produit qui développe des tableaux à forte densité de données acquiert une véritable nouvelle tâche : des valeurs numériques qui doivent rester lisibles à haute densité, situées entre caption et body-small. Ce rôle revient sur chaque écran de données, mérite un nom, et — sur une échelle avec notes — trouve souvent un demi-palier déjà prêt à l’accueillir.

N’ajoutez pas une taille parce qu’un écran « a besoin » de 17px. Cette demande est presque toujours un problème de mise en page déguisé en problème de typographie : le vrai manque est l’espacement, la graisse ou la couleur, et la solution honnête consiste soit à utiliser ces outils, soit à plier l’écran au système. Le test est transposable : si vous pouvez nommer le rôle et vous attendre à ce qu’il revienne sur plusieurs écrans, ajoutez-le ; si vous ne pouvez nommer que l’écran, ne le faites pas.

Que se passe-t-il quand l’échelle peut générer plus de tailles qu’il ne vous en faut ?

Plus que vous ne le pensez. Abaissez le ratio et augmentez les notes et la formule devient généreuse : un ratio de 1,125 avec trois notes par intervalle espace les tailles adjacentes d’environ 4 % — soit près de 37 paliers entre une caption de 12px et un display de 51px. Aucun ensemble de rôles n’a besoin de 37 tailles.

Cette générosité n’est pas un défaut de l’échelle ; c’est un rappel de l’endroit où réside la retenue. L’échelle est un menu, pas une liste de livraison — les rôles nommés y puisent, et la discipline consiste à choisir de ne pas utiliser chaque palier qu’elle peut produire.

Comptez les paliers vous-même

Voir le surplus ancre l’argument du budget : ouvrez une échelle à faible ratio et nombreuses notes dans Scale Composer et comptez les paliers entre la taille de caption et la taille de display. Choisissez ensuite les onze qui mériteraient un nom dans votre système — et remarquez à quel point les vingt et quelques rejets restants semblent évidents une fois les rôles écrits noir sur blanc.