When Should You Use a CSS Framework?

The web has been abuzz lately about CSS frameworks, such as 960gs and Blueprint. There have been tutorials springing up right and left, and articles discussing the merits and problems with them.

What is a CSS framework? Wikipedia defines it as:

A CSS framework is a pre-prepared library that is meant to allow for easier, more standards-compliant styling of a webpage using the Cascading Style Sheets language. Just like programming and scripting language libraries, CSS frameworks (usually packaged as external .css sheets inserted into the header) package a number of ready-made options for designing and outlaying a webpage.

There is plenty of debate over whether it’s a good idea to use frameworks or not. Many complain that they aren’t semantically correct, since they often work by using predefined classes, such as “grid_12,” to create the visual page structure. I admit to having been skeptical of them until recently, but I’m starting to see cases where they may be useful.

CSS frameworks provide a way to put together the basic structure of a design quickly and easy. They provide a great starting point to easily create grid-based designs especially. See NETTUTS for a good example.

Many well-designed sites use CSS frameworks. WooThemes, for example. Browse around the site for awhile, and see if you can guess what my theory for the best time to use a grid framework is.

Back already?

I think that the best time to use a CSS framework is when you are building a grid-based design, and even more so when the content structure changes from page to page. WooThemes is a good example of this.

WooThemes Homepage

WooThemes Homepage (3 Columns)

WooThemes "Our Themes" Page (2 Columns)

WooThemes "Our Themes" Page (2 Columns)

WooThemes "Club" Page (Two differently sized columns)

WooThemes "Club" Page (Two differently sized columns)

It would be a lot of work to account for three different possible column arrangements the “hard way.” Using the 960gs framework, it’s a lot simpler. Everything’s already in the framework stylesheet, so you can just edit the (X)HTML and use different classes.

My stance on CSS frameworks has changed considerably in the past few months. They have their place in web design, they’re just not for every project. If you’re dealing with grids, though, they’re definitely worth a look.

  • http://www.brenno.com.br Brenno F. Santiago

    Great post!!