CSS Framwork
I noticed some debate in the CSS world about CSS frame works on sites such as Ajaxian and CSS Globe. Truth be known, I'd seen people talking about these for a while and not bothered to read anything. I usually pay attention with Eric Meyer does something about it, like he has here (somehow I missed the article on A List Apart - probably because recently I've been telling myself ALA isn't as good as it used to be).
Anyways today I did and was surprised to find out that I'd been doing CSS this way for a good six months. So my 2 cents:
Frameworks like YAML and Blueprint are cool. I just won't use them.
With that CSS Hack Night coming up, I'll be amazed if anyone else that turns up to have a crack doesn't have some sort of pre-formatted CSS to use as a base.
Why?
Mainly because I'll be using my CSS files as the basis for projects I do. I don't start with a layout or frame work - just a bunch of style resets and very commonly used CSS (and in the case of the fieldset CSS - CSS that annoys me to rewrite from scratch).
Actually quite a lot like Eric Meyers "Reset Reloaded" - only I'm not sure why hes used the :before and :after psuedo selectors when IE6 won't understand them. I won't be pointing out anything he doesnt know - its just I'll stick with safe things in my common elements CSS.
CSS Design limits
I don't often design sites these days, I work with designers and build there designs. I have creative input but in general the designs are there. And I'm cool with that.
Sites I do design tend to be designed with CSS in mind from the onset - and often IE6 CSS safe. Which I feel limits the creativity of the exercise as I start of with a set of rules which are not necessarily HCI issues, just ones where I'm relunctant to need to resort to CSS hacks (ahh invalid CSS and XHTML - Mike Davidson is right about that).
Working with old school designers, or ones who don't really appreciate the limitations of the format sometimes gives me damned hard problems to solve. But solve them we do (ok so now and then we find a compromise or alternative solution). Point is it makes it all more interesting for me.
From my experience frameworks like YAML and Blueprint won't really do the trick.
Though I do think YAML is really swish and I've no doubt I'll be pinching some elements from Blueprint.
One thing it should do, is make editing other peoples CSS easier.
So what do I use then?
Well if your interested I use a common.css and then I copy and paste a copy of base.css.
Yes this does give a site Verdana body copy, Arial for headers and centrally aligns everything. But its as much to give my CSS file a structure:
- body style;
- layout styles;
- general tag styles;
- custom classes;
- div specific styles;
- and then page specific styles.
So I always know where I can find some bit of CSS and that I dont overwrite any list types inside a div's margin-left by putting li { margin-left: 0px; } towards the end of my CSS and buggering everything up.
And often the sites I make are centerally aligned columns and often forms come in that:
form label: form field
format, rather than the much easier to style:
form label:
form field
and so I find it easier to have that pre set up.
Then theres lots more CSS to write - and I like writing CSS.