TYPO 03 & @font-face

@font-face c’est avant tout, la possibilité de mettre n’importe quelle typo, de n’importe quelle langue, sur l’ordinateur de l’internaute qui visite notre site, c’est de la typo embarquée.

 

Qu’est ce que @font-face ?

@font-face c’est une spécification élaborée dans le langage CSS (Language informatique qui permet de transformer du code en structure, couleur… et autres). Grâce à @font-face, toutes les typographies existantes, ou presque, peuvent être transformées pour un affichage dynamique sur le web. Nos habitudes de navigation évoluant aussi vite que le monde bouge, nous sommes de plus en plus sollicités, non seulement en tant que graphiste, mais surtout en tant qu’acteur du web, pour dépasser les limites techniques d’aujourd’hui, et construire celles de demain. Les formats de typos sont légers, ils n’alourdissent que très peu le chargement de la page, il est donc assez intéressant de profiter de cette option. Que ce soit pour marquer une certaine différence avec la généralité des sites en ligne, ou pour élaborer une mise en page créative, la Typo, longtemps génératrice de frustration, est maintenant à notre service.

 

L’histoire de @font-face

Petit historique par www.alsacreations.com/

 

Comment insérer @font-face ?

Voir l’article de Alsacréation « Comment utiliser une fonte «non-standard» sur un site Web ? »

 

@font-face et les navigateurs

Les navigateurs prennent en compte de plus en plus les @font-face. Ci-dessous les statistiques :

Version des navigateurs qui supportent @Font-face

Sources : Alsacréation

 

Optimiser le rendu

Compatibilité Chrome : blog.clever-age.com/
Les problèmes de rendu font-face sous chrome et firefox, utiliser des contours postscript : blog.wax-o.com/

 

Et enfin, tester sa font !

Tester sa Google font, ici un exemple avec la typo « PT Sans Narrow » : typecast.com

Partager

D’autres articles

A propos de moi

Des bancs de l’école à graphiste, de graphiste à web designer, je suis aujourd’hui devenue directrice artistique. Enthousiaste et passionnée, j’aspire à de nouveaux défis, en remettant l’humain au cœur de l’univers du web. Je suis Anaïs Lopez, je vous invite à découvrir le portfolio, dans lequel vous trouverez les différentes créations graphiques que j’ai réalisées.
Pour me contacter : anais.lopez641@gmail.com

Catégories