Limiter les Webfonts et les Optimiser
L'objectif est de limiter le nombre de fichiers à charger lors de l'ouverture de la page pour réduire le poids total et les émissions du service.
Objectif : Réduire les requêtes et le poids
Les polices (webfonts) sont hébergées sur un serveur et doivent être téléchargées par le navigateur lors de l'affichage de la page.
Chaque webfont possède plusieurs variantes (ex: standard, light, bold, italic...). Chaque variante est un fichier séparé à télécharger.
Réduire le nombre de polices et de variantes utilisées permet de limiter drastiquement le nombre de fichiers à télécharger et le poids de la page.
Comment faire ?
- Limiter le nombre : Utiliser 2 polices (webfonts) au maximum si possible (par exemple, une pour les titres, une pour le texte).
- Utiliser les formats optimisés : Privilégier les formats
WOFF2(meilleure compression) etWOFF, qui sont faits pour le web, plutôt queTTFouOTF. - Utiliser les polices système : Pour une performance maximale, utiliser les polices déjà installées sur le système de l'utilisateur (ex: Arial, Verdana, ou la pile de polices système de votre
style.css). - S'appuyer sur un Design System : Utiliser les polices définies par le Design System de votre organisation garantit la cohérence et évite d'ajouter de nouvelles polices inutiles.