J'ai un blog

Voici la technique la plus facile pour choisir (enfin) une police en html, le @font-face !
Magique ?

/* Graublau Sans Web (www.fonts.info) */
@font-face {
font-family: Graublau Sans Web;
src: url(GraublauWeb.otf) format(« opentype »);
}
body {
font-family: Graublau Sans Web, Lucida Grande, sans-serif;
}

L’exemple vient de cette page (que je vous invite à lire) :
http://hacks.mozilla.org/2009/06/beautiful-fonts-with-font-face/
Mais si on RTFM un peu :) et qu’on connait le monde de la typo (des bisounours ?), la magie a ses limites ; ici GraublauWeb.otf est distribué gratuitement et son auteur autorise l’encapsulage (embed) web, donc si vous voulez mettre une police commerciale comme l’helvetica Neue, c’est facile mais c’est pas bien !
Rapidement, avec les bases du html et css, n’importe qui peut télécharger le fichier de la typo.
Comme je suis sympa, voici l’exemple (piquer là encore) à suivre pour utiliser l’helvetica neue si elle présente chez l’utilisateur (mais là, je ne vois plus l’intérêt du font-face !)

/* MgOpen Moderna */
/* http://www.zvr.gr/typo/mgopen/index */

@font-face {
font-family: MyHelvetica;
src: local(« Helvetica Neue »),
local(« HelveticaNeue »),
url(MgOpenModernaRegular.ttf);
}

@font-face {
font-family: MyHelvetica;
src: local(« Helvetica Neue Bold »),
local(« HelveticaNeue-Bold »),
url(MgOpenModernaBold.ttf);
font-weight: bold;
}

body { font-family: MyHelvetica, sans-serif; }

On va terminer sur une note d’espoir avec des typos embedables légalement.
http://spyrestudios.com/21-awesome-font-face-embedable-typefaces/
http://opentype.info/demo/webfontdemo.html

(No Ratings Yet)