

Blueprint: A CSS Framework - teej
http://blueprintcss.org/?css

======
aditya
My only issue with blueprint and compass was that it seems overly complicated
for what I'm trying to do so far. I'm not a CSS guru so maybe I'm missing the
point but is there a good reason to use a CSS framework on medium sized
projects?

Or, rather, is there something inherently nice about using grids for
translating design to markup? It just seems like the framework adds a lot of
code and styles that you're never going to need or use on small-to-medium
sized projects. Thoughts?

~~~
vaporstun
I like to use it for the simple fact that it automatically overrides all of
the default styles. So no more Times New Roman, and all of the header tags
look decent without much modification.

That way, I can usually use most of their defaults and can spend more time
coding.

So it is really nice for me on small projects where I just want it to look
decent without much effort.

------
thinkzig
This looks cool. Is anyone using this? Mind sharing your thoughts? I'm getting
ready to do a site redesign and this might be right up my alley.

~~~
znbailey
We use it where I work and the designers like it a lot. It works very well to
build cross-browser layouts in a very quick and simple manner and has
drastically reduced the amount of time it takes them to cut PSDs into raw
XHTML/CSS.

One downside you will quickly notice is your markup becomes much less semantic
and a lot more cluttered with CSS classes. This is simply by virtue of how all
"grid" CSS frameworks like this work - they set up a ton of generic styles
that are impossible to be symanticized. With blueprint you start to see a lot
of classes that look like "span-XX last" or "push-XX" or "pull-XX".

There are a number of ways to get around this, however. The first is a tool
that comes with blueprint that lets you set up a yml configuration which maps
semantic ids to these generic CSS classes. For instance you can say "#footer
=> span-24 last". This will then generate the CSS in a semantic manner so you
can continue using id references in your XHTML.

The second way, and this is the approach that I would highly recommend, is to
go ahead and use some sort of CSS metalanguage/compilation tool such as SASS
(Syntactically Awesome Stylesheets -
<http://haml.hamptoncatlin.com/docs/rdoc/classes/Sass.html>). Chris Eppstein
has done a fantastic job with the Compass CSS Framework
(<http://wiki.github.com/chriseppstein/compass>) which builds on top of SASS,
which allows you to do really amazing things with CSS.

The compass framework he has built allows you to do things like define CSS
constants (colors, font sizes, etc), perform unit arithmetic, as well as
define abstract classes or groups of properties called "mixins" which allow
you to abstract out a lot of your repetitive CSS properties. It is also a
whitespace sensitive DML which makes the highly nested nature of CSS selectors
a breeze to work with. It also already comes with modules for blueprint and
other grid frameworks!

I would check out his talk about it here if this sounds interesting to you:

<http://pivotallabs.com/talks>

HTH!

~~~
jamongkad
While I like what I see in SASS and Compass. I'm afraid I won't be able to
partake in the excitement as I code in PHP for my day job. And hack in Python
during my spare time. Is there any equivalent out there?

~~~
snprbob86
Although SASS is built with Ruby, there is nothing strictly tied to Ruby or
Rails. You can use sass as a stand-alone tool for pre-processing your CSS for
any other web platform. Haml, however, is tightly bound to Ruby.

------
jemmons
I used to use Blueprint all the time, but found it had many inconsistencies
and corner cases -- primarily its vertical pacing of type, but also in its
grid. Then, when I'd go to fix these issues manually, I'd always end up
befuddled and foiled by its implementation overriding me.

My rules for judging CSS frameworks are: "They should pick something, do it
perfectly, stay clear of everything else," because fixing just an aspect of
someone else's CSS is such a punishing experience. Blueprint fails all three
of these requirements, bundling grid, typesetting, form, print, and templates
libraries together, not implementing them all perfectly (well, duh), and not
staying out of my way when I don't need one or more of these features.

My current favorite grid implementation (and attendant design philosophy) is
OOCSS. I highly recommend everyone check it out and absorb the knowledge
presented there: <http://wiki.github.com/stubbornella/oocss>

------
neovive
I've been using a related framework called BlueTrip CSS
(<http://bluetrip.org/>) that combines elements of Blueprint, 960 and Hartija
print css. It's a very good framework for rapid website prototyping.

------
psranga
When I last looked at Blueprint, it looked pretty good for brochureware
websites. But when I tried to use it for something else, I quickly ran into
lots of limitations. I ended up coding my own CSS.

What do others think?

We really need a programmer-friendly abstraction layer over the mess that is
CSS.

------
callmeed
I like blueprint a lot ... but I'm also really liking 960.gs ... I think it
might have a slight edge over blueprint.

~~~
ssharp
I like the relative simplicity of 960.gs. It does a reset and then has a
fairly simple set of glasses for actually do the grid. It also comes w/ a
basic typography class that I'll overwrite w/ my own base preferences.

I find that it saves me A LOT of time when doing sites that fit the grid
style, which are most. It's out of the box functionality really shines when
you realize you don't need to play around with floats, margins, and other CSS
"tricks" to get your CSS layouts working across browsers.

The biggest issue I see with 960 vs. Blueprint is that I believe Blueprint
will allow you any width you'd like. Resizing 960 probably isn't a huge ordeal
but it's not as simple as in Blueprint.

------
thras
When I use Blueprint, I like to add a "colborder-left" and "border-left" class
(which isn't hard).

