| home / programming / typography / 1 | [previous] |
|
|
CSS syntax Style sheets are made of rules. The code below is a css rule that tells a browser that any text contained within <H1></H1> tags should be colored purple.
A css rule is made up of a selector and a declaration.
The selector of a rule is the HTML tag that will be affected by the style rules. In this example, the selector is an html tag that defines the appearance of a heading (on the previous page, the selector was the assigned name of a style). Any html tag can be a selector—B (bold), P (paragraph content), table (table content).
The declaration
of a rule is the code that defines what the style will be. The declaration in
the example below is { color: purple }. The first
part of the declaration is is the property, and the second part is
the value.

css is a great way to control the typography in your web sites. Unfortunately, web browsers have been very inconsistent, sloppy, and downright terrible in their support of official css standardized code. Various browsers display the same code in different ways or sometimes just ignore the css instructions, which often results in displaying unpredictable and incorrect versions of a web page.
However, the basic css typographic controls seem to work well in all of the most popular browsers, so plan to create style sheets that specify a font or font family, font style (normal, italic, or oblique), line height (the horizontal space between lines), weight (normal or bold), and font color. These are the same attributes that are provided in the Dreamweaver Style Definition window, shown on the opposite page.
Writing css code to attach a style sheet to an html document is pretty easy (see the previous page), but it’s even easier when you use a web-authoring software program. In Dreamweaver it’s as easy as clicking a button (below), then selecting an HTML file to attach to.

You can manually attach a style sheet to a web page. Make sure you name the style sheet with an extension of .css (workshop.css, for example).
|

The LINK REL line of code instructs the browser
to look for a style sheet named “workshop.css.”

With new thoughts in your mind, take a closer look at typography on the web:
|

Decide whether the concept suggested below should never be applied, or can perhaps be applied sometimes. “Never” means just that—it is not an option. “Sometimes” means you can sometimes get away with it, but you must be conscious; you’ll probably have to compensate for the technique in some way, but the design effect can be worth it. If you choose “Sometimes,” explain what you would do to make the suggested effect most readable or legible.

Excerpted from The Non-Designer’s Web Book, Third Edition by Robin Williams and John Tollett. ISBN 0321303377, Copyright © 2006. Used with the permission of Pearson Education, Inc. and Peachpit.
| home / programming / typography / 1 | [previous] |
Created: March 27, 2003
Revised: December 5, 2005
URL: http://webreference.com/programming/typography/1