Fonts not appearing

[elias75]

I have this "small" problem, for one of my sites I am using a TT font which I downloaded from the internet. It looks great on my PC but when I checked it from another PC I realize that this font was not appearing and instead it was the default font of the browser.
I made it with dreamweaver and in the CSS field I can see it being properly registered
I was thinking, do I have to upload the font file on the root directory? any ideas?
many thanx in advance

 

[gchick]

well one of the problem is that the font is not installed on the other PC and it will show up like that in others since its not a standard font that the web uses. you can either post instructions for people to download the font and install it or you can make graphics of your texts or change it to the closest font on the standard font lists.

 

[tristanperry]

As gchick says, the font isn't installed on the visitor's computer.

Fonts only show up as expected when installed on the visitor's computer, so it doesn't matter whether you upload the font yourself etc; if they don't have the font, it'll revert back to the next font you specify, etc.

 

[elias75]

thank you both for your answers, this is something I didn't know! REPs + to both

 

[tristanperry]

thank you both for your answers, this is something I didn't know! REPs + to both

Anytime And thanks

 

[enlytend]

Fonts only show up as expected when installed on the visitor's computer, so it doesn't matter whether you upload the font yourself etc; if they don't have the font, it'll revert back to the next font you specify, etc.

Not entirely true ...

You can "embed" custom fonts!

Font embedding has been supported by Microsoft browsers for years (it's one of the few things M$ got right ) - but it wasn't widely used because of the lack of support in other browsers.

Good news - it's now part of the CSS3 specification, so more and more browsers in use are supporting this feature!

Currently, it's supported in IE (back to IE6), Firefox 3.5, Safari. I think it may be supported in Chrome (?) and will be in one of the next Opera releases if it's not in the current one (?). Not sure about the Mac versions of IE/Firefox.

Here's how you do it:

1) Upload the font to your website. MAKE SURE THERE ARE NO COPYRIGHT ISSUES IN DOING THIS! (i.e. if it's a proprietary font you'll need permission/licensing to use it).

2) In your css file :

@font-face {
font-family: NameOfYourFont ;
src: url( /path/to/your/font.ttf ) format("truetype");
}

format is the format of the font (for this example, I'm assuming it's truetype).
NameOfYourFont can be the actual name or any name you choose

Then you can use NameOfYourFont like you would any other font - Arial, Verdana, etc.

h1 { font-family: MyFancyFont, "Times New Roman", times, serif; }



(For non-supporting browsers you still need a fallback strategy but eventually that will eventually go the way of ugly css hacks.)

 

[gchick]

thank you both for your answers, this is something I didn't know! REPs + to both

thanks....you can also check out enlytend's answer. He has an alternative way

 

[enlytend]

He has an alternative way

That would be "She".

 

[elias75]

That would be "She".

many many thanks for your time & effort to answer this! I will try your way in a day or so (right now stuck with something else....) and will post here results so that other members with the same issue will benefit too!
REPs ++