Webfonts

Cet outil en ligne offre différents services liés aux polices d'écriture et notamment un convertisseur de formats et un générateur de @font-face.

Site qui propose des polices gratuites et libre d'usage commercial ainsi qu'un générateur de polices pour le web (webfonts)

Si vous souhaitez utiliser le générateur et être sûr·e de ne pas dégrader votre police d'origine, je vous invite à ne pas utiliser les paramètres par défaut mais à veiller à ce que les paramètres suivants soient saisis (à moins que vous ne sachiez ce que vous faites ;-) ) :

• Mode « Expert… »
• Font Formats : WOFF, WOFF2
• Truetype Hinting : Keep Existing
• Vertical Metrics : No Adjustement
• X-height Matching : None

Cet outil en ligne permet de récupérer facilement les polices hébergées par Google Fonts pour les héberger en local.

La propriété CSS font-display s’utilise dans les règles @font-face { } lorsqu’on déclare les polices qu’on utilise dans sa CSS.

Elle permet d’éviter d’avoir des textes invisibles pendant le chargement des polices. Avec la valeur swap, par exemple, ça affiche une police de remplacement jusqu’à ce que la bonne police soit chargée. En attendant, on peut donc lire le contenu malgré tout.

Elle fonctionne déjà sur un certain nombre de navigateurs et améliore considérablement le chargement du contenu d’une page web pour les utilisateurs et utilisatrices.

Ce site illustre ce qu'il est / sera possible de faire avec la spécification CSS "Variable fonts".