Beste leden,

Ben al even gezocht op internet maar word er niet veel wijzer van, er zijn zoveel manieren. Wat is de beste manier om een extern font in te laden? Het gaat om een OTF versie. Graag samen met een voorbeeldje. :)

Met vriendelijke groet,
Vincent Meijering

met cufon, ik weet niet hoe het precies werkt maar wat ik wel weet is dat het prima werkt.

Dit werk tot nu toe het makkelijkst : http://www.fontsquirrel.com/fontface/generator
Gewoon font uploaden & hij maakt de css voor je. Evenals een voorbeeld in html

Als je weet hoe je bijv. een extern css bestand of jQuery inlaadt ben je al een eind op weg.

Google biedt aan om fonts (legaal) te gebruiken. Hierover meer linkje google fonts

Er zal niet alles tussen zitten wat je bevalt, maar het is wel een vrij gemakkelijke oplossing. Als je bekent bent met css kun je in je css bestand bijv zetten

h1 { font-family : 'Nobile', Arial, sans-serif; } en al je titels zullen (waar browsers dit kunnen tonen) in het nieuwe font te bewonderen zijn. Heb je echter een eigen font aangemaakt of een vrij onbekende en wil je daarin het web veroveren dan biedt Cufon uitkomst.

Ikzelf ben geen echte voorstander, omdat het allemaal net iets minder lekker leest, maar het is in elk geval wel super mooi.

Ik zal proberen het uit te leggen, maar het klinkt waarschijnlijk moeilijker dan het is. Wat Cufon doet is alle woorden (die jij in je mooie font wilt zien) veranderen in kleine plaatjes. Het font dat jij upload op cufon, zetten ze om in code die per letter weet hoe breed / hoog en dik de letter moet zijn. Dit geeft een vrij lange code, maar daar hoef jij verder niets in aan te passen. Vervolgens kun je met javascript aanroepen wat je wil veranderen. (Gelimiteerd, maar met jQuery erbij kun je alles selecteren)

Om alle titels (h1) te veranderen kun je

Code:

   <script src="cufon-yui.js" type="text/javascript"></script>
   <script src="Nobile.font.js" type="text/javascript"></script>
   <script type="text/javascript">
       Cufon.replace('h1');
    </script>

gebruiken.

cufon-yui, kun je gratis downloaden (bibliotheek die nodig is) en Nobile de naam van je .otf of .ttf bestand omgezet door cufon in een javascript bestand.

Gelukkig heeft Cufon zelf ook een zeer uitgebreide documentatie en usage guide.

Hier te vinden

Cufon Generator

Er zijn nog meer manieren om je tekst om te zetten naar plaatjes (met javascript of flash) maar mijn antwoord lijkt me al lang genoeg. Ook zijn deze twee genoemde oplossingen verreweg het makkelijkst te gebruiken.