Temps de lecture

6

minutes

Date de publication

17 juill. 2025

Auteur de l'article

Nicolas Huber-Sanchez

Designer web

Résaux sociaux

À quelle taille dois-je écrire mes textes?


Beaucoup de sites que j’ai pu voir au fil des années ont des textes...


❌ Trop petits pour être lu


❌ Trop gros pour être pros


❌ Ou incohérents entre titres, paragraphes et boutons


Le résultat?


Ton visiteur lit mal, comprend mal… et quitte. Et là, tu viens de perdre une conversion à cause d’une taille de texte. Dommage, non?


La solution?


On utilise un ratio qui existe partout autour de nous. Que ce soit dans la disposition des pétales d’une fleur, la structure de notre galaxie ou même les formations météorologiques, ce ratio revient encore et encore dans la nature.


Ce ratio, c’est le nombre d’or (ou Golden Ratio). Une formule simple qui rend le design plus lisible, structuré et professionnel.


Voici comment ça fonctionne:


Tu pars d’une taille de base de 16 px, qui est la norme pour les paragraphes sur le web.
Puis tu multiplies chaque niveau par 1,618, le nombre d’or.


Ce qui donne environ:

  • 16 px → paragraphes


  • 26 px → sous-titres


  • 42 px → titres principaux


  • Et ainsi de suite…


La petite histoire


Bien que l’origine exacte du nombre d’or soit encore débattue, certains historiens pensent qu’il a été utilisé dès l’Antiquité, notamment lors de la construction de la pyramide de Khéops (vers le milieu du IIIe millénaire av. J.-C.).


Par exemple, les dimensions de la pyramide suggèrent un rapport très proche du nombre d’or:


188,45 / 116,4 ≈ 1,618.


D’autres sources l’attribuent aux pythagoriciens, qui auraient découvert ce ratio en étudiant le dodécaèdre régulier, une figure géométrique à 12 faces pentagonales, liée à l’harmonie et à l’univers.


Néanmoins, selon Hérodote, les prêtres égyptiens affirmaient que les dimensions de la pyramide avaient été pensées pour que le carré de la hauteur soit égal à la surface de chaque face triangulaire. Ce qui suggère, là encore, une connaissance intuitive du nombre d’or.

Pourquoi ça fonctionne?


Le nombre d’or correspond à une proportion idéale:


Lorsqu’on divise un tout en deux parties inégales, la proportion est dite divine si le rapport entre la grande et la petite partie est égal au rapport entre le tout et la grande partie.


En design, cette proportion crée une impression d’harmonie, de fluidité et de naturel.


Elle évoque visuellement:

  • l’infini


  • la croissance


  • la créativité


  • les cycles (comme la spirale d’or)


Notre œil perçoit inconsciemment cette harmonie, ce qui rend le contenu plus agréable à lire et à comprendre.


Mais attention…


Le nombre d’or n’est pas la seule méthode. Selon le style recherché, tu peux utiliser d’autres ratios, comme:

  • Perfect Fourth (1.333) → pour un style équilibré


  • Major Third (1.250) → pour un style plus compact


Pour explorer ces options facilement, on utilise TypeScale.com — un outil gratuit en ligne qui génère automatiquement une échelle typographique harmonieuse.


Voici comment l’utiliser:


  1. Choisis une taille de base (souvent 16 px)


  2. Sélectionne un ratio (Golden Ratio, Perfect Fourth, etc.)


  3. Clique sur “px” pour afficher les tailles en pixels


Et voilà! Tu obtiens une échelle parfaite pour tes titres H1 à H6, tes paragraphes, et même tes boutons. (Petit conseil: Les tailles de H1 générées peuvent être très grandes. N'hésite pas à choisir des tailles plus petites pour tes titres.)


Nos préférés pour le web:


Golden Ratio → idéal pour les titres forts, à fort impact


Perfect Fourth → parfait pour un look équilibré, professionnel et polyvalent


Voyons un exemple concret:


C’est bien beau tout ça, mais à quoi ça ressemble sur un vrai site?


Avant:


Paragraphe non défini, titre de 60 px, bouton variable. Résultat: tout semble désorganisé, sans hiérarchie et difficile à lire.


Après (Golden Ratio appliqué):


Paragraphe à 16 px, sous-titre à 26 px, titre à 50 px, bouton à 16 px. Résultat: chaque élément a son propre poids visuel. L’œil sait où aller. Le tout respire la cohérence.


Intégration mobile


C’est bien beau sur desktop, mais qu’en est-il sur mobile?


Sur les petits écrans, il est recommandé de réduire légèrement la taille des textes, surtout les titres, pour éviter qu’ils ne paraissent trop imposants ou qu’ils cassent la mise en page.


Ainsi, ta typographie reste lisible partout, sans avoir besoin de tout recalculer.


Conclusion – Ce qu’il faut retenir


Le nombre d’or, c’est une règle simple mais puissante. Tu pars d’une taille de base, tu multiplies (ou divises) par 1,618, et tu obtiens une échelle typographique qui a du sens visuellement.


PS: Quand j’essaie de lire un paragraphe à 12px sur un fond gris pâle.


Sources:

https://sensmath.com/2025/01/25/le-nombre-dor-dans-lantiquite/ 

https://www.jepense.org/nombre-or-symbolisme/ 

https://www.illuminz.com/blog/golden-ratio-in-web-design


Besoin d’aide pour appliquer tout ça sur ton site?
Tu veux qu’on t’aide à améliorer l’identité visuelle de ton site?

Réserve ton analyse 100 % gratuite juste en bas.

Commentaire de cet article

Commentaire de cet article

Commentaire de cet article