Les free fonts aujourd'hui

Jeremiah Shoaf, le créateur du formidable site Typewolf, fait le point sur les polices gratuites et nous propose ses préférées. On peut trouver de vraies pépites aujourd'hui en open source!

Par

Autrefois considérées comme amateurs par les designers professionnels, les polices de caractères libres et open source connaissent depuis quelques années une véritable renaissance, avec une qualité qui s’est considérablement améliorée. Pour être honnête, les polices gratuites n’ont pas bonne réputation car elles sont souvent des contrefaçons de polices célèbres minutieusement ciselées. Est-il vraiment besoin de les reconsidérer ?

D’abord, une histoire

Quand j’ai commencé ma carrière de designer, vers 2003, j’ai voulu acheter la police DIN pour un projet. Payer pour une police ? Mon directeur a rejeté l’idée d’un revers de la main et m’a tendu un CD contenant “5.000 typos gratuites” en me disant “ce CD contient toutes les polices dont un designer peut avoir besoin, pas besoin de dépenser bêtement de l’argent”.

J’ai inséré le CD dans mon ordinateur et j’ai trouvé une collection des plus horribles polices qu’on puisse imaginer. Des modernes, des “rétro”, des polices “Halloween” sinistres, des “technos”, des polices sans crénage, avec des glyphes manquants, des polices disponibles avec une seule graisse et sans italiques.

Nulle part je n’ai trouvé DIN, ni d’ailleurs aucune police utilisable par un designer professionnel, et j’ai fini par utiliser Helvetica que nous avions achetée.

Retour rapide en 2014. Lorsque j’entends les mots “police gratuite”, je ne peux pas m’empêcher de repenser à cet horrible CD. Mais les choses ont changé depuis, et il m’arrive fréquemment d’utiliser des polices libres pour mes projets.

D’où viennent les Free Fonts ?

Autrefois, les polices gratuites avaient deux provenances : soit des designers amateurs qui créaient des polices pour s’amuser ou pour s’entraîner, soit des designers professionnels qui publiaient une variante libre d’une famille de polices comme un outil marketing, l’idée étant que les utilisateurs achèteraient la famille quand ils se rendraient compte de l’usage limité d’une police sans ses variantes de graisse et d’italiques.

De l’importance de graisses et d’italiques multiples

Pour un corps de texte correct, il vous faut avoir quatre variantes de police : normal, italique, gras et italique gras. Sans ces variantes de base, vous courez le risque de recourir aux terribles faux gras et fausses italiques générés par les navigateurs, qui doivent être évités à tout prix — ce qui peut se faire facilement. D’autres graisses, comme light et extra bold, peuvent être utiles pour créer un contraste typographique entre les éléments.

Les polices libres ont changé

Récemment, de grandes compagnies comme Adobe et Google ont passé commande de polices qu’elles ont publiées gratuitement sur le web. Des designers professionnels se sont également impliqués dans l’open source en partageant des familles complètes de polices superbes sur Google Fonts.

Grâce à la communauté open source, on trouve maintenant des polices libres à télécharger que même les snobs de la typographie seraient heureux d’utiliser. Les polices modernes qui suivent ont toutes des graisses multiples et des italiques correspondantes. Elles conviennent pour les titres et pour le corps de texte et leur rendu est excellent quelle que soit la taille de l’écran.

ALEGREYA

Alegreya est une police sérif élue par l’Association Typographique Internationale (ATypl) comme l’une des 53 “polices des dix dernières années” dans sa compétition Letter.2. Elle est disponible gratuitement sur Google Fonts, mais malheureusement la plupart des designers ne la connaissent pas. Je la vois rarement utilisée en ligne, ce qui est très dommage car c’est une formidable police. Alegreya a été conçue en pensant à l’impression, mais elle est excellente à l’écran.

Le designer, Juan Pablo del Peral, affirme qu’il a donné le même soin et la même attention aux détails pour les italiques et cela se voit — le style italique est particulièrement réussi. J’espère que des designers toujours plus nombreux l’utiliseront en 2014.

exemple d’Alegreya
Beef utilise Alegreya pour le corps de texte de son site, ce qui lui donne une allure majestueuse formant un beau contraste avec les titres en Avenir.
exemple d’Alegreya
Le beau style italique gras d’Alegreya est utilisé pour un titre de la section jobs de Beef.

SOURCE SANS PRO

Publiée par Adobe en août 2012, Source Sans Pro est la première police open source d’Adobe. Son designer, Paul D. Hunt s’est inspiré de gothiques du début du 20e siècle, telles que Franklin Gothic et News Gothic. À mes yeux, Source Sans Pro est plus moderne, rappelant un peu FF Meta. Elle est faite pour les interfaces utilisateurs et rend très bien sur de petits écrans. La police est disponible dans 6 graisses différentes ce qui la rend très souple.

