Cascading Style Sheets (CSS)

Long gone are the days of HTML littered with formatting tags, line breaks and shim images. The introduction of CSS allows designers and developers to separate the content from the style. Not only does this allow smaller more efficient code, (as the stylesheet is only called once, but it's style properties can be used an unlimited number of times throughout the HTML markup) but also, the ability to transform a site's design simply by calling a new stylesheet to the page.

This site shows examples of how this can be done, every HTML page remains the same, but by calling a new stylesheet in the head of the document, the page can be transformed into a new colour scheme, design, or even a completely new layout if you're using a tableless CSS controlled design (like this site).

Why CSS?

Let's say you've created your website, 50 pages or so of content and it's up on your site and ready for testing. You decide you don't really like the font you've used for headings on the pages, you'd like to change those headings from font A to font B. If you wrote your site without CSS you're in trouble, your next steps would most likely be;

• Open all the affected pages in your HTML Editor
• Copy and paste the new font tag over the old tag, for every single heading
• Save each and every page
• Upload every page where a change has been made
• Test every page affected to ensure you've made no errors

Sounds like fun? No.

Those of you who've used CSS will have a far more effective method of dealing with this scenario. You make one change to the stylesheet, upload and if it works on one page it'll work on them all, simple as that.

CSS really does remove an awful lot of monotony from a web designers work. In the example above, you might make three different font changes to the headings just to see which one you prefer best, it's so easy to manipulate you'll be able to spend more time tweaking your site to look perfect, rather than making labourious changes to your HTML.