Cascading Style Sheet

The future in web design definitely lies with Cascading Style Sheet (CSS). A tool for drafting style sheets should be part of every toolkit, but it will become increasingly important as we move into the fifth generation of browsers that can handle style sheet layout consistently and smoothly. The latest information can be found on the W3's Style section.

CSS saves tons of work in changing text formating. It makes for fast-loading that conform to W3 standards now and in the future. Just adding a few lines of code in the web page header can save the work of wrapping text in font tags:

<style type="text/css"><!--
body, p, td, li {font-family: Verdana, Arial, san-serif; font-size: 14px;} --></style>

Now all text will appear as Verdana 14px if the font is on the user's computer. Otherwise, the browser will use Arial or san-serif.

Check out this series of articles about implementing CSS in the real world: Fear of Style SheetsPart One and Part Two and Part 3 or Give Me Pixels or Give Me Death and Dao of Web Design.

If you'd like to see CSS's full potential, check out ZenGarden: multiple designers take turns in reshaping a sample page. Mezzoblue and Dave Shea, the idea man behind the initiative, provide a CSS Resource Guide.

CSS Editors

For the professional stylist: Bradsoft's TopStyle is a shareware product brought to you by the original author as Macromedia's HomeSite, with which it integrates smoothly. A stripped-down, lite version is incorporated in HomeSite and is available for downloading free. This freeware version can get you a feel for working with CSS. TopStyle can also double as an editor for HTML, XHTML and XML.

Close second: StyleMaster has versions for Mac and Windows. The House of Style site also contains tutorials, examples and other programming aids.

Others: Danere Software Innovations' StyleMaker with a WYSIWYG (what you see is what you get) interface, point-and-drag text positioner, instant previewing and site-wide Style Sheet application. You can even get by with just a text editor since CSS are just ASCII files.

Some high-end HTML editors, like Microsoft's FrontPage and MacroMedia's Dreamweaver, have CSS editing features incorporated into the application. FrontPage's features are pretty lame, but it's better than nothing.

HTML-Kit will automatically upgrade a pre-existing web page to style sheets with the press of a button. Just one of the many virtues of this robust editor-cum-validator. But the credit should really go to HTMLTidy, which is the underlying utility that makes it all possible. Also Style Studio ::: Morphon CSS-Editor ::: UCWARE's JustStyle ::: MozDev CaScadeS for Mozilla Composer.

Guidelines

Resources

There may be some duplication between this list and the material above. I will gradually weed out the repeats and add more.