Embedded Font

Until yesterday, I did not know that we can embedd a font into a css file where it can be used to render a webpage with the any desired fot we like. Thanks to my buddy alf, I got to know this css tip. Yes! Now we can display a webpage with the font we like. It need not to be in the client's machine like the other default fonts. We have seen webpages with Times New Roman, verdana, Tahoma mostly but what if want something else which client doesn't have installed?

This tip was written by Larisa Thomason in netmechanic site. According to the tip, we're suppose to create an embedded font file which will be downloaded to the client machine while rendering the page. This can be achieved using a third party tool.

Create embedded fonts using one of 2 available formats:

• Portable Font Resources (.pfr): TrueDoc technology was developed by Bitstream and licensed by Netscape. It can be viewed by Navigator 4.0+ and Explorer 4.0+ on Windows, Mac, and Unix platforms.
• Embeddable Open Type (.eot): Compatible only with Explorer 4.0+ on the Windows platform. Create .eot files using Microsoft's free Web Embedding Font Tool (WEFT).

After creating this, we can attach it to the css
Attaching a TrueDoc file, by inserting the below between the head tag.

<LINK rel = "fontdef" src="url/YourFontName.pfr">

Attaching An OpenType File, by inserting the below in the stylesheet.

<STYLE TYPE="text/css">
<--!
@font-face {
font-family: Arial;
font-style: normal;
font-weight: normal;
src:url(http://www.SiteAddress.htm/EOTfileName.eot);
}
-->
</STYLE>

It is mentioned that opentype files are accessed by the user's OS.

There are two drawbacks as mentioned in the article.First is the download time which will take some more time to download the font file.Second is the security warnings which depends on client's individual browser. Client may see a warning everytime when the page accesses an embedded font.

For complete details : Get Any Font You Want