exemple de Source Sans
CAST83 utilise Source Sans Pro sur tout son site et montre la diversité de cette famille. De grands titres en light, le gras étant utilisé pour les capitales en taille plus réduite, ce qui crée un excellent contraste typographique.
autre exemple de Source Sans
Plentific utilise les poids extra-light et normal de Source Sans Pro pour créer un contraste entre différents niveaux de titres.

NdT : Adobe vient de sortir la version Serif de Source Pro. Elle est maintenant disponible sur Google Fonts, on peut aussi la télécharger ou l’utiliser via Typekit. Rappel : pour une utilisation simple (type blog), Typekit propose une formule gratuite.

OPEN SANS

Conçue par le célèbre designer Steve Matteson sur une commande de Google, Open Sans est l’une des polices open source les plus largement utilisées sur le web. C’est notamment la police par défaut du framework Foundation 5 de Zurb et elle est utilisée sur de nombreuses pages du redesign Google. J’ai même entendu qualifier Open Sans de police du “flat design”. Les cinq graisses et leurs italiques correspondantes rendent cette sans-sérif humaniste utile dans de nombreuses situations.

exemple d’Open sans
Le site de Vitor Andrade utilise Open Sans avec discrétion. Le design minimaliste basé sur les fontes est neutre, attirant l’attention sur l’excellent travail présenté sur le site.
autre exemple d’Open Sans
La version light d’Open Sans sert aux titres sur le site web The Industry

ANONYMOUS PRO

Anonymous Pro est une police monospace (police d’écriture à chasse fixe) que peu de designers connaissent, ce qui est surprenant quand on sait qu’elle a été conçue par Mark Simonson, le designer de Proxima Nova. Les polices monospace sont à la mode et Anonymous Pro est une excellente option.

Inconsolata, disponible également sur Google Fonts, est plus utilisée, mais elle n’intègre pas les italiques contrairement à Anonymous Pro. En général, l’utilisation d’une police monospace en corps de texte n’est pas une bonne idée, mais dans le bon contexte elle peut donner à votre design une certaine fraîcheur.

exemple d’Anonymous Pro
Per Sandström utilise Anonymous Pro en grand format dans son corps de texte sur un site où l’association avec Futura pour les titres fonctionne étonnamment bien.
autre exemple d’Anonymous Pro
Les boutons utilisent la variante grasse d’Anonymous Pro sur le site de Per.

PLAYFAIR DISPLAY

Playfair Display est une police sérif très contrastante conçue par Claus Eggers Sørensen. Elle rappelle Baskerville et trouve son inspiration dans les fontes de la fin du 18e siècle. Bien que conçue à l’origine pour les titres, les 3 poids et leurs italiques lui permettent de convenir à de petites portions du corps de texte. Pour de plus longues portions, Playfair Display forme une belle association avec Georgia.

exemple de Playfair Display
Playfair Display offre une belle variante italique qu’on peut voir sur le site de Boompa Records.
autre exemple de Playfair Display
Playfair Display en gras pour les titres du site de Digital Abstracts.

ROBOTO

Roboto a été qualifiée de “Frankenfont” — une fusion d’Helvetica, DIN et Myriad. Je comprends la critique mais ça ne m’empêche pas d’aimer Roboto. Depuis cet article, des améliorations ont été apportées à Roboto et je trouve que cette police fonctionne bien sur toutes tailles et résolutions d’écrans, ce qui est son objectif.

Elle semble familière et pourtant plus on la regarde et plus on se rend compte qu’elle possède quelque chose d’unique. La famille Roboto intègre également une jolie version slab (égyptienne) et une version condensée.

exemple de Roboto
J’utilise Roboto sur mon site Type&Grid et les polices ont un beau rendu sur les écrans à haute densité, même de petite taille.
autre exemple de Roboto
La version light de Roboto sur le blog de Paone Creative.

LATO

Lato signifie l’été en polonais, un nom qui va bien à cette police sans-sérif chaleureuse. Au départ, le designer Lukas Dziedzic a réalisé cette police pour un client mais lorsque celui-ci a changé d’avis, Lukas a décidé de publier sa police. Lato semble modeste et sans prétention lorsqu’on l’utilise dans le corps de texte mais la variante italique est très particulière et reconnaissable. Lato est utilisée par le dernier thème par défaut de Wordpress, Twenty Fourteen, et deviendra plus populaire de ce fait.

exemple de Lato
Frank Chimero fait un bel usage de la version extra light dans son article "Ce que veulent les écrans", en capitales de grande taille, ce qui est nécessaire pour une graisse tellement délicate.
autre exemple de Lato
Le site d’AIGA "100 ans de design" montre une version personnalisée "sans point sur les i" de Lato.

