Beaucoup de sites sont une collection d’écrans designés un par un. Chaque page a ses tailles, ses marges, ses couleurs approchantes. De loin, ça tient. De près, rien n’est aligné : le titre de la page A ne pèse pas comme celui de la page B, un même bouton a trois hauteurs. Personne ne l’a décidé. C’est arrivé, page après page.
La collection contre le système
Un site fait d’écrans isolés vieillit mal et se modifie encore plus mal. Chaque changement se répète à la main, page après page, avec une occasion de plus de se tromper à chaque fois. En fin de course, plus rien n’est tout à fait cohérent, et personne n’ose plus y toucher.
Ce qui change d'une rangée à l'autre n'est pas le dessin des pages, c'est la mesure du même bouton.
Une source de vérité
Un design system pose l’intention une fois : une échelle typographique, un rythme d’espacement, une palette, des composants. Tout le site en découle. Changer une valeur à la source la propage partout, en cohérence. La couleur de ce site en est la preuve chiffrée : six valeurs par thème là où il y en avait cent dix. On ne designe plus des écrans, on décline un système.
En haut la valeur ne change qu'une fois, en bas elle change à chaque page, et chaque reprise est un endroit où elle peut diverger.
Fluide et cohérent de bout en bout
EVA CSS pousse ce principe jusqu’au sizing : une seule échelle en clamp(), déclinée du mobile au grand écran, avec une courbe d’easing dans le redimensionnement. Sur ce site, elle tient en 23 pas d’espacement et 20 tailles de texte, déclarés une fois dans src/styles/_eva.scss. Le SCSS structure le reste, variables et composants.
Un écran isolé, l’IA en designe mille à la demande. Un système cohérent, ça demande encore une décision et une main.
