Talk to me about anything. If you’d like to work with me, or
even if you just need a hug, I’ll get back to you shortly.

Please enter your name

Please enter a valid e-mail

It's cold!

Say something!

Are CSS Frameworks Really Worth Using?

I’ve witnessed the beauty of frameworks for languages like PHP such as CakePHP, and for Ruby such as Ruby on Rails, not to mention the myriad of great javascript libraries that are out there. I see the potential for making life a lot easier by using these frameworks. They prevent you from having to reinvent the wheel, and can really speed up your production. The difference between these and CSS frameworks such as Blueprint is that they impact how the site functions, and not really how it appears to the user (I’m not including js libraries in this statement). So to me, the idea of a CSS framework seems like you’d be producing some stale designs.

Don’t get me wrong, I love reset style sheets. Since the main purpose of a reset style sheet is to create uniform styles across all browsers, it doesn’t really create the same effect that I am debating on this post. Every browser likes to do everything a little different, whether it’s a thicker border here for this element, or a smaller padding there, the list is huge. I’ve already talked about it once on a previous post CSS Navigation Rollovers With Dropdowns, but the one that I like to use can be found here.

So, a normal CSS framework can give you all kinds of great default setups like typography, layouts, and forms etc. Maybe for a beginner having these in place already could become really handy, but every time I do a new design I definitely challenge myself to come up with a way to bring it to life with CSS exactly the way I created it in Photoshop. I like to think it helps me keep my brain sharp, so I don’t end up coding tabled layouts with Times New Roman and clipart in my old age. When I begin to slice and code a design, I have to put some planning into it and come up with a very customized solution to get everything to look the way I’d like it to.

Since CSS is purely a front-end language, I would say that using a framework just seems damn silly. As a web developer and designer, you should be challenging yourself to accomplish something new on every step of the process from start to finish of a project, or else you will never grow as a skilled professional. Even if you do end up using the frameworks, and then customizing it slightly to your own desires, you will end up with a lot of code that you are not using which every little item that gets added to a load time counts for something.

