Custom font aan website toevoegen?

[Example5]

beste ...

heeft iemand een idee hoe ik een custom font aan mijn website kan toevoegen? ik heb namelijk online een leuk font gezien en deze geïnstalleerd (genaamd JSL Ancient), deze wil ik in het menu van mijn site gebruiken maar dit zal natuurlijk niet herkend worden als ik dit zomaar in de css zet.

weet iemand hoe ik dit custom font zo kan toevoegen aan mijn site zodat iedereen het font ook daadwerkelijk kan zien?

alvast bedankt

 

[RogerS]

De simpelste manier om een ander font in een webpagina te gebruiken is om plaatjes van je menu knoppen te gebruiken. Alle andere methoden zijn eigenlijk een drama.

 

[Example5]

ja, dat wordt dus een drama aangezien ik niet van alle tekst op mijn website plaatjes wil maken.

 

[RogerS]

Kan ik helaas ook niks aan doen. De achtergrond is dat dit technisch niet zo makkelijk op te lossen is. Daarnaast worden de meeste fonts ook nog eens auteursrechtelijk beschermd. Het is juridisch dus een drama om hier ook nog rekening mee te houden.

Zelfs de grote jongens onder we webbouwers blijven van dit onderwerp af. Gewoon de meest gebruikte fonts gebruiken. Dit voorkomt dat je site er voor jezelf leuk uit ziet en voor je klanten totaal niet.

 

[That Guy]

Met CSS' @font-face kan je custom fonts gebruiken die voor iedereen te zien zijn. Nadelen zijn de semi-slechte browser support en het feit dat gebruikers eerst het font moeten downloaden (dit gaat wel automatisch, maar met grote font bestanden is er even wat geflicker).


:thumb:

 

[ErikBooy007]

Je hebt ook nog de JavaScript library "Cufon", die wordt ook door Helpmij.nl toegepast. Die is aardig robuust, maar zelfs die is niet bruikbaar voor content. Die kun je gebruiken voor bijvoorbeeld menu's en headers.

Daarnaast kun je met de normale lettertypen ook al heel "professioneel" ogende dingen realiseren. Speel eens met letter-spacing, word-spacing, line-height, font-variant (small-caps bijvoorbeeld is in bepaalde gevallen goed te doen), etc. Allerlei CSS eigenschappen die in mijn ogen een beetje "vergeten" zijn, maar waar je wel hele leuke dingen mee kunt.

 

[Example5]

ik denk dat ik het maar bij een standaard font ga houden. was waarschijnlijk wel iets mooier geweest als ik simpel een custom font kon toevoegen, maar vind snelheid en compactheid belangrijker dan dat ene fontje.

bedankt allemaal

 

[5blabla5]

Voor knoppen enzo kun je php automatisch images laten genereren:

http://www.marcofolio.net/webdesign/use_a_custom_font_on_your_website.html

 

[ErikBooy007]

Ik heb het script niet intensief bekeken, maar het lijkt me dat dat enorm veel capaciteit van je server vraagt en daarom nogal een slecht idee is...

 

[5blabla5]

Das ook waar ja, maar als je geen zin hebt om alles met de hand te doen, kun je het ook met één script laten uitvoeren, die bijvoorbeeld alles wegschrijft in een map

 

[ErikBooy007]

Dat is dan wel weer zo

 

[csshunter]

Even naar de marcofolio-link gekeken: dat is een sIFR-variant, en van dezelfde soort als Cufon.
Ze werken daar met het otf-bestandsformaat voor fonts, of het ook met andere font-bestanden kan zag ik niet zo gauw. Ze waarschuwen er wel voor om niet je hele site uit zo'n font op te bouwen wegens de vertraging die dat oplevert (elk woord moet serverside omgebouwd worden tot image).

Nadeel van alle sIFR- en Cufon-achtigen is, dat de zo gemaakte tekst niet als tekst te selecteren/kopiëren/plakken valt door de bezoeker die dat wil: het zijn immers images geworden. Het kan weer wel door javascript uit te zetten en de pagina te herladen: dan komt de gewone tekst weer tevoorschijn. Maar ja, dat vraagt wel enige hardnekkigheid van de brave bezoeker!

Om fonts rechtstreeks te embedden in een site kan in principe wel, maar heeft inderdaad dramatische kanten.
Bv. van de "JSL Ancient" heb je de ttf-versie: die is no-go voor Internet Explorer. Deze heeft een eot-versie nodig.

• Nog wat meer over valstrikken en drama's:
  zie deze draad in het forum.
  
  
• En ook de daar gestalde testpagina:
  www.developerscorner.nl/csshunter/tests/test-embedded-font.htm

Zelf houd ik het ook maar op de websafe fonts: geen polonaise, hoe verleidelijk soms ook. :d

Met vriendelijke wensen,
CSShunter

 

[g3x123]

in sommige browsers worden toch geen custom fonts weergegeven?
waardoor hoogst waarschijnlijk je volledige website ineen zal zakken..

 

[csshunter]

Hoi g3x123,
Dit is een nogal oud draadje: van 1,5 jaar geleden.
Inderdaad was het toen bijna onmogelijk om custom fonts cross-browser te krijgen.

Maar intussen zijn er de Google Webfonts verschenen, en dat gaat een stuk beter!

• Hoewel ... de Google Webfonts zijn ook niet altijd ideaal.

Met vriendelijke groet,
CSShunter

 

[Example5]

ik pak nu inderdaad vaak een standaard lettertype, maar zo nu en dan gooi ik er nog eens een google font doorheen.