Please do not Use CSS Frameworks

Update: It’s become apparent to me that the choice of title for this article can be very misleading before reading the article itself. Please know that I am a huge fan of frameworks and truly support the hard work of CSS framework developers. This article is an opinion piece consisting of my thoughts, and some great responses from readers who feel the complete opposite. Please, read the article, read the comments, and share your opinion, I really appreciate it.

A bit of background information: A couple weeks ago, Blueprint was officially launched. Blueprint is “… a CSS framework, which aims to cut down on your CSS development time. It gives you a solid CSS foundation to build your project on top of, with an easy-to-use grid, sensible typography, and even a style sheet for printing.” As of this writing, Blueprint 0.4 is the most recent version.

The idea behind a framework is to make your life easier by streamlining some of the tedious repetitions we find ourselves going through on each and every project. The JavaScript libraries you’ve come to know and love (or hate) are frameworks which help writing JavaScript become a faster process with less speed bumps when it comes to cross-browser issues. There are many server side programming frameworks (such as CakePHP and CodeIgniter) which help make the process of writing Web applications much more rapid. They are also helpful in that many common functions are included by default. Not having to write these common functions from scratch can really come in handy.

The negative side to code frameworks

At their surface, frameworks seem like a great thing; unfortunately, that’s not the case. A big problem with frameworks is when up and coming developers attach themselves to a framework as opposed to the underlying code itself. The knowledge gained in this case surrounds a specific framework, which severely limits the developer. Beyond that, much of the code in frameworks can be considered bloat. Whether it be in a server side language framework or JavaScript library, there is often a large percentage of code that will never be executed. While not a major issue server side, this can greatly degrade the performance of a client side framework such as a JavaScript library. There are other issues attached to the use of frameworks, but I’d like to be clear in my support of the idea.

Where does Blueprint fit in?

A CSS framework is a different story entirely. To me, CSS can not be framed. While many of the concepts, techniques, and ideas of creating websites with CSS can be repeated many times over, in my opinion, it is impossible to create pre-written documents that will help you in your process. CSS and (X)HTML go hand in hand. (X)HTML is a language semantic in nature, which is difficult to wrap up in the style of a framework. Each and every project is unique in and of itself, right down to the document structure, classes, and ids. A CSS framework passively removes a great majority of semantic value from the markup of a document and, in my opinion, should be avoided. This lack of semantic value works against a big part of what Web Standards are all about; creating documents with rich semantic value.

On the other side of things, there are many people who argue that taking semantics to this level when speaking about HTML is superfluous. It’s not something I’ve got a strong standing opinion behind, but I’ll admit it is mildly bothersome. Call me a semantics dork, but it’s just an opinion of mine.

Further, the problem of ‘learning the framework’ would run rampant with a CSS framework. CSS should be well understood from the ground up, as should any language. Skipping this vital step could very well hurt you in the long run. A CSS framework will only take you so far, without a deep understanding, you’ll be stuck after you’ve created the basic site structure. It’s important to have the knowledge to many any adjustment needed when you’re faced with a CSS problem.

What I do reuse

I’ve written before about my templating and theming process and included my opinion about it helping me work faster, but what I spoke of was not frameworking. I do think it helps to have the folder structure I use and some empty CSS & (X)HTML files in the right place before I begin. The actual code in these files, however, is very minimal. The CSS files themselves are empty, simply to cut out the step of my creating them each time a project gets started. As far as any markup goes, the only thing included by default is a very basic document structure including a proper DOCTYPE, basic structural elements (html, head, title, and body), and style sheet inclusion. That’s it.

I have, however, recently started using Eric Meyer’s Reset Reloaded CSS by default when I begin projects (as will be the case with a redesign of this site). Having a method to globally reset all elements in an effort to establish a base from which to build makes sense to me, and Mr. Meyer’s expertise is well applied here.

If employing a reset stylesheet is considered using a framework, I’ve got to re-assess the definition of a framework.

In conclusion

I don’t think mean to say there will ever be a place for frameworks when it comes to CSS. I just hope they’re used properly. Since the launch of Blueprint, there have been some spin off pseudo-frameworks such as Tripoli which claims to be a “… generic CSS standard for HTML rendering. By resetting and rebuilding browser standards, Tripoli forms a stable, cross-browser rendering foundation for your web projects.” While the site documentation attempts to explain what sets it apart from other frameworks such as Blueprint, I can’t see how such a large foundation to work from could be of much use when it comes to putting it in actual production. For me personally, each project I work on is too unique and requires a higher level of attention.

I give the authors of CSS frameworks credit for making an idea a reality, but I hope the use of CSS frameworks is limited to testing environments and projects that can truly benefit from them, including when you’re under the gun as far as turn-around time is concerned. I don’t mean to step on any toes or anything, it is just my personal opinion — I’d love to hear yours.

I realize the title to this post was a bit sensationalist, but please take the article for what it reads, not the title I gave it.