Indiana University
School of Library and Information Science
Information Design for the Web

Web documents: Structure vs. Appearance

What are style sheets?

According to the W3C:

Style sheets describe how documents are presented on screens, in print, or perhaps how they are pronounced. Style sheets are soon coming to a browser near you, and this page and its links will tell you all there is to know about style sheets.

By attaching style sheets to structured documents on the Web (e.g. HTML), authors and readers can influence the presentation of documents without sacrificing device-independence or adding new HTML tags. Style sheets have been an W3C activity since the consortium was founded and has resulted in the development of CSS. Recently, a Working Group on XSL was launched.

The easiest way to start experimenting with style sheets is to find a browser that supports CSS. Discussions about style sheets are carried out on the www-style@w3.org mailing list and on comp.infosystems.www.authoring.stylesheets.

Why use CSS?

Why not keep content and organizational pages physically separate, and only integrate them when a user visits your page?

The premise behind stylesheets answers these questions.

You write a standard HTML document, marking it as you normally would with body, headers, paragraphs, and the like

Then you write a separate stylesheet that tells the browser how to render your document

You tell it to make the paragraphs in 12-point Times Roman with 1.5-inch margins, and that the headline should be green, 40-point Helvetica Medium with 42-point leading

Now, in the head of your HTML document, you point to the stylesheet, and then upload them both to your server.

Benefits of separating the structure and style of a document

You can have multiple HTML documents pointing at one stylesheet

By changing the sheet, you can effectively change the entire Web site

Also, the stylesheets cascade hierarchically

This means that you can have a number of different stylesheets for, say, different sections of your Web site

One sheet can set the margins of every document sitewide, but other sheets can describe the typography for different sections of your site, or even override the settings of the sheets before them.

Next!

You are here: http://memex.lib.indiana.edu/hrosenba/www/Workshops/CSS/Demo/cssintro2.html
Last updated 3.15.06 - H. Rosenbaum