CSS Frameworks have been around for a while now, and while there are many detractors, the benefits they provide make them an attractive option for speeding up development time, as well as simplifying complex layouts.
After pouring through this Top 12 list of CSS Frameworks, the two that stand out the most are Blueprint and YUI Grids. I’ve boiled it down to these two because of their wide spread popularity, and there are one or two things about each that I really like. Deciding between the two though, will be a tougher pick.
YUI has quite a few things going for it. The documentation is superb, relative to other frameworks, and they lay out their reasons for structuring their system the way they did. They combat the non-semantic argument by claiming their grid system is a microformat which attempts to define the structure.
The biggest advantage YUI offers is em based layouts. I’ve long subscribed to sizing in ems over pixels and YUI would help continue that.
Blueprint too, has quite a few things going for it, but the Blueprint Grid CSS Generator might be the slickest tool for setting up a flexible grid system that fits your current project. This tool will create a new version of the grid.css file that replaces the standard file downloaded with the framework. It also creates a grid.png file that can be used in Photoshop comps to help ensure everything lines up properly.
While both have advantages, they each have shortcomings that the other just happens to overcome. I haven’t yet found a Photoshop template for use with YUI. That may be because it doesn’t use set columns for layout, but some kind of template, or directions for newbies on how best to create one would help.
Blueprint uses pixels to set sizes for layout. This makes elasticity not happening.
None yet. Daily, it seems I vacillate between the two.
Do you use a CSS framework? Which one, and why?
UPDATE: After trying out both on a recent project, I’ve gone with YUI for the most part, but have swiped a couple of the css files that come with Blueprint, namely the forms.css and typography.css. These give me a nice start on forms and fonts as well as extra control.
UPDATE #2: Frustration with YUI’s stylesheets not being self hosted has made me rethink my choice. Since I’m already using some of Bluprint’s elements, I’ve decided to just use it outright.
UPDATE #3: After discovering Justin Tadlock’s Hybrid framework for WordPress, I’ve pretty much given up on grids all together. Hybrid doesn’t really replace a grid, but it turns out most of my layouts are not complex enough to warrant a grid, and it ends up adding unused elements and needless complexity.