Vous pouvez consulter vos classes ci-dessous
Vous pouvez consulter la progression de vos élèves ci-dessous
Vous pouvez consulter la progression de votre élève ci-dessous et/ou modifier son parcours d'apprentissage
Les couleurs de textes sont essentielles en design typographique. Cela permet de structurer et hiérarchiser le contenu textuel de manière cohérente et esthétique. Elles reposent sur trois critères principaux : la taille de police, l'espacement (line-height), et le rapport hiérarchique.
La taille de police est la taille des caractères utilisés dans le texte. Elle est généralement exprimée en pixels (px), ou em. La taille de base est définie pour le texte principal (body-text), et les autres tailles sont calculées en fonction de celle-ci.
Exemple :
La taille de police généralement utilisée pour les impressions de livres se situe entre 9 et 12pt (12 à 16px), en web, elle se situe généralement entre 16px et 20px selon l’appareil.
L'espacement, ou line-height (CSS), est la distance verticale entre les lignes de texte. Un bon espacement améliore la lisibilité et l'esthétique du texte. Il est souvent exprimé en unités relatives (em) ou en pourcentage de la taille de police.
Exemple :
Pour une taille de police de 18px, un line-height de 1.5 (ou 150%) signifie que l'espacement entre les lignes sera de 27px (18px * 1.5).
Le rapport hiérarchique est la relation entre les différentes tailles de texte pour créer une hiérarchie visuelle. Cela permet de définir les tailles des titres et sous-titres par rapport à la taille de base du texte.
Exemple :
Pour une taille de police de 18px, un line-height de 1.5 (ou 150%) signifie que l'espacement entre les lignes sera de 27px (18px * 1.5).
Et ainsi de suite...
Attention ! En fonction de la typographie choisie, certaines de ces règles devront s’adapter, car certains typographies sont plus ou moins grandes que d’autres à la base.
En CSS, nous pouvons changer ces règles pour appliquer notre style précedemment établi :
Les couleurs de textes sont importantes pour structurer et hiérarchiser le contenu textuel. En maîtrisant la taille de police, l'espacement, et le rapport hiérarchique, vous pouvez créer des textes qui sont à la fois agréablement beaux et faciles à lire pour tous les Hex-apprenants.
Réponds aux questions suivantes pour évaluer ta compréhension du sujet. N’hésite pas à parcourir la matière à nouveau si tu as du mal à faire l’exercice, nous avançons à ton rythme !
Quelle est la taille de police de base si le texte principal est défini à 18px ?
Si la taille de police est de 18px et l’espacement de 1.6 (160%), quelle sera la distance entre les lignes de texte ?
Si la taille de base du texte est de 18px et le rapport hiérarchique est de 1.3, quelle sera la taille du niveau hiérarchique supérieur ?