1. Decide if your document is to be read mainly on screen.

Some Web documents are meant to be retrieved electronically, then printed and read on paper. Others are intended primarily to be read online. Good page composition (see the section on Organizing Text and Graphics) and typography will be valuable in either case, but the low resolution of most monitors imposes some constraints on pages to be read online.

2. Be sparing in your use of large heading sizes.

Good typography, as other good design, depends on contrasts. While very large headings offer contrast in size to following body text, they may give less contrast in weight and value, because enlarging the letters also enlarges the counters, or spaces within the letters. Big type also slows reading and pushes following material farther down the page, again reducing apparent contrast. Save the first level or two of HTML header styles for titles and title pages, if you use them at all. Simple bold text is often the most effective style for subheadings.

Note: Be aware that HTML header style tags were designed to be used in order, from largest to smallest. While this may make an illegible page, automated indexing and search programs may look for these tags in your documents. In some cases you may have to choose whether people or machines can best read your pages.

3. Consider using inline graphics of bitmapped text for headings.

If you don't have too many subheadings on a page, inline graphics using bitmapped type offer many advantages. They can be created from a wide selection of fonts, allowing you to reinforce the visual unity and distinctiveness of your document, set of documents, or site. Bitmapped type can be anti-aliased, reducing the "jaggies" and improving online legibility at small sizes. Bitmapped type can be created in various colors, adding another tool for emphasis and coherence. Graphics of bitmapped type can be created on transparent backgrounds or within bars or other shapes, giving additional ways to achieve contrast and emphasize your document's structural divisions. Remember, however, that you'll need to provide an <alt> text version for text-only browsers, and that graphical browsers configured to run with "images off" may not display such headings at all. Consider the needs of your expected audience.

4. Watch out for HTML italics.

Most italics set lighter in value than the regular, or roman, version of the same typeface, so they are not good for adding emphasis to passages longer than a few words, unless the text is bolded as well as italicized. The onscreen letterspacing of HTML italics is so poor, however, that they are often completely illegible at any but the largest sizes (they print correctly, however). Italics are a poor choice for headings or callouts unless bolded.

5. Try using blockquote and unordered list tags to keep lines short.

Long text lines require more head and eye movement to scan than short ones. In print, this may not be inappropriate if a deliberate reading speed is desired. On low resolution screens, and where quick scanning is important, long lines are fatiguing and frustrating. HTML blockquote and unordered list tags, though designed for specific purposes, can be used anywhere you want indented text to shorten line length. Other HTML tricks and Netscape extensions can be used to obtain the ideal online line length of three to four inches.

6. Use rules sparingly and consistently.

Rules that extend to both edges of a page chop it into sections and interrupt the flow of pattern from one section to the next. Thus they are most useful for dividing the page into structural parts (such as title area, body, footer) and for major content divisions. Rules, generally speaking, work better as unobtrusive lines than as beveled boxes that call attention to themselves. Rules equal to or shorter than the line length often harmonize better with text than longer ones. Inline graphics can be used to create custom rules or more dramatic "breaker bars" for special purposes.

7. Save patterned backgrounds for special effects.

There's a reason that most books are not printed on patterned paper. A strong pattern on a Netscape tiled background plays havoc with the legibility of text. Text on most monitors is barely legible anyway, and can't stand up to much competition. If you use patterned backgrounds, keep the pattern contrast low, the color intensity low, and the value light, for maximum contrast with the text. Such patterns are most effective on pages with only bold images and large display type, such as specialized site-level home pages. Background patterns such as logos may create unfortunate effects when elements such as shaded rules fall randomly across them. Solid color backgrounds are much more versatile and can be used anywhere if the background hue and chroma (intensity) are chosen for good contrast with the type.

8. Of colored type and blinking text

If you choose to use the Netscape extensions for colored fonts, proceed with care. For body text, choose a color with low chroma so that letter outlines are not blurred. Somewhat brighter and more intense colors can be used for headings and other display type, but save glowing type for special effects.

If text set in all caps seems to SHOUT, then blinking text is like a car alarm blaring in an empty parking garage. If you truly have a message of alarm, or something so new and important that you're willing to risk annoying viewers and having them ignore the rest of your page, then use blinking text. Sparingly. One or two words will do it.

9. Tables can be used to achieve columns and side-by-side arrangements, as well as to present tabular data.

HTML extensions now include tags for setting up tables--arrays of content in rows and columns. Note however that on browsers that don't support tables, the content will not simply be ignored, it will be scrambled all over the page. If the audience for your content includes users of past versions of Mosaic or of text-only browsers, a table is a poor mode to present it in.

For viewers using Netscape, tables can be effective with traditional tabular data. Don't overwhelm the data with a border treatment that's too heavy, dark, or elaborate. Choose the weight and color of borders to fit in unobtrusively with the overall grid or page design. Allow adequate space between lines of text in the cells and their borders for good legibility. If you consider borders with beveled edges, evaluate how the depth illusion works with other such dimensional elements on the page. Table border attributes can be used, on the other hand, to give a matted or framed look to a single image or group of images.

Tables can also be used without borders. This is one way to achieve a multi-column text layout. Borderless tables are usually more effective even for presenting traditional tabular data. All HTML tags, including links and images, work within a table format.