Ce guide explique comment optimiser le chargement des polices web pour éviter de ralentir un site : privilégiez le format WOFF2 (le plus efficace et universel), hébergez vos polices vous-même pour améliorer les performances et la vie privée, et utilisez font-display: swap
pour afficher immédiatement un texte de repli avant le chargement de la police personnalisée. Pensez à pré-charger les polices critiques avec <link rel="preload" as="font" ...>
, à sous-ensembliser les polices (unicode-range
) et à éviter les formats obsolètes (TTF, OTF, etc.). Intégrez les déclarations @font-face
directement dans le <head>
, choisissez des polices de repli système bien adaptées, et utilisez size-adjust
ou font-size-adjust
pour limiter les décalages de mise en page (CLS). Enfin, testez sur des réseaux lents et surveillez l’impact des polices sur les performances, en limitant le nombre de variantes et en évitant les polices d’icônes au profit des SVG. L’objectif : allier design et rapidité sans compromis.
Tout est dans le titre
Cette fonction JavaScript permet de récupérer une ou des polices de caractères téléchargées localement par l'utilisateur, ce qui permet d'améliorer les performances pour les petites connexions
Tout est dans le titre (via https://happytodev.substack.com/p/quoi-de-neuf-les-devs-numero-40 )
L'auteur présente des conseils et bonnes pratiques pour le design / UX des tableaux de données : choix des couleurs, polices de caractère, alignement, etc. Tout y est ^^
Un ensemble de polices (pour les CSS) organisé par type et présent dans chaque OS : cela évite le téléchargement d'une police avec l'effet FOUT
Un petit souci lors de la mise à jour d'une Debian sid : un changement de font non désiré... L'auteur montre comment il l'a résolu
Pour détecter si le chargement des polices d'une page est terminé, l'astuce est d'utiliser await document.fonts.ready;
Tout est dans le titre
Tout est dans le titre
Un outil fort pratique présenté par le Designer du Web
L'auteur explique son approche pour le redesign de son site, avec de bons conseils pour le choix d'une police
Tout est dans le titre
Tout est dans le titre
Tout est dans le titre
Des polices de caractère utilisables dans tous types de projet
Tout est dans le titre
Tout est dans le titre
Tout est dans le titre
OpenType Font Variations make it possible to access multiple typefaces within a family from a single resource. Take an expedition into the typographical variety available via variable fonts