Style Sheets Now!

Web style sheets have been around for a number of years, but their power and importance went largely unnoticed since few implementations existed. Web authors, anxious to add creativity to their pages by influencing the presentation, began to use Netscape's proprietary extensions rather than the more powerful style sheets. This was quite natural, since Netscape's proprietary extensions could be seen by a significant portion of Web users, while few would see style sheet enhancements.

Today, more and more browsers are implementing style sheets, opening authors' eyes to unique features that allow influence over presentation while preserving platform independence. The advantages of style sheets became apparent, as did the disadvantages of continually creating more HTML tags for presentation effects.

Netscape's BODY attributes are now widely accepted on the Web, and have become standardized in HTML 3.2. Yet BGCOLOR, TEXT and friends simply do not provide the flexibility of style sheets. Most background images would leave a page unreadable to someone whose display only offered 16 colors; many pages are difficult to read with only 256 colors. With conventional BODY attributes, an author must choose whether the benefits of a background image outweigh the costs; with style sheets, an author can offer a number of different images, in different style sheets, so that the user can choose the "24-bit style sheet" or "8-bit style sheet," depending on how many colors his or her system can display. If no author-supplied style suits the user, he or she can simply ignore the author's style.

Style sheets can make an author's life much easier. While one could use <HR WIDTH="75%" SIZE=5 ALIGN=center> for every horizontal rule, this becomes very cumbersome for the author. With style sheets, one only needs to specify such presentational preferences once, and the style can be applied to an entire site. And if the author decides that WIDTH="50%" would be better, then he or she only needs to change this preference in one place, rather than having to search through hundreds of pages to change the HTML. Not only that, but style sheets also reduce download time when one file contains all the style information.

Style sheets also offer much more flexibility in terms of the presentation effects that they provide. Properties such as color, background, margin, border, and many more can be applied to all elements. With just HTML and its proprietary extensions, one must rely on attributes like BGCOLOR, which are only available for a few elements. Style sheets give the flexibility of applying a style to all paragraphs, or all level-two headings, or all emphasized text.

With style sheets, authors can use the text-indent property to indent text, rather than resorting to ugly kludges like <DD> or <IMG SRC="blank.gif" WIDTH=10 ALT=""> that carry with them many negative side-effects. Margins can be suggested without having to put the entire page in a table. Style sheets also reduce the need for multi-file search and replace; if an author decides to change the indentation of all paragraphs on a site, he or she only has to change one line on a style sheet.

Style sheets represent an enormous step forward for the Web. With the separation of content and presentation between HTML and style sheets, the Web no longer needs to drift away from the strong ideal of platform independence that provided the medium with its initial push of popularity. Authors can finally influence the presentation of documents without leaving pages unreadable to users.

Current Browser Support for CSS

The number of browsers supporting Cascading Style Sheets continues to increase rapidly. Netscape Navigator 4.0 features a large amount of support for CSS1 and CSS Positioning. Microsoft Internet Explorer 3 has partial CSS1 support with a strong level of CSS1 and CSS Positioning implemented in IE4, accompanied by early support for CSS Printing.

Style sheet support on the UNIX platform has long existed with Emacs-W3 and Arena, and the W3C's Amaya browser combines CSS support with a "WYSIWYG" editor for making CSS-enhanced Web pages.

Beyond CSS1

Future extensions to CSS1 are aimed at bringing better support for printing Web pages, styles for speech and braille output, positioning, fonts, and device-independent colors.

CSS Index ~ CSS Structure ~ CSS Properties