Standardskrifttyper er kedelige (og alle bruger dem, sjovt nok) – derfor er det rart at finde skrifttyper som passer til den grafiske stil man prøver at ramme/opfinde, og rent faktisk at kunne bruge disse fantastiske skrifttyper. Det kan nu endelig lade sig gøre (også uden Flash) i alle de største browsere (Firefox, Safari, Chrome og sågar Internet Explorer 7 og opefter) med følgende lille stump kode:
@font-face
Her på siden bruger jeg tre skrifttype: Roadway til overskrifter, Georgia til brødtekst og Primer Apples til de lidt mere specielle ting. Eftersom Georgia findes på næsten alle computere, er der ingen grund til at embedde den. De to andre derimod, går jeg ikke ud fra at overvældende mange mennesker har, så dem har jeg embedden.
Under normale omstændigheder ville man embedde dem med følgende kode:
@font-face {
font-family: Roadway;
src: local(Roadway), url('fonts/ROADWAY_.ttf') format('opentype');
}
Ovenstående kode virker i alle browsere, og skal ikke bruge andet end en skrifttype i en mappe. Herefter er det muligt at bruge skrifttypen overalt man lyster ved hjælp af
font-family: Roadway;
Desværre findes Internet Explorer, og hos Microsoft gider man ikke gøre som alle de andre, så der skal man have skrifttypen i et andet format – yæi!
Dog er det ret nemt at gøre noget ved, for der findes en ret stor bunke gratis convertere – blandt andet http://ttf2eot.sebastiankippe.com/
Efter den lille konvertering skal ens CSS rettes lidt til, så den ser sådan ud:
@font-face {
font-family: Roadway;
src: url('fonts/ROADWAY_.eot');
src: local(Roadway), url('fonts/ROADWAY_.ttf') format('opentype');
}
..oog så virker det helt fantastisk godt fra IE7 og helt op til rigtige browsere
Update
IE9 er helt pjattet med sikkerhed (nu også omkring skrifttyper :S) så oplever man at IE9 driller, bør man lege med sine Apache-indstillinger.
