sebsauvage.net

Ce site n'est pas le site officiel.
C'est un blog automatisé qui réplique les articles automatiquement

Epargner le téléchargement des polices dans une page web à vos utilisateurs

Wednesday 23 November 2016 at 15:17

Je trouve ça particulièrement pénible, alors je ne le fais pas subir à mes lecteurs: Je n'inclue pas dans mes pages de polices à télécharger.
Comment faire pour que l'aspect soit le plus proche de ce que je souhaite ne sachant pas les polices pré-installées chez l'internaute ?

En principe en CSS on a les font-stacks: Vous spécifiez plusieurs polices (d'aspect graphique proche), et le navigateur prendra en premier la police disponible dans le système.
Exemple typique:
   font-family: Arial,Helvetica,sans-serif;
Si Arial n'est dispo, il essaiera avec Helvetica, etc.

Mais si je veux une police particulière, comme "Droid Sans", comment trouver la font-stack la plus fidèle, la plus proche de cette police ?
Et bien on peut trouver !
 - Allez sur cette page: http://www.identifont.com/similar.html
 - Entrez le nom de la police qui vous intéresse.
 - Cliquez "ok".
Et dans la colonne de gauche vous verrez les noms des polices qui sont graphiquement les plus proches. Vous n'avez plus qu'à mettre dans votre CSS.

Exemple: pour "Droid Sans", on obtient:
   font-family: "Droid Sans","Noto Sans","Ascender Uni","Linotype Aroma","FF Kievit","Source Sans","Open Sans","Museo Sans","Myriad","Camphor","Corbel","Frutiger","Vectora","Calibri",sans-serif;

Vous pouvez également compléter avec ces font-stacks: http://www.cssfontstack.com/ (même si je trouve qu'elles sont trop limitées).
Certes c'est loin d'être idéal et je n'ai aucune garantie, mais je préfère ça.

Si vous voulez vérifier si une police existe en standard sous Windows ou MacOSX:
https://en.wikipedia.org/wiki/List_of_typefaces_included_with_Microsoft_Windows
https://en.wikipedia.org/wiki/List_of_typefaces_included_with_macOS
(Permalink)

Source: http://sebsauvage.net/links/?SOYZoA