MERRIWEATHER

Conçue par Eben Sorkin, Merriweather est une police sérif créée pour la lecture à l’écran. Sa grande hauteur d’x et des sérifs costauds lui assurent une excellente lisibilité. Merriweather est encore en développement actif et s’améliore constamment. Il existe aussi une version sans-sérif qui l’accompagne remarquablement.

exemple de Merriweather
La version light de Merriweather donne au site de Dickson Fong une allure élégante.
autre exemple de Merriweather
Vtcreative fait ressortir le style light italique de Merriweather dans son footer.

KARLA

Karla est une police grotesque sans-sérif conçue par Jonathan Pinhorn qui est pleine caractère et de bizarreries. Quelque chose en elle me rappelle la police à la mode Aperçu. L’espacement des caractères est peut-être un peu large pour le corps de texte et parfois le crénage peut sembler bancal, mais son originalité me fait oublier ces imperfections. C’est une police parfaite pour ajouter une touche de personnalité à votre design.

exemple de Karla
Borsch, Vodka & Tears utilise Karla pour les quelques irruptions de corps de texte sur son site, et ça fonctionne.
autre exemple de Karla
Kalyn Nakano fait ressortir les variantes normal et gras de Karla sur son portfolio.

CLEAR SANS

Clear Sans est la contribution récente d’Intel à la communauté open source des polices de caractères. Priorité a été donnée à la lisibilité, par exemple le “i” majuscule a des empattements pour le distinguer du “l” minuscule. C’est donc un bon choix pour le design d’interface utilisateur où la clarté est essentielle. Clear Sans n’est pas disponible actuellement sur Google Fonts, donc il vous faudra l’héberger.

exemple de Clear Sans
La délicate variante light de Clear Sans est utilisée pour le corps de texte sur le site de Clear Sans.

FIRA SANS

Conçue pour l’OS de Firefox, Fira Sans a été récemment publiée en open source. Cette police a de nombreuses similarités avec FF Meta, ce qui n’est pas étonnant quand on sait qu’Erik Spiekermann est le créateur des deux. Il est rare de trouver une police de caractères gratuite créée par un designer aussi renommé. Fira Sans comprend une version monospace appelée Fira Mono.

exemple de Fira Sans


AUTRES POLICES INTÉRESSANTES

Enfin, Jeremiah Shoaf a publié récemment un pdf qui présente les 10 meilleures Free Fonts qui ne sont pas sur Google Fonts, avec un lien à chaque fois pour le téléchargement. Certaines sont magnifiques et auraient mérité de figurer parmi les polices présentées dans l’article (en fait il y en a une : Clear Sans).

N’UTILISEZ PAS LES POLICES GRATUITES POUR TOUT

Aussi belles soient-elles, les designers ne devraient pas se contenter des seules polices gratuites, qui n’arriveront jamais au même niveau que les polices des meilleures fonderies. Budgétez des polices professionnelles chaque fois que vous le pouvez. Les fonderies ont besoin du soutien de la communauté des designers pour continuer à innover.

Ceci étant dit, si vous devez télécharger des polices gratuites dans votre projet, pour des raisons budgétaires ou autres, dites-vous bien que le choix est toujours plus grand. Je tiens à jour une liste de fontes open source sur mon projet Typewolf. Vous pouvez également consulter un autre de mes projets, Type & Grids, qui utilise plusieurs des polices décrites ici.

Créer une police demande beaucoup de temps, de patience et de travail, et les designers devraient être récompensés pour leur travail. Si vous décidez d’utilisez des polices gratuites, n’oubliez pas de leur renvoyer l’ascenseur en achetant d’autres fontes ou en faisant un don pour soutenir leurs efforts.

(NdT, pro domo : n’oubliez pas non plus que la création de musique demande du temps, de la patience et du travail, si vous voulez soutenir les artistes que vous aimez n’oubliez pas de payer de temps à autres pour leur travail).


Intéressé par la typographie ? Sur la Cascade vous pouvez retrouver beaucoup d’autres articles et ressources sur la typographie.

Tous les articles sur la typographie parus dans La Cascade.

Du même auteur sur La Cascade : Typographie du site Advertising Age, une analyse en profondeur d'un site, du point de vue de sa typographie.


original paru le dans Smashing Magazine.

Sur l’auteur : est designer freelance dans le Colorado. Il s’occupe de Typewolf et crée des thèmes CMS pour son autre projet Types & Grids. Il tient à jour une liste des polices gratuites de qualité. Vous pouvez le suivre sur Twitter.

Traduit avec l’aimable permission de Smashing Magazine et de l’auteur.
Copyright Smashing Magazine © 2014.