HTML Text Guidelines


Guidelines:  Readability  Spelling  Grammar  Consistent Fonts  Line Width  Limit Centering  Glow and Shadows  Mixing Fonts  Uppercase Tags  Logical Rather than Physical Formatting Tags  Font Size

Readability

Text must be simple, clear, and easy to read.

Rationale: Content is valueless if it is not readable.

Spelling

Check the spelling of all text.

Rationale: Misspelled words look unprofessional and make the reader question the quality of the content.

Grammar

Check the text for proper grammer.

Rationale: Ungrammatical content looks unprofessional and makes the reader question the quality of the content.

Consistent Fonts

Consistently use different font styles, sizes, and colors for:

Rationale: Although HTML tags are case-insensitive, using all caps helps differentiate between tags and text. This makes the HTML source code easier to read and maintain.

Line Width

Limit the width of lines to about 4 inches or to between 9 and 15 words. Use tables to limit the width of text. Do not use the Netscape Navigator < MULTICOL > tag to limit text width.

Rationale: This makes the text easier to read and is the width of text in most books. The Netscape Navigator tag is not supported by Internet Exployer.

Limit Centering

Limit the use of centering (e.g., to logos, top-level headers, images) to where it is really needed.

Rationale: Lots of centered text is hard to read and looks unprofessional.

Glow and Shadows

Do not use glowing or blinking text. Do not use shadows behind text.
Rationale: Glowing text typically looks unprofessional and rarely relates to the content. Blinking text is annoying, is never needed, and often detracts from the content. It is difficult to ensure that the shadows under text are formed by a consistent light source.

Mixing Fonts

Avoid using lots of different font faces, font sizes, and font attributes (e.g., bold, underline, italic). Avoid using artistic, non-default font faces. Limit the use of italics. Avoid using underlined text.

Rationale: Using lots of different fonts is visually confusing and looks unprofessional. Different platforms (e.g., Windows, UNIX, Macintosh) do not have the same fonts, and rarely all support the same artistic font. Italics are hard to read on computer screens, especially laptop screens. Use of the underlined tag < U > confuses the reader into thinking that the text is a link; it is also being deprecated.

Uppercase Tags

Type all tags using uppercase letters.

Rationale: Although HTML tags are case-insensitive, using all caps helps differentiate between tags and text. This makes the HTML source code easier to read and maintain.

Logical Rather than Physical Formatting Tags

Use the logical formatting tags < EM > for Emphasis and < STRONG > for strong emphasis rather than < B > for Boldface and < I > for Itallics.

Rationale: This works best for browsers for the visually impaired which cannot display boldface or itallics.

Font Size

Do not use heading tags just to set the font size.

Rationale: This is unprofessional, makes the HTML difficult to maintain, and causes defects in automatically-generated tables of contexts or indexes.




HTML Design and Coding Standards:  Content  Look and Feel  Behavior  Navigation  Text  Color  Images  Sound