Appropriate fonts include those fonts readily available on most computers. If the user’s computer doesn’t have the fonts you use in your Web site or Help file, the user's browser will substitute another font, most likely Times New Roman and in some cases Symbol (Symbol). Sometimes the result is acceptable; sometimes the result makes the text hard to read. The lesson here is to use common fonts.
Table 1 shows a list of common fonts to use in Web sites or Help files. If you want your users to see your Web site or Help system in the font you intend, strongly consider sticking with the common fonts listed in the following table:
| Typical Use | Special Use |
|---|---|
| Arial | Arial Black |
| Georgia | Arial Narrow |
| Tahoma | Comic Sans MS |
| Times New Roman | Courier New |
| Trebuchet MS | Impact |
| Verdana | Webdings (Webdings) |
Other fonts fall into a gray area or should be avoided entirely. Table 2 lists "gray-area" fonts that at least some of your users will have on their systems. Keep in mind, though, many won't have these fonts installed.
| Common Use | Special Use |
|---|---|
| Book Antiqua | Bookman Old Style |
| Calibri | Century Schoolbook |
| Calisto MT | Consolas |
| Cambria | Lucida Console |
| Candara | |
| Century Gothic | |
| Constantia | |
| Corbel | |
| Garamond | |
| Helvetica | |
| Lucida Sans | |
| Palatino Linotype | |
| Segoe UI |
Regardless of the font you use, but especially If you MUST use a font listed in Table 2 or not shown on this page at all, you should provide your users with some alternative fonts. In Web sites, you accomplish this task by providing a "font-family" list in your CSS. In Help systems created with RoboHelp HTML, you accomplish this task by using a Font Set. (Be sure your Font Set name contains no spaces, though, or it won't apply correctly.) In other words, you want the style sheet to list your preferred font first and then end with a generic category. So, for example, if you want to use Calibri as your main body font, you also need to define "sans-serif" as the generic category. Then, if the user's computer doesn't have Calibri, the browser will use the default sans-serif font. On Windows systems, the browser will probably use Arial; on Mac systems, the browser will probably use Helvetica.
Also consider how you use fonts in your documents. Many users prefer reading
on-screen text in a sans serif font. Sans serif fonts have larger strokes, making
the text easier to read.
In addition, don’t use too many fonts. Using multiple fonts adds clutter and confusion to a document. Typically, you shouldn’t use more than two fonts: one for your headings and one for your text. In Web sites and Help files, though, using only a single font for both is the common practice.
Finally, use sensible style choices. The default Heading 1 size in a new RoboHelp HTML project, for example, is 24pt, which is unnecessarily large given the constraints of the screen. Either use the style sheet option to change the default heading sizes, or switch to a more appropriate style sheet, such as MS_Help.css. Similarly, if you decide to use color for headings or other text, pick a cool color (such as blue or green) or a color that matches a corporate identity (such as maroon for Missouri State University). Always use black for body text.