|
|
Article
Webmaster Resource Tutorial: How to Embed Fonts
© AffiliateSeeking - This article is not allowed to be re-published but can be linked to.
Generally webmasters should use only "standard" font types on their web pages. Sometimes however, you find a nice font that you can't resist using. Our webmaster resource shows you how to embed fonts on your web pages. Unfortunately, there is not one method that works for all browsers, so a few different techniques are suggested in this tutorial.
TUTORIAL FOR INTERNET EXPLORER:
First, you need to download Microsoft's free font-embedding tool, called Web Embedding Fonts Tool or WEFT available from their web site. Install it and run the wizard.
Briefly, this is how you use this webmaster resource:
1. Enter your information (webmaster info: name and e-mail).
2. Locate the web page files that require the fonts you want embedded.
3. Begin the WEFT analysis.
4. WEFT displays the list of fonts to embed.
5. Specify the local hard disk folder where the font objects (Embedded Open Type or EOT files) will be created.
WEFT embeds the fonts with CSS like this:
<!-- /* $WEFT -- Created by: Webmaster (webmaster@resource.com) on 8/20/2007 -- */
@font-face {
font-family: Garamond;
font-style: normal;
src: url(GARAMOND1.eot);
}
@font-face {
font-family: Fantasy;
font-style: normal;
src: url(FANTASY1.eot);
}
-->
</STYLE>
WEFT appears to insert the same CSS code invoking all fonts into all the web pages, even if not all the pages use the same fonts (though what good webmaster would do that?).
Now exit the program and upload the font objects and web pages to your server. You should then be able to view the embedded fonts as desired. Test this by temporarily removing the embedded font(s) from your fonts folder. Or better, use another computer or ask a friend to do it for you. If you've done as the tutorial says, you should be able to see the fonts there.
TUTORIAL FOR NETSCAPE NAVIGATOR
This webmaster resource article will not discuss this in detail. An old way of embedding fonts for Netscape uses the Portable Font Resource or PFR font file type instead of EOT.
The PRF is invoked in this way:
<head>
<title>Webmaster Resource Tutorial</title>
<link rel=fontdef src="/fonts/tutorial.pfr">
</head>
FOR OTHER BROWSERS
We can't close this webmaster tutorial without considering other browsers. Suppose you do not want to try either of the previous methods, or you want your fonts to appear in all browsers. You have two options:
1. Make the fonts available for download (zipped).
2. Use transparent GIF files instead of fonts. (Ideal if you will only use the fonts for titles and headings.)
WEBMASTER RESOURCE ADVICE
1. When choosing fonts for your web site, please don't forget about copyright laws. Some fonts may be copyrighted and thus are illegal to distribute on the Internet.
2. Most free fonts you will find on webmaster resource sites are seldom fit for professional web design. At best, you can use them for titles and headings only.
3. Choose fonts that fit the theme of your web site. If your site is about webmaster resources and articles, a decorative, medieval font like Old English would seem inappropriate.
4. Sometimes it's nice to see a web site that uses a font other than Arial; but these are often "luxury", "literary" or "artistic" sites. Book font types like Century Schoolbook read slowly. If you think your visitors will be in a hurry, avoid such fonts.
Font-embedding like this can help you get that professional look for your web sites. We hope you find this tutorial on font-embedding useful. For more, please see our other webmaster resource articles.
|
If you want to use this article on your website, in your newsletter or anywhere else on the Internet, then you can only link to the article and not re-publish it. If you wish to link to the article, here is the html linking code:
| <a href="http://www.affiliateseeking.com/ashow/101.html">Webmaster Resource Tutorial: How to Embed Fonts</a> |
|
|
|
|
|
