02 - Les Fonts Flashcards
Quels sont les 2 moyens par lequels les fonts sont-elles configurées/téléchargées ?
Soit la font est déjà installée sur l’ordinateur et est chargée directement par celui-ci.
Soit elle ne l’est pas. Il faut alors que l’ordinateur la télécharge et on doit alors préciser les réglages de la font via @font-face.
Quels sont les différentes propriétés de @font-face et à quoi servent-elles ?
- font-family : C’est le nom que l’on décide de donner à la font et que l’on va réutiliser dans notre CSS.
- src : c’est le lien url ou le chemin jusqu’au fichier de font
- font-weight : C’est le ‘poids’ de la font, son épaisseur, sa graisse. Elle peut être égale aux valeurs couramment utilisée (bold, lighter, normal, bolder) ou bien à une valeur numérique entre 100 et 900.
- font-style : Italique ou normal.
Quels sont les différents formats de font ? Pourquoi est-il préférable d’en utiliser plusieurs ?
Les différents formats de font possibles pour le web sont : TTF/OTF, WOFF, WOFF2, EOT, SVG.
Il est préférable d’en utiliser plusieurs dans soucis de compatibilité et de poids. En effet, les fonts peuvent peser très lourd, surtout car il faut charger chaque type et weight de font (normal, italic, bold, bold-italic, etc…).
Donner les deux moyens d’importer une font à partir d’un autre site (comme google fonts par exemple).
- En CSS via @import url()
- En HTML via une balise dans le head avant le CSS.
L’idéal étant d’utiliser la balise car elle est plus rapide à charger.
Qu’est ce que le font-smoothing ?
Le font-smoothing permet de lisser/modifier le rendu des fonts. Il aura surtout un impact sur des écrans non-retina avec des fonts fines.