Maybe I’m looking at this from too critical of an angle. Some might say I’m being ignorant, or not to knock it until I try it. I’d like everyone’s opinion on this one, so please discuss it in the comments.

  1. I’ve been feeling the same as you about css frameworks. Admitedly I’ve yet to work with any, but when I look at the code of most of them they just strike me as having a lot of excess code. I can see where if you’re new to working with css they could be helpful, but after years developing css I’m having a hard time seeing how they’re going to cut down my development time.

    It doesn’t take me all that long to develop a template from a PSD in the first place and like you I enjoy trying new things with each site to challenge myself, improve my skills, and just to see what I can come up with.

    In all fairness to the frameworks I would like to give a few a try. Like I said I really haven’t used any and would prefer to reserve judgment until after I have. Still, I’m having a hard time seeing how they’d be useful to me.

  2. I totally agree with you, and I think that they add unnecessary overhead to the page processing.

  3. Tom says:

    I definitely agree with you on this one…I am also guilty of never even bothering to try it but I honestly do not see the point. CSS frameworks kind of remind me of those myspace layout sites, they’re good if you don’t want to learn how to do it on your own, but if you know how to manipulate everything then they really serve no purpose.

  4. Heather says:

    I can see the benefits for someone just diving into coding a site; maybe they’re good at design but not so great at creating the CSS for it but…

    “you will end up with a lot of code that you are not using”

    I think that is one of the big negatives about using them. I tend to beat my CSS down into as small and orderly a file as I can, so I hate having anything just lying around thats not getting used in my design. This is a great discussion because I have downloaded some to see if it increased my workflow, but I end up going back to what I know best, and trying to approach each new design with a fresh take on how it can be coded.

  5. Joren Rapini says:

    It looks like the majority of us are in agreement, they just seem to be too bloated and structured to be of any use. Maybe they would be good for someone just starting out, but I know I sure learned quick by taking apart what other people did on their websites with Firebug.

    When using a reset style sheet, it’s always a good idea to delete out any unused elements that it defines when you are all finished with the website to clear out some junk.

  6. Neal G says:

    I think reset frameworks can be useful in some instances. Really the only framework I find useful is my own adapted framework. I think it’s best to just create your own css+html template file and stick with it. Each site I create, I tweak it slightly each time and it becomes better and better.

  7. sinisasasic says:

    Well, perhaps the best solution is to build your *own* CSS framework?

  8. Peter says:

    If 960 is a CSS framework, than yes, I do think they can be useful. But I’m a developer (Java, PHP, etc.), not a designer, I just really like how easily I can layout a site. If afterwards, I get a designer involved, he can keep using it, or just get rid of it, it’s just a bunch of div’s after all. Maybe it’s something a professional can do without the need for a framework, but I sure like the help.

  9. Joren Rapini says:

    I would still have to disagree with the opinion of even creating your own CSS framework being useful. Then again, it depends on how you design websites. Myself, every design I do has such a custom and unique layout compared to a previous work, that using a standard CSS framework would just not be plausible, even if it was my own. Like I said, this is only the way that I prefer to do things, obviously to each his own.

    Now Peter’s situation I can understand. If you aren’t really a designer, then a framework could come in handy in making for a quick layout.

  10. Nick says:

    Spot on mate. :)

  11. Soh Tanaka says:

    No sir I don’t like em.

  12. Rafal Hirsz says:

    I totally agree with you. They not only add unnecessary code to your page, they even can limit your creativity. I recently experienced such thing while designing a 960-based layout. Everything had gone well before I needed to write the CSS. The “10px offset” feature made me unable to finish and I needed to write the layout from scratch. Perhaps only 960 has this issue, I didn’t use any other framework.

    I’m not saying that CSS frameworks are bad. They do their job very good for simple layouts, but when things go complicated, they will IMO only make your job harder.

  13. David Hucklesby says:

    @sinisasasic wrote:

    “Well, perhaps the best solution is to build your *own* CSS framework?”

    Last year I did just that. Looking at a lot of existing frameworks gave me some good ideas, but, like you suggested, most frameworks are “overkill.” The effort to roll my own was worth it, I think.

  14. Adam says:

    I ABSOLUTELY AGREE! I was going to write about this (before my blog got destroyed) and it just seems pointless.

    First of all, CSS isn’t even really a LANGUAGE. It’s more like a module of HTML…I mean you can’t be a CSS expert in terms of knowing the language, it’s not a difficult one to master. And that’s really it for me…CSS isn’t big enough, robust enough…there’s only so much you can do with CSS already, so why the need for an entire framework around it? Really I can only see it as a gateway for beginning web designers.

  15. Mike Smick says:

    After reading this post a couple times, I’m still not getting it. Blueprint impacts how a site functions? How so? I’ve never seen any functional limits the framework causes. Because it’s malleable text file(s). You have to know CSS to do much with it, but you’d also have to know CSS to make a layout from scratch.
    Blueprint’s own help files explain that you can use the grid and make boxes and be able to count on those boxes working at widths specified across browsers reasonably well. It outlines the reasons why it is useful.

    Because browsers CSS can’t be trusted or is just illogical, blueprint seeks to simplify some of it. And it also creates a shortcut to a finished layout with plenty of box position options for you. As one grows as a designer, they learn how limitations and constraints are more helpful than “anything goes projects” because design has a deadline and in the grand scheme of things, a designed site gets stale no matter what you do, so spend time keeping it fresh by adding new content. Certain designs become very familiar to people and they have a fondness and affection for them for various reasons. So how can you even tell people that it’s “stale” or “rigid” and therefore no good.

    Just to justify blueprint or another framework, let’s just say I decide to view your site in IE 6.0 just to check, I notice the main content area is shifted about 3 pixels left from the header and footer. Now had you used blueprint, possibly that wouldn’t have happened. Since you coded yourself, quite well I must say, but unfortunately you have a certain unfixed ‘bug’ causing this shift. Now that may or not be true, but I know that for many sites, things similar to that shifting pop up all the time. But suddenly when I started using blueprint, I’m seeing less of them. Blueprint didnt’ improve my designs, and I don’t think it ever claimed to. My designs were always as good or bad as they always have been, but if I spend less time on certain parts of them, the free time is useful to me and the site is just as equipped, modern and bulletproof.

    People don’t design sites in all the same way. So if you think blueprint is going to limit or cause a design to be stale, how could it if you designed it on paper, then moved to an image editor for creation, then tiled out and finally fit blueprint to it. In that respect, blueprint came in last and served a great purpose. If I had blueprint in mind at the beginning, I might use that to keep my columns to certain widths I know blueprint is initially set, but I’d likely do something similar anyway because it’s comfortable enough on screen and common. So my own knowledge and personal limits affected the design much more than blueprint.

  16. Joren Rapini says:

    @Mike Smick

    Phew, I wasn’t expecting anyone to spend the time to deliver that much of a response. I commend you for that! And in my defense, I’m not sure where you are seeing this content shift in IE6, it looks fine from all of my PCs on IE6 and 7! I even ran this through browser shots, just to make sure there wasn’t an issue with the IE6 application that I use, and the only shot that came up screwy in the way that you describe was IE5.5; which according to Google Analytics, I’ve never even had a user with that browser visit my website, so I am not going to take the time to design for it. It is possible that frameworks have tested with IE 5.5 as you say, but that definitely will never be a selling point for me.

    I’m still going to have to disagree with you Mike, although in your own ways frameworks obviously work well for you. Every one has a very different approach to their design process that works best for them.

    I think you misread my initial paragraph when you are speaking about function – no, other than having extra code left over, CSS frameworks do not affect the functionality of a website. I was describing backend frameworks as impacting the functionality of a website, not CSS frameworks. I may have just used some bad wording up there.

    When I design and then code a website, typically they are so off the standard that I would spend just as much time adapting a framework to them than I would starting from scratch. Finding new and creative ways to lay out a web page is one of my favorite parts of my job. This is obviously a personal objectification on the matter, and it probably greatly influences my opinion. Saying that browsers cannot be trusted or are illogical is not quite correct either. Different browsers *cough* IE *cough* use different standards, so as long as you are well versed in those wacky standards, than they should not ‘deceive’ you. I can honestly say that for the one year I have done this work for a living full time, I have perfected IE6+ quirks.

    There is a quality to using a common structure in making an interface that is intuitive to the user, this is true. I feel, however, that a great designer can accomplish this inherit intuitiveness while still coming up with their own custom and unique solution in just as timely of a manner.

  17. Tim Gittos says:

    I recently used 960gs for my current WordPress theme, thinking that it would make things easier and less stressful because I’m more of a server side programmer than a front end person. I’ve found the process hasn’t been less stressful at all, and that the default reset included reset things I didn’t want reset, and if you want to deviate from the grid in a small way, you’re in for a world of pain.

    As it currently stands, my blog looks passable in Firefox and Chrome at certain resolutions, fails utterly in any Windows browser and I’ve not been brave enough to test Safari and Opera. When I have more time, I shall be redesigning, taking out 960gs and probably just rolling my own code.

    A part of my dislike for CSS frameworks is also that I don’t understand web designers who want things to look identical in all browsers. Different browsers at different resolutions on different colour depth monitors will display differently. There are far too many variables to get a 100% consistent look, and the quest for one is rather foolish. It’s ok if your site looks a little different in IE than it does in Firefox (referencing Mike Smick’s pointed out 3px shift of content).

    A web browser is a fluid medium, and we need to recognise that, and make allowances. Design pages to not depend on pixel-perfect layout, design pages that can be squished and squashed into different resolutions. Make it so that, as long as margins and padding is consistent, it doesn’t matter if it’s 2px or 5px.

  18. Jay says:

    Don’t most people use a CSS framework of some kind? Who codes a site from scratch every time?

    I tend to reuse my stylesheets from other projects as a starting point for each website I build. While not really a strict framework it seems like the most efficient way of building a site to me.

  19. Mike Smick says:

    You’re right, I should have read the beginning of your posting better. On the web, I tend to skim. I see what you meant there.

    The IE6 i used to look at your site is from “MultipleIEs” from tredosoft. It certainly could be flawed and mimicking something from IE5.5 within the 6.0 version.

    The most I can do is respond to your initial headline question: “Are CSS Frameworks Really Worth Using?”
    Considering the way the question is posed, the answer is a resounding Yes. And you can confirm that by running through peoples’ comments on blueprint or another framework. Anyone who gives it praise, touts it’s value for them gives you the answer. There is worth there for them.

    I would suggest that your actual argument is slightly different. What I believe your question is is “Does a framework impose something a designer that results in stale repetitive designs?” Now that’s an interesting question that you could really work with through examples.

    I can’t argue with your opinion on frameworks, but I bet a design challenge could be set up to put yours or some sort of ‘organic’ method up against using the framework. And I believe the same result could be achieved. That is to say, a developer using blueprint wouldn’t demonstrate any limitation in the final result. I also believe that the result could be achieved faster. Now faster doesn’t mean that the designer/developer “grew.” But projects completed can earn money. And if a designer and client are happy with the result, there’s also growth in that respect. Also, If you can measure efficiency of a tool, you can justify the technology or method beyond mere opinion. But if you do all that, and you’re not happy because of the framework, then sure, it’s not worth it. I mean we should feel like our work has authenticity, no doubt about that.

    It’s possibly to argue that using a framework could allow for the recognition of a common flaw that could be fixed quickly with a global replace. If you have created 4 wordpress templates using blueprint and one day you find that you should have done X, but failed to initially. You might save time fixing all four sites if you know how you used an aspect of the framework. This is a maybe of course. But you also have to consider the value of it in a collaborative sense. Because if 2 people know blueprint, they can count on the other to follow a certain rule or syntax. They can read code with expectations. I think if I’m experienced enough with blueprint, I could look at another’s blueprint site and fix their problems faster. Because I know what’s going on and why. I also know that blueprint has a bug tracker with ongoing submissions. My original CSS won’t have a bug tracker, so I may be in more trouble there.

    Designer / Developers are all different. So judging the worth of tools is pretty difficult. I like to do all sorts of design and writing and implementation. So some tools are better for me because I divide my time in my own way.

    I have to argue completely with your last paragraph. “Since CSS is purely a front-end language, I would say that using a framework just seems damn silly. As a web developer and designer, you should be challenging yourself to accomplish something new on every step of the process from start to finish of a project, or else you will never grow as a skilled professional. Even if you do end up using the frameworks, and then customizing it slightly to your own desires, you will end up with a lot of code that you are not using which every little item that gets added to a load time counts for something.”

    I simply can’t agree that using something already developed and proven to work in many places is silly. Sure it’s rewarding to do something on your own, no question. Silliness to me, is the way I have to type margin:0 auto; in order to center a div. Dealing with illogical syntax or a myriad of browser issues don’t really feel like growth. Now I know plenty of CSS, but that in my view isn’t as much an example of me having grown as a designer as just dealing with necessity. I’d love to dump that requirement right now for something more logical. But I don’t know how.

    CSS being a front-end language is still code is representing something visual. In code, if certain things are a given, like your reset file, or your columns. Kill off extraneous lines, set your typeface defaults and blammo, your framework serves you. When I can ignore something, because I can count on it, I am very happy. When an issue is a moving target, I’m not happy, because I’m not designing, I’m debugging.

    Blueprint comes with a compressing script in ruby, there are people filling out bugs all the time, things you might not catch until later. I mean you are learning from others work in that sense. So it’s a good thing.

    This will be my strongest point I think. To me, design is about control. If you don’t have control, you aren’t really designing, you’re just getting lucky. (luck is ok too though) If a framework gives you control, you’re able to design with it effectively, it’s a useful development tool. If in your opinion a framework takes away your control, then you’d see it as not worth it, no doubt. Whatever level somebody is at in web technology, if they are controlling something through the framework better and creating what they like, anything said about staleness, repetition is valid criticism, but not invalidating the worth of the tool for them.

    I’ve enjoyed commenting here. It’s been a fun exercise trying to develop my opinions about this and I’m happy you responded earlier. I also think your writing is good and your sites are very well done. I hope my long comment is somewhat valuable and maybe opens up the dialogue on this.

  20. Joren, I think there is definitely a specific audience for CSS frameworks. I just recently posted my thoughts on CSS frameworks if you’re interested:

  21. Nouman Saleem says:

    I’m using blueprint for a clients site and it is 100% worth the learning curve. Also to take note, the total size of all CSS files is less than that of this blog which makes me wonder where you guys see the wrong.

  22. Joren Rapini says:

    @Jay, I discussed reasons throughout this post on why I do what I do, and many others have commented along the same lines, so there is the answer to your question.

    @Mike, thank you very much for taking the time to write out your opinions so fully on my website. I’m glad this post has elicited that kind of discussion! I think in your last comment, you wrote more than I did on my post, haha. You are right, the actual content of my post strayed from the question, but my title was meant to be the question and the content be the answer I suppose, or in this case my opinion on the matter.

    A very good point you raise with my paragraph that included “using a framework just seems damn silly”. If I go any further in discussing the topic, I’m probably going to start slapping myself, so I’ll leave it there. Thanks again for dedicating your time to this post, and for your praises!

    Thanks as well to all those who are posting and I have not responded to. I am reading everything!

  23. Chase Weible says:

    excellent post. it’s so informative. i’d like to share this to my friends.

  24. [...] Joren Weblog » Are CSS Frameworks Really Worth Using? To CSS Framework, or not to CSS Framework. (tags: design web css framework frameworks) [...]

  25. [...] post is an elaboration of a comment that I left on a post about CSS frameworks. I agree wholeheartedly with Joren’s position on CSS frameworks after having used 960gs for [...]

Leave a Reply to David Hucklesby

Click here to cancel reply.

This site is protected by Comment SPAM Wiper.