• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

uploading a font?

Hi guys, I'm fairly new to this place but I hope someone can help!
I'm a Product/Graphic designer by trade, recently graduated and setting up an online portfolio in a bid for freelance work.

For my website I want to use a font that isn't necessarily standard on operating systems for the menu headers. I don't want it to default to arial or another font family when people view it if they don't have my font installed on their machine.

Can I just upload the .ttf font file to where my .html files are for my site to always display that font?

Or should I just make jpegs out of the words on my machine and insert those?

Any help/comments much appreciated!
Hey Gary,

There are a few methods of getting the font you want. It is possible to upload a font and use css to show it for certain headers but a bunch of browsers wont support it.

Then there is sIFR which uses flash replacement, its a bit difficult to set up and wont work if flash isnt installed on the persons computer.

The best method i have found is cufon. You can find the link here. All you do is choose your font (try to make sure the licensing allows you to embed the font) generate the font.js file and use it along with cufon to replace anything you want. You can add a line of javascript like this:

Cufon.replace('h2', { fontFamily: 'FranKleinBook' });

And that will replace all heading 2's with a font called FranKleinBook which i have generated and uploaded. If the user doesnt have javascript enabled it just reverts to the normal font!

Hope that helped.


I will have to be a bit of an old stickler about this, but why do you not want to use standard web fonts? I know that they aren't the most exciting to look at some times, but they are legible and clean in my opinion :) why complicate it with fonts that are hard to read / hard to render?
@furto thanks for that! -I'll look into cufon and see how it comes out for me :)

@chrismitchell I do appreciate this point, and I think I may well end up using a standard web font! The original designs that I did in PS used a non-standard font and it just looked so much more exciting and a little bit more personally branded to me. I am becoming increasingly aware of simplicity, legibility and ease of use for the user so standard web fonts may be the way forward!


Active Member
The quickest and easiest way if you just want a particular font for titles is just to use jpegs(remember to fill in the alt tags though), if its a site that will be reguarily updated then sIFR or similar would be better. neither cufon or sIFR are practicle to use for the entire body copy. I've never used cufon but I now one downside of it is the text is not selectable where as it is with sIFR