Treading Lightly with CSS Frameworks


Are Frameworks the way?

There has been a bit of discussion of late with respect to CSS frameworks, Jeff Croft floated it on a . There has been some attention on the recently introduced Blueprint CSS framework. Blueprint presents an easy to use and customisable grid system, with allowances for a full CSS reset and relative font sizes. All good things to have. However can we take this just a little to far. Clearly server side systems as pointed out by Jonathan Christopher can and do take great advantage of frameworks to enhance and speed up the development cycle. But do we really need a framework in the developmental sense, is it the best way to approach Front End development.

I can see the point of aspects of the Blueprint CSS framework being of a benefit. Eric Meyer’s Reset Reloaded, separation of the structural frame of the css, from the typography. However it is the grid section that I just can’t see the point of. Okay the YUI grid is interesting and has some nice aspects. Maybe it’s just the methods I apply that is stopping me seeing the need for such a method.


I use a series of CSS templates along with XHTML files as a basis for any site design. These have in them all the common elements, of various types (vcard, vevent, vreview and the like), plus other standard presentation objects. A few JavaScript libraries, unobtrusive Flash implementations and menu system library are all included in these templates. They are bit like the ultimate snippets code pile. As I build a site I just remove the elements I don’t require. They have all been tested to work together so an average there isn’t any real problems.

Okay it’s not the most perfect situation, but from a rapid development view it does work. It leverages the degree of reusability of the code. Yes, that is right, I don’t hand code every site from scratch, I make the most of previously styled objects and presentation wrappers and just re-skin them as required. I have always been of the opinion that is what CSS is for. Maybe I am using a framework in a loose sense of the word, but I tend to think of it as a templating system.

Is this a good thing

However this segmentation of the code base into various mini files, has benefits and drawbacks too. On the whole they are handy to work with, but very can add some real load to a server with the extra http request per page view. So how far do you go with the segmentation. You can break it up into :

  • structure
  • typography
  • design presentation (images, backgrounds, borders)

Or do you go further and take it the next step.

  • structure
  • typography
  • design presentation
  • specialist sections (eg menus, navigation)
  • print
  • mobile web
  • tweaks (mostly old style browser hacks)
  • browser specific workarounds (via IE conditional statement)

What about removing the white space as well (yeah maybe thats a little over the top).Do you think it’s worth compressing a CSS file like we are seeing with JavaScript libraries?

Personally the best way to approach any technique is to consider it’s elements and how well they can be applied to the design methodology and procedures that you have in place.

What do you do? Do you take techniques such as this and just adopt them, because “they” know better than you do. Or do you question the wisdom and only take what you need.

Technorati Tags: , , , , ,