středa 17. října 2012

Pěkné fonty v Internet Exploreru 9 a nižším?

Při tvorbě webu dříve nebo později narazíte na omezení rozmanitosti písem, které jsou automaticky předinstalovány ve většině počítačů.

Obvykle v počítačích najdete např. Arial či Tahoma, ale třeba pěkné písmo Segoe už najdete jen na pc, které obsahuje např. Photoshop.

Takže grafici mají nádhernou paletu písem, vytvoří nádherné designy webů, ale chudáci programátoři pak musí řešit jak to písmo dostat na web jinak než obrázkem.

Naštestí máme možnost načíst externí font.

V prohlížečích podporující CSS3 se dá jednoduše vložit TrueTypeFont (TTF) pomocí css zápisu


@font-face {font-family: Segoe;
    src: url('Segoe.ttf');
 }

Ovšem věčný ignorant Microsoft do svého prohlížeče tuto podporu ne a ne zabudovat. Místo toho, ale už od verze IE 4 podporuje tzv. embeded font (eot), který se vkládá pomocí velmi podobného kódu jako u ttf.


@font-face {font-family: Segoe;
    src: url('Segoe.eot');
 }

No jo, ale kde teď sehnat ten eot font...?
Microsoft vydal program WEFT, který transformuje ttf do eot. Více se o něm dozvíte např. zde.

Mě tento program nějak nefungoval, tak jsem se zeptal strýčka Googla na jiný nástroj, ale ten mi našel tento web.
Po načtení ttf souboru se Vám zobrazí odkaz na eot soubor a navíc ještě níže uvede kód, který jen stačí vložit spolu se souborem na Vaše stránky.

Dál už nemusím nic psát, snad jen že to funguje :)