Here is simple and easy method to embed cross-browser fonts for your website.

For this purpose you need to convert the commonly used .ttf font file to 3 other formats like .woff, .eot, .svg

TrueType – A format designed to look good on-screen ; recommended particularly for Windows browsers.

EOT – You need this format if you want to target Internet Explorer. IE will not use any other format. Our EOT’s would be considered ‘lite’ since they are neither compressed nor domain-restricted.

SVG – This is an XML format supported by some browsers including the iPhone and iPad.

WOFF – This cross-browser, web-only font format is lightweight (font data is zip compressed) and can be compiled with either TrueType or PostScript (CFF) outlines. It is currently supported by FireFox 3.6+.

The First thing is to get the required font, Since  most of  the fonts are copyrighted so either buy  or  get the free ones, you can  get some here too -  The League of Movable Type (Open Source Fonts)

• Open the site  @Font-Face Kit Generator
• Add Fonts – Upload the selected font, (multiple select is also  available). Here  I have used “Anivers Regular” font.
• Select easy and check the Agreement.
• Download Your Kit.
• Now all the required files and converted fonts will be in downloaded zipped file.

Check the demo file and  you will  know the rest.  A snapshot is given below.

Be Sociable, Share!

•