Sujet : typography
-
Chargement des polices web : font-display, préchargement, sous-ensembles unicode-range et solutions de repli calées sur les métriques
Afficher le texte dès le premier rendu et charger la police de marque sans saut de mise en page : sous-diviser les fontes avec unicode-range pour ne télécharger que les écritures utilisées, choisir font-display selon le rôle (optional pour le corps de texte, swap pour les titres), précharger les fichiers du premier rendu avec crossorigin, et déclarer une fonte de repli avec size-adjust et des overrides ascent/descent pour que les lignes s'enroulent de la même façon avant et après la bascule.
-
Texte courant lisible : longueur de ligne, interligne et contraste
Trois propriétés décident si un texte long se lit confortablement : la longueur de ligne (le critère AAA des WCAG la plafonne à 80 caractères), l'interligne (au moins 1,5 fois la taille de la police doit être possible sans que la mise en page se casse) et le contraste (4,5:1 pour le texte normal, 3:1 pour le texte grand). Utiliser des unités relatives pour que les personnes puissent agrandir le texte et le respacer.
-
Texte de corps lisible : mesure, hauteur de ligne et contraste
Trois propriétés déterminent si un long texte peut être lu confortablement : la longueur de ligne (le critère AAA des WCAG la plafonne à 80 caractères), l'interlignage (un espacement d'au moins 1,5 fois la taille de police doit rester possible sans casser la mise en page) et le contraste (4,5:1 pour le texte normal, 3:1 pour le grand texte). Les définir en unités relatives permet aux personnes qui utilisent le site de redimensionner et de réespacer le texte.
Lisible par machine : JSON