Comments on: Object Oriented CSS (OOCSS): The Lowdown

By: Bleak

Bleak — Sun, 04 Apr 2010 22:11:38 +0000

I can’t say I’m overly convinced at this technique.
It really just seems like someone’s personal take on how they choose to organise CSS.
‘Best Practice’ is still fairly subjective.

By: Auré

Auré — Sun, 14 Mar 2010 12:15:14 +0000

Interresting article!

By: alex@jkjhkj

alex@jkjhkj — Wed, 13 Jan 2010 08:09:26 +0000

@Phil: thanks for adding it to us. It really worth enough to know about it.
@TypeSett: thanks also for the code. You’re right, it is easy to understand than just using acronyms.

By: Anne

Anne — Sat, 09 Jan 2010 23:28:39 +0000

Interesting read. I’m all for efficiency and cleaner code, thanks for sharing.

By: TypeSett

TypeSett — Thu, 07 Jan 2010 19:01:04 +0000

@Phil — Thanks for commenting. It’s great to see how other people approach their work. My only thing is that naming it rather than using a acronym can sometimes be more semantic… easier to understand/train. Thanks, Phil!

By: Phil Ricketts

Phil Ricketts — Thu, 07 Jan 2010 09:15:21 +0000

Good tips in here, nice to see that I follow most of them.

Though I do something that some might frown upon: I use short ID/classes like this:

Main content areas (structure):
#h = Header
#c = Content
#f = Footer
#z = extra (progressive enrichment markup, modernizr test etc)

For modules (structure):
.c = content
.h = header
.f = footer

Generic stuff (for article content & some structure):
.clr = clear
.fl = float left
.fr = float right
.tl = text align left
.tr = text align right
.tc = text align center

The logic in this, is that I’m keeping short-length IDs and classes for the structural kinda stuff, and use longer more human-readable classes for definition of content area (e.g. Logo title).

I also tend to put the longer human-readable class at the start of the class attribute (e.g. class=”foobar fl tr”).

Having shorter classes for generic kinda stuff, and for main structural markup makes life easier for me as my code is more readable. It’s working for me so far at least!

Thanks for sharing, Nicole.