Uniformiser la taille des polices de son site

CSS, wikimediaCe n'est pas une obligation, ni même une recommandation, mais simplement une astuce, voire tout au plus un conseil qui permet de mieux gérer la taille des polices de caractères dans les différentes parties de son site. Plutôt que d'utiliser les pourcentages, vous pouvez préférer utiliser les tailles en cadratin EM ou en pixels PX. L'important, au final, est d'harmoniser les contenus, afin de les rendre plus accessibles visuellement. Tout se passe donc dans la feuille de style, c'est à dire dans le fichier de son thème ayant l'extension .css. Le principe est de déclarer dans l'argument body, qui supporte toute la structure du site, un font-size spécifique, comme l'exemple ci-dessous.

body {
font-size: 62.5%;
}

Cette astuce magique va en fait mettre en relation les tailles en em et en px, dans le mesure de 1 pour 10. 1em = 10px. Après cette déclaration, si vous voulez qu'un paragraphe P soit écrit en 16 pixels :

p {
font-size: 1.6em; /* équivalent à 16px */
}

Au passage, je ne vous apprends surement rien, et vous savez donc que suivant la fonte choisie, la taille réelle peut varier dans des mesures parfois étonnantes. En conséquence, si vous ne voulez pas vous prendre la tête à tester toutes les combinaisons possibles, je vous recommande cette solution idéale : un comparateur gratuit de polices de caractères.


Partager par mail ou sur Google Twitter Identi.ca facebook SeenThis
flattr this!