CSS Primer: Why CSS?

After writing about my experiences in changing my site from table-based to CSS-and-DIV-based for the layout, I've found it to be one of the most-read articles and have frequently discussed it with readers. Therefore, I decided to start a little series that will make up a CSS Primer.

First, I want to talk a little about what CSS is. CSS is short for Cascading Style Sheet, and what they do is allow you to assign specific styles to different HTML elements, such as borders, backgrounds, and fonts styles. They've been around for nearly a decade now, and every major web browser supports them.

Take note of the cascading portion of the CSS name. What this means is that all elements within the one specified will get the same style properties. For example, without getting too technical yet, if I set a background color for the body of my document, that background will be applied to all elements within the body of the page, unless a different style is explicitly defined for that element.

Second, I'd like to look at why we want to use CSS for site design and layout. The major intent of CSS is to separate the content of a page from the design of a page. If we combine the content and design into a single entity, this means that we need to maintain them together. Separating the two allows us to worry about them individually. This is very useful for site redesigns, because we can keep the same page content, and simply change the the CSS to give the site a different appearance.

Using CSS also allows us to apply the same style to several pages more easily. Because the CSS can be kept in an entirely separate document, we can then refer to this document from several different web pages. Without this ability, this means we would have to update the appearance of each of our pages individually (which is a major pain for large sites).

One other advantage of using CSS is that it makes our web pages easier to read because they are no longer littered with style information (or extraneous table information, for that matter). Anyone who's spent a significant amount of time programming or editing code can appreciate the appeal of clean and easy-to-read code.

Now that we've discussed some of the basic advantages of using CSS for you site design and layout, next time I'll cover the basics of implementing CSS, and continue building from there.