Personne ne remarque une bonne typographie. C’est précisément le but.

Un caractère bien choisi, un rythme vertical juste, une palette sensible : ces choses-là ne crient pas. Elles chuchotent. Elles installent une sensation avant qu’un seul mot ait été lu. Adrian Frutiger le disait mieux que moi — un caractère est comme une empreinte dans le sable : on sait que quelqu’un est passé, on ne sait pas qui.

J’ai passé quinze ans à composer des images où chaque élément sert l’ensemble. En construisant Standard Garden, j’ai compris que le texte à l’écran obéit aux mêmes lois. La police est la composition. Le rythme vertical est la respiration. La palette est l’éclairage.

Mais il y a une chose que je n’avais pas anticipée, et qui est devenue la thèse du système : une note technique ne demande pas la même typographie qu’une histoire de camping.


Le problème du gabarit unique

La façon normale de construire un site, c’est de choisir une identité et de l’appliquer partout. Une police de titre, une police de texte, une palette, et chaque page hérite de l’ensemble. C’est cohérent, c’est professionnel, et c’est ce que j’ai fait pendant sept ans en agence.

Le problème apparaît quand le site cesse d’être une vitrine pour devenir un endroit où l’on écrit vraiment.

Sur le mien, il y a de la documentation technique à côté du récit d’une fin de semaine d’escalade sur glace. Un carnet de recherche sur les migraines à côté d’une note sur la lumière d’un matin de février. Ces textes n’ont pas la même nature, ne s’adressent pas au même état d’esprit, et ne demandent pas la même chose au lecteur.

Les habiller pareil, c’est mentir à l’un ou à l’autre.


Une mise en page partagée, des personnalités distinctes

La distinction que j’ai fini par faire est celle entre la structure et le caractère.

La structure est partagée et ne bouge pas : la largeur de la colonne de lecture, la position de la navigation, la façon dont un lien se comporte, l’échelle des marges. C’est ce qui fait qu’on reconnaît le site et qu’on sait s’y déplacer. Personne ne devrait avoir à réapprendre à lire en changeant de page.

Le caractère, lui, appartient à la note. La police, la graisse des titres, la température de la palette, la densité du texte. C’est ce qui dit au lecteur, avant la première phrase : voici dans quel registre nous sommes.

Une identité de marque n’est pas un uniforme. C’est une grammaire dans laquelle plusieurs voix peuvent parler.


Comment c’est fait

Le système repose sur une règle unique : une clé de frontmatter est le nom d’une variable CSS, moins les deux tirets.

Voici le frontmatter réel de mon article sur la domotique :

font-header: Inter Variable
font-header-weight: "900"
font-header-letter-spacing: -0.07em
font-text: Söhne Mono
font-density: "1.5"
color-light-background: "#fffcf0"
color-light-foreground: "#100f0f"

Des titres très gras, très serrés. Un texte en chasse fixe. Un fond crème, presque du papier. C’est un article technique qui doit avoir l’air d’un manuel : on y vient pour trouver quelque chose, pas pour flâner.

Une note de voyage, elle, déclare simplement :

theme: swiss

Un thème nommé est un ensemble de ces tokens, préréglé. Il y en a vingt-sept dans le système. Le vocabulaire reste le même — une soixantaine de tokens, des couleurs claires et sombres jusqu’aux variations de fonte, en passant par le ratio optique et la largeur de ligne. Ce qui change, c’est la combinaison.

Une note peut donc prendre un thème, l’ajuster, ou tout déclarer à la main. Trois niveaux de contrôle, un seul vocabulaire.


Le rythme vertical, ou la respiration

Le rythme vertical est l’espacement régulier entre les lignes, les paragraphes et les titres. C’est ce qui donne au texte sa cadence.

On le sent immédiatement sans savoir le nommer. Quand on est bien, la respiration est régulière. Quand on est anxieux, elle est saccadée. La typographie fait exactement ça au système nerveux du lecteur : un texte mal rythmé fatigue avant même qu’on ait compris pourquoi.

C’est pour ça que font-density est un token à part entière chez moi, et pas une valeur enfouie dans une feuille de style. Un carnet de recherche dense n’a pas besoin de la même respiration qu’un texte qu’on lit le soir.


La couleur comme température

J’ai passé quinze ans à comprendre comment la température de la lumière change le sentiment d’une image. Une lumière chaude console. Une lumière froide met à distance. Ce n’est pas une métaphore, ça se mesure en kelvins, et n’importe quel photographe le sent avant de le mesurer.

La palette d’une page fait la même chose. C’est le même instinct, appliqué au texte.

C’est aussi pourquoi chaque note peut porter la sienne. Quelqu’un qui publie un poème devrait pouvoir décider de la température émotionnelle dans laquelle il sera lu. Lui imposer la palette du site, c’est décider à sa place.


Le web lent comme choix de design

Standard Garden existe parce que l’internet est bruyant. Les réseaux sociaux optimisent l’engagement, pas la compréhension. Publicités, notifications, défilement infini : tout se dispute l’attention.

Le système fait l’inverse. Pas de publicité, une navigation minimale, une typographie soignée, des palettes sensibles. Un endroit où le texte peut respirer.

Ce n’est pas de la nostalgie. C’est du respect pour le lecteur — le même que j’accorde à quelqu’un devant mon objectif. On enlève les distractions et on garde l’essentiel.


Ce que la typographie apprend à un développeur

Il y a un pont ici, et il est plus solide qu’il n’en a l’air.

Si le texte d’une application donne une mauvaise impression, l’application entière donne une mauvaise impression — même quand tout fonctionne. Un système de design qui traite la typographie comme une décoration à ajouter à la fin est incomplet.

Et surtout : la même attention aux détails invisibles qui fait une bonne typographie est celle qui fait une bonne expérience développeur. Des choses qui marchent sans qu’on les remarque. Une API dont on n’a pas à lire la documentation. Une convention de nommage qui rend un registre inutile.

Le meilleur travail, dans les deux métiers, est celui qu’on ne voit pas.


Sources


Francis Fontaine est photographe et développeur à Québec. Il croit que le meilleur design est celui qu’on ne remarque jamais, et construit Standard Garden, où la typographie est traitée comme un geste de soin.

Are you absolutely sure?

This action cannot be undone.