@font-face. Une simple règle CSS, un univers de création de plus!

5.02.12

Un petit article technico-historique sur les “font” ou en bon français: Police de caractère sur le pas si nouveau médium qu’est le web.

Tout d’abbord reposons un peu les bases: Qu’est-ce qu’un police de caractère, police d’écriture, font? un petit tour sur wikipédia
police d’écriture
donne la réponse suivante:

C’est un ensemble de glyphes, de caractères d’une même famille qui regroupe les corps et graisses. Idéalement le sytle est coordonné.

Le reste de l’article vous expliquera que tout ce vocabulaires très “corporelle” vient de l’imprimerie classique.

Un point à noter: En français fonte avec le petit e derrière est très différent de l’anglais font qui désigne une police de caractère.

En gros police de caractère = font , mais fonte = sous ensemble d’une police de caractère.

Bien mais qu’est-ce que cela à voir avec internet. Eh bien depuis quelque temps, on peut voir fleurir des fameuses police de caractère sur quelques sites webs. Du moins sur les sites des webdesigner, graphistes au autres “avant-gardiste”.

La raison est simple. L’apparition d’un nouveau système standard de gestion de ces fameuses “font”. Une règle CSS nommée @font-face.

Fonctionnant sur google chrome, firefox, safari et IE 9…

La magie tient dans le fait que désormais, au lieu de fournir des “images” de texte stylisé sur votre logiciel de retouche photo… de création numérique favoris. Vous allez pouvoir embarquer directement des polices d’écritures dans votre site web. Donc plus besoin d’éditer X images si l’on souhaite changer de police d’écriture. Et vos utilisateurs “en mode texte” que sont les robots de référencements, les geek linuxien sombre adeptes de la ligne de commande, mais aussi les aveugles, vont grandement apprécier ce passage naturel de l’image au texte.

Alors bien entendu plusieurs sites sont à noter:
smashing magazine
Smashing magazine est un site vraiment dédier aux graphistes et professionel du web. Très à la page et de bonne réputation. Les articles techniques consacrés à la typography sont très intéressant.

Font Squirrel
La ou l’on peut chercher des polices pour vos sites professionels.

Le typographe
Le site de référence en français, vous y découvrirez POURQUOI, si vous n’y êtes pas sensible, les fonts font finnalement partis de votre quotidien et détermine des marques, des images.
Le lien sur les ressources vous fourniras de passionantes lectures.

Le typographe : ressources

Mais tout ça pour en revenir à un point fondamental.

Les polices d’écritures fournissent à peu de frais (du moins si vous ne vous payer pas une font proffesionnel) une marque de caractère bien plus péchu qu’une mise en page avec quelques images.

Avis aux gamers, pensez à Diablo, Baldur’s Gate. La police d’écriture de ces jeux est juste rentré dans votre inconscient.
Un très bel article sur les polices de nos jeux et autres:
Les polices d’écritures dans le jeux vidéo

Demandez a des amis graphistes, web designer, adeptes de photoshop et de dafont de regarder avec vous dans la rue les différentes polices d’écritures des enseignes et autres pub.
Vous allez voir, ils sont capable non seulement de toutes les reconnaitres, mais en plus de porter un jugement critique sur la “pertinence” de l’utilisation de tel ou tel font.

C’est tout un univers graphiste qui s’offre au web par l’arrivé très tardive de cette règle de présentation. L’uniformisation du traitement des polices d’écritures sur l’informatique.

Un peu d’histoire technique?

Allez en premier lieu. Merci à Steeve Jobs, eh oui, qui a mis en avant ce coté “design”.
explications en anglais

Maintenant le système d’impression le plus précis du monde informatique est du à un géni: M. Donald Knuth avec TEX et METAFONT, deux programmes qui sont des références depuis 30 ans.

Enfin vous pouvez essayer de vous lancer dans fontforge, le logiciel open source de création de font. Font Forge

Tout ça pour dire que j’ai testé @font-face sur ce site et que je compte bien continuer!

Pierre Bousquie

,

---

Commentaire

Commentaires fermés pour cet article

---