How to embed font in webpage

1. Find a font. First, find a TrueType font you want to use. I can recommend Larabie Fonts, where there are over 300 free fonts to download. I made my handwriting font for $10 using Fontifier, a service that makes a TrueType font from a scan of your handwriting. You can get a 30 day trial version of Font Creator if you want to design more sophisticated fonts.

2. Install your font. To do this, you just drag the font's ttf file into the computer's fonts folder. You can find this in the control panel.

3. Test your font. The default fonts supplied with computers are optimised for reading long tracts of text on screen. If you want to change your website's body copy, choose carefully. If your font is installed correctly, you should be able to format text using the font in Microsoft Word or other word processing packages you have on your system.

4. Use your font in your webpage. You'll need to use code similar to this, but remember the font name might not be the same as the font's filename:

My spidery script...


5. To create the embedded font files, you need to download Microsoft's free Web Embedding Fonts Tool (WEFT). It's about 9MB and runs on Windows 98 and later. Microsoft suggests it might work on Apples running PC emulators.

6. Install and run WEFT. The first time it runs it will scan the computer for installed fonts.

7. If you've closed WEFT and come back to it, click on the Wizard button. First time it starts automatically. You'll be asked for your name and email address. This will end up on your webpages that use the fonts unless you edit it out again, so enter a spam-safe email address.

8. Tell WEFT which HTML pages you want to use embedded fonts on. These should be the pages you've already styled in step 4 above. When I tried it, the feature to spider links from the first page didn't work.

9. WEFT will analyse your webpages to see which fonts they use and whether they can be embedded or not. The embedded font files (EOT files) can be set to only include the characters you're using. This is called subsetting. You can see which characters are included for each font by clicking on the subset button. If you want to be able to update text in future, it's a good idea not to use any subsetting. Otherwise you might find your font file doesn't have all the characters you later need.

10. The tool lets you define which webpages or websites are allowed to use the font so you can share fonts between your sites while blocking others from snaffling your bandwidth. You can have a maximum of three paths.

11. Back up your webpages. WEFT will add code to them to reference the font files.

12. Create the font objects. Your EOT files will be created and your webpages will be updated to refer to them.

13. Test it - Uninstall your custom font by removing it from the fonts folder in the control panel again. Upload your webpage and the associated EOT file. Visit it using IE. If you can see the font on screen, it's worked! If not, check first of all that you haven't blocked font downloading in your security settings in Internet Explorer.

Download Font creator WEFT 3.2 from Microsoft website

Go to main web site from here

About this blog

Hello visitor,
Welcome to http://onlybabu.blogspot.com technology related blog site. This website is all about latest technology; such as Computer, Mobile device, Electronics, Blogging, Website design and many more. You can get a huge number of tips and tricks from this website; that could be helpful for your daily life as in our life every moment we are using technology.

Feel free to visit us as your presence is our inspiration to continue this website.

Popular topics

Which topic you like to see in our website?