LIRT News: December 1997

By Billie Peterson, Baylor University

Dear Tech Talk--

I recently heard someone make a reference to "Cascading Style Sheets." I have visions of a waterfall of paper, but I think this actually has something to do with formatting web pages. Can you clarify?

-- Cascading Conundrum

Dear -- CC,

The original intent of HTML code was to provide access to information using hypertext links, across different computer platforms, using a relatively simple mechanism. How the information displayed on the computer screen was not of great importance. However, the widespread use of the web by a variety of organizations for a variety of purposes, has resulted in HTML code being "misused" in attempts to control how web pages look. Additionally, browser developers have incorporated non-standard HTML into their software designs (the "blink" code, for example) in order to address the presentation limitations in standard HTML. These efforts to use HTML to define how the information is presented have resulted in web pages that are sometimes klugey, time-consuming to display, and unreliable in appearance when viewed in different browsers.

In December 1996, the World Wide Web Consortium (W3C) released a set of standards for "Cascading Style Sheets, Level 1" (CSS). The CSS standards enhance HTML by providing a set of rules that describe how the information on one or more pages will be presented. Style sheets are referred to as "cascading" because when multiple style sheets provide conflicting instructions, a predictable order is used to decide which rules of style to apply. One cause of conflicts between multiple style sheets is the fact that both the authors of the web pages and the readers (using their browsers) can control how information is to be presented on the screen. Additionally, when an author uses multiple style sheets on a single page, conflicts may result.

The greatest advantage for using CSS is that once a style sheet is created, it provides the easiest way to apply the same style across a group of web pages. Each web page that will use the same presentation is linked to the appropriate style sheet(s). If changes need to be made in the presentation of those web pages, the author makes the changes on the appropriate style sheet(s), and the changes immediately affect all of the Web pages linked to the revised style sheet(s). Another advantage of the CSS standards is that they provide the author with tools to specify styles such as specific margin sizes, precise paragraph indentations, drop caps, 3-D text, sizes, colors, and types of fonts, specific distances between letters and lines, and other desktop publishing features. If the style sheets are carefully designed, the Web pages using these specialized features won't degrade in visual quality when encountered by browsers that don't support CSS. Without style sheets, web page authors often use HTML code inappropriately or use images to create a specific effect--resulting in pages that display poorly in some browsers or take too long to download.

It's not feasible to address the details of CSS in this column. However, there are some basic concepts that can be conveyed.

CSS can be used in an HTML document in 4 ways:

      1. Link to an external style sheet.
      2. Use the <Style> tag inside the <head> tag to define the style for a specific web page.
      3. Import a style sheet to a specific web page.
      4. Apply a style to a specific "selector" (HTML tag) within a web page.

Style sheets address the following principles:

1. CCS1 specifies 28 properties in these groups: font properties, color and background color properties, text properties, box
properties, and classification properties.

2. Each property has specific values that can be assigned. For example, (font: small helvetica sans-serif).

3. The style is created by making declarations which consist of associating selectors (HTML tags) with specific properties and
values. For example, the declaration H1 { color: blue } could make all information labeled with an <H1> tag display in blue.

4. Many properties use "inheritance", which means that whatever style is defined for the "parent" will be inherited by the
"child". For example, the <Body> tag is the parent of a <P> tag because the <P> tag appears within the <Body> tags. So if font color was declared in the <Body> tag, it would apply to all of the paragraphs on that page.

Cascading Style Sheets, Level 1 is only the first step in defining styles. CSS1 defines screen presentation styles. The W3C is currently working on the development of additional style sheets, including: Aural Cascading Style Sheets, which will customize a page for audio presentation; style sheet extensions for printing Web documents, which will provide control over page breaks and other printing features; and CSS Positioning, which will provide for the exact positioning of HTML elements on a page in 3-dimensions, down to individual pixels.

The CSS standards are in their infancy. However, since the two most popular web browsers, Internet Explorer 3.0+ and Netscape 4.0 support CSS, the use of CSS should increase in popularity. Perhaps the greatest drawback for librarians who want to implement cascading style sheets is the challenge of learning yet another set of codes and standards. There are some CSS authoring tools available, but, like the original HTML editors, these style editors are not as sophisticated as one might want.

However, with a substantial number of libraries moving toward Web-based catalogs and an ever-growing number of instructional activities relying on the Web for delivery, there should be some real rewards and benefits for those librarians willing to learn more about Cascading Style Sheets and incorporate them into future Web-page design for their institutions.

A search in any Internet search engine on the phrase, "Cascading Style Sheets" will yield a tremendous amount of information on this topic. Some resources you might examine first are listed below:

CSS Authoring Tools
<URL: http://www.w3.org/Style/css/#editors>
A list of editors which support the use of CSS, provided by the World Wide Web Consortium.

Cascading Style Sheets: Coming Soon to a Web Page Near You. The Seybold Report on Internet Publishing (June 1997): 3-11.

Cascading Style Sheets FAQ
<URL: http://www.cern.ch/WebOffice/Courses/CSS/CSSFAQ.html>
A Frequently Asked Question site maintained by CERN.

CERN Web Office Online Course on CSS, level 1
<URL: http://www.cern.ch/WebOffice/Courses/CSS/Welcome.html>
A tutorial on CSS provided by CERN.

Guide to Cascading Style Sheets
<URL: http://www.htmlhelp.com/reference/css/>
Provides an understandable overview of style sheets, structures, properties, rules, a tutorial, and a CSS "lint" checker which will
check the syntax and style of your CSS.

Lie, Hakon Wium. Cascading Style Sheets: Designing for the Web. Reading, MA: Addison Wesley Longman, 1997.
At this time there aren't many books available on this topic; however Lie is one of the people who developed the standards for CSS1.

Microsoft's CSS Gallery
<URL: http://www.microsoft.com/truetype/css/gallery/>
See examples of CSS. Remember to use Internet Explorer 3.0 or higher or Netscape 4.0.

Neilson, Jacob. Effective Use of Style Sheets
<URL: http://www.useit.com/alertbox/9707a.html>
A collection of tips for getting the most out CSS.

Rotter, Matt and Charity Kahn. Web Development with 4.0 Browsers, Getting Started With Cascading Style Sheets. C|Net 9/3/97
<URL: http://www.cnet.com/Content/Builder/Authoring/CSS/>
Provides a good overview of CSS, along with some step-by-step instructions for creating them.

Style-o-matic
<URL: http://www.cnet.com/Content/Builder/Authoring/CSS/ss12.html>
Use this interactive page to apply specific styles to text and then see the text displayed using the styles.

W3C Cascading Style Sheets
<URL: http://www.w3.org/Style/css/>
Provides a wealth of information from the organization responsible for the standards.

Web Designer's Guide to Style Sheets
<URL: http://www.mcp.com/hayden/internet/style/table.html>
This page lists various syntax and properties associated with CSS and indicates how well that feature is supported in Internet Explorer and Netscape for both Windows and Macintosh platforms.

As always, send questions and comments to:

Snail Mail:	Tech Talk Billie Peterson Moody Memorial Library P. O. Box 97148 Waco, TX 76798-7148
E-Mail:	petersonb@baylor.edu

LIRT News, December 1997. Volume 20, number 2.
To report problems, please contact the LIRT News Production editor at edwards@ufl.edu

WELCOME BACK ISSUES