Når man snakker om fonter og internettet, kan man normalt ikke være sikker på, at den bruger, der ser på ens hjemmeside nu også ser den med den skrifttype man selv har valgt. Dette gælder særligt, hvis man har valgt en skrifttype, der ikke er "standard".
Imidlertid er der en mulighed for at bruge sine egen (og andres) skrifttyper og være sikker på at brugeren nu også ser siden med disse skrifttyper.
Dette skal liiige tages med et gran salt: Det gælder forløbigt kun for browseren Internet Explorer. Derfor har jeg også inkluderet et lille PHP-script, der kan finde ud af om brugeren sidder med Internet Explorer og derfor viser de ekstra linier med den specielle font eller en anden browser og derfor viser linierne med en standard-font.
Download og installer program
Microsoft har stillet et program til rådighed som alle kan downloade. Programmet hedder WEFT (Web Embedding Fonts Tool). I skrivende stund er det version 3 der er den nyeste. Du kan jo selv checke om der er kommet en nyere version, når du skal downloade.
Installer programmet ved at dobbeltklikke på filen du downloadede.
Jeg har ikke prøvet nogle af de mere avancerede muligheder for installering, men bare klikke næste (next) eller OK hele vejen igennem.
Hent en speciel font
For nu at kunne lave øvelsen og se, om den virker på andre computere skal du bruge en speciel font. Jeg har hentet en lidt mere speciel skrifttype fra www.acidfonts.com, hvis du hellere vil forsøge dig med en anden kan du bare hente en anden fra denne (eller en anden) side.
Download denne (zippede) skrifttype: king.zip. Gem den på skrivebordet
Pak den derefter ud i mappen c:\WINDOWS\Fonts
Du er nu klar til at oprette en side, hvor du bruger fonten.
Opret en ny side
Du skal nu oprette en side, hvor du benytter Stylesheet til at vælge en font til siden:
Start WebWriter
Opret en ny side efter Standardskabelonen
Opret et internt stylesheet, der ser således ud:
<style type="text/css">
body {
font-family:"King's Ransom";
}
</style>
OBS: Da der er en apostrof i selv font-navnet, så bliver du nødt til at skrive gåseøjne omkring navnet i stedet for som normalt kun apostrof.
Luk siden igen
Brug WEFT
Du skal nu bruge det program du installerede tidligere. Det programmet gør, er at tage den font du har valgt (og som ligger i mappen C:\WINDOWS\Fonts) og lave den om til en "embeddable font". Altså en font, der kan "indlejres" i hjemmesiden. Samtidig bliver der også lagt en indbygget beskyttelse ind i fonten. Den kan derfor kun bruges på den (eller de) server(e) du angiver og ikke andre steder.
Start WEFT (Du kan finde den under: Start -> Alle programmer -> OpenType Tools -> Microsoft WEFT
Programmet starter måske med at spørge om det skal indekserer dine fonte. Du kan selv bestemme om du svarer ja eller nej.
Næste skridt starter en Guide (hvis guiden ikke starter, så luk programmet og start igen)
Klik Næste
På næste skærmbillede skal du udfylde dit navn og din email-adresse.
Klik derefter Næste
Næste skærmbillede er vigtigt. Her skal du fortælle programmet, hvilken side der skal indlejres fonte på:
Klik på knappen med de 3 punktummer.
Åbn den side du skal bruge:
Du kan nu se et "biblioteks-træ", der viser hvilken fil du har valgt og hvor den ligger.
Klik Næste
Programmet skal nu til at analysere din hjemmeside. Sørg for at der ikke er et hak ud for "Skip analyses". Klik Næste
I dette tilfælde har programmet fundet 2 fonte hvor den ene er "syntetisk". Marker begge fonte og klik Næste
Du skal nu fortælle programmet, hvor det er tilladt at bruge fonten (dvs. på hvilke servere). Hvis du har en server, der hedder www.onion.dk og også gerne vil kunne bruge den på din lokale (localhost) server og også på skolens (f.eks. solen.her) så skal du klikke på knappen Edit:
Du får nu et nyt vindue. Skriv navnet på serveren og klik Add. Gentag dette for alle serverne (du skal selvfølge bruge dine egne og ikke dem du kan se her):
Klik OK
Klik derefter Næste
Nu bliver fonten oprettet (der var desværre en fejl i fonten eller lignende). Samtidig bliver der også oprettet et stylesheet på den side du havde angivet i starten. Hvis du bliver spurgt om du skal uploade ændringerne til din server, så svar nej.
Se ændringerne på siden
Åbn nu den side du har fået lavet ændringerne i.
Øverst kan du se ændringerne. Ret lige koderne, så der kun er et sæt af Style/Style:
<style type="text/css">
body {
font-family:"King's Ransom";
}
<!-- /* $WEFT -- Created by: Karl Carlsen (karl@yaboo.dk) on 11-11-2004 -- */
@font-face {
font-family: King's Ransom;
font-style: normal;
font-weight: 700;
src: url(KINGSRA0.eot);
}
-->
</STYLE>
Det, der er nyt i stylesheet-koderne er:
@font-face {
...
...
src: url(KINGRAO.eot)
}
...der fortæller, hvilken font-fil, der skal bruges.
Se font-filen
Sørg for at du har åbnet WebWriter
Aktiver Resursefanerne (F7), hvis de ikke er aktiveret.
Klik på knappen Alle filer. Her kan du se font-filen. Den ender på .eot. Der kan i visse tilfælde være flere filer, der hedder næsten det samme: KINGSRA0.eot, KINGSRA1.eot, KINGSRA2.eot, hvis du har brugt fed og kursiv eller lignende formatering.
Upload nu siden og font-filen til din server.
Gå over til en anden maskine (ellers kan du jo ikke checke om det også virker). Hent siden du uploadede og check resultatet.