Web Style Guide: TYPOGRAPHY - Sandhills Community College

Web Style Guide: TYPOGRAPHY
on) because they lack subtlety: in most Web browsers these tags make headlines look absurdly large
(H1, H2) or ridiculously small (H4, H5, H6). But the header tags in HTML were not created with
graphic design in mind. Their sole purpose is to designate a hierarchy of headline importance, so that
both human readers and automated search engines can look at a document and easily determine its
information structure. Only incidentally did browser designers create a visual hierarchy for HTML
headers by assigning different type sizes and levels of boldness to each header element.
Cascading style sheets
This division between structural logic and visual logic is on its way to being reconciled through the use
of Cascading Style Sheets (CSS). Style sheets provide control over the exact visual style of headers,
paragraphs, lists, and other page elements. For example, if you prefer H3 headers to be set in 12-point
Arial bold type, you can specify those details in a style sheet. In this way you can retain the logical use
of HTML's structural tags without sacrificing graphic design flexibility.
At this writing, however, the major Web browsers offer inconsistent and incomplete CSS support.
Although both Microsoft Internet Explorer version 3.0 and higher and Netscape Navigator version 4.0
and higher support CSS, their exact implementations of it differ. A most frustrating example of this is
the margin property. Standard HTML headings float far above the paragraphs they describe. With style
sheets authors can designate more suitable margins in a heading style declaration. Yet the Netscape
browser adds the designated amount to the standard margin, whereas Explorer simply adds the margin
defined in the style sheet. The upshot is that until the browsers offer a more consistent implementation
of CSS, only a handful of properties can be used reliably.
http://webstyleguide.com/type/print/type.html (3 of 31)5/17/2005 5:18:39 PM