Welcome to WebmasterWorld Guest from

Forum Moderators: incrediBILL

Message Too Old, No Replies

Embeding custom/rare fonts on web sites

What is the mechanism for loading custom fonts on to a web browser?



11:05 pm on Mar 30, 2007 (gmt 0)

10+ Year Member

Hello everyone,

I am building a page that uses a pretty neat font, that is not standard on the vast majority of computers. I have been told that some large sites, like the New York Times also use custom fonts and the page somehow loads the custom font on to the user's computers.

So have I understood right? And what exactly is the procedure for loading a custom font to a web browser? Is this done through some html load, CSS or java scripts? I can't find any info.

Thank you


11:44 pm on Mar 30, 2007 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

The only way I know that is both practical and doesn't seem to cause copyright trouble with the font creator/owner is a Flash technique called sIFR. Several major news sites are using it, and the technique is open source and free of charge.



6:13 pm on Apr 1, 2007 (gmt 0)

10+ Year Member

I read about sIFR and it seems like it's mostly for headers and short texts: the developer suggests not to use it for entire page because it's too heavy. But that's exactly what I am trying to do, get the entire site to use a different font than the traditional tahoma and verdana and....


12:50 pm on Apr 2, 2007 (gmt 0)

10+ Year Member

I'd think very carefully about whether this is really a good idea in the first place.

If it's only that it's a pretty neat font and nothing more, I'd doubt the value of using a technique like SIFR (or anything else for that matter) that relies on a plugin the user may have disabled.

But this is just my opinion. You may have a very valid reason for doing it...


1:20 am on Apr 3, 2007 (gmt 0)

WebmasterWorld Administrator bill is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

sIFR is accessible though...if you don't have Flash enabled then you see plain text. That's one of the reasons why tedster has recommended it. It degrades nicely.


5:17 pm on Apr 6, 2007 (gmt 0)

10+ Year Member

What I looking for ideally is a Java Script which will detect if the user has a certain font installed. If he doesn't, the Java Script would prompt the user and ask him if he wants to download the font.

Now, if the download can be done silently without a user prompt, it would be even better.

Does such a technology exist? If it doesn't, sounds like a pretty good idea to me.

Thank you all


5:52 pm on Apr 6, 2007 (gmt 0)

10+ Year Member

One other thing you should think about. You need to check the license to see if you can redistribute the font. If you made it it is fine, if it is free it is probably ok but you have to check, if you bought it then you probably can't redistribute it.

Now as a surfer, I would not download a font if you gave me the choice. I am happy surfing in Times or Verdana.


6:10 pm on Apr 6, 2007 (gmt 0)

WebmasterWorld Senior Member encyclo is a WebmasterWorld Top Contributor of All Time 10+ Year Member

prompt the user and ask him if he wants to download the font

As monkeythumpa said above, it is extremely rare that you have the right to distribute the font - which is why the various attempts at getting such a system wo work have never been widely implemented.

Bear in mind that using a "fancy" font is often seen as a mark of unprofessionalism, and dependent on the font you choose, it can negatively impact usability and legibility.

Having said all that, you can use standard graceful degradation to show the preferred font to those who have it, followed by more a generic font choice for those that don't:

body {
font-family:"MyWhizzyFont MS", "Lucida Sans Unicode", "Lucida Grande", Lucida, Verdana, Helvetica, Arial, sans-serif;

The user's browser will display using the first available font on the list, or a generic font if none are available (specify either sans-serif, serif, fantasy or monospace, whatever is the most appropriate).


Featured Threads

Hot Threads This Week

Hot Threads This Month