The Yahoo YUI CSS framework is a big help.
 The Reset, base, and fonts give you a good foundation. The grids make it
super easy to build layouts. Combine all four into a single css file:

And you've got some good performance. The above link means Yahoo handles the
distributed caching for you.

This means you only have to concentrate on what makes your sites unique.
You'll be surprised how lean and efficient your final css markup is when you
remove the foundation cruft.


-----Original Message-----
Behalf Of Karl Lurman
Sent: Thursday, April 24, 2008 8:42 AM
Subject: Re: [WSG] An efficient CSS architecture


I recommend googling CSS Frameworks.

Also, I recommend looking at a site I implemented a CSS framework of
my own. It sounds very very much like your approach.

It works on the concept of layers that can be used to progressively
enhance the visual appearance of a given HTML document set. Its
actually the base css framework for a content management solution
developed by a company called Datalink here in Melbourne, my previous
job. Being part of a CMS, it has a few additional layers to further
customise the site with respect to customer requirement. Similarly, I
used namespacing to separate styles that are part of the base
framework with styles that are customer specific.

The beauty of the framework is that it is consistent and easy to
learn. The idea being that the framework remained unchanged, and only
theme and customer specifc stylesheets affected the cascade. Another
added benefit was in knowing which sheet a specific style resides in.
This was extremely helpful before the likes of Firebug.

The only real draw back of this approach is the initial page load.
There is an overhead in downloading so many different stylesheets. The
best thing to do in this case is to compile your stylesheets into a
single build. This is the approach we are applying at my current job
here at SitePoint.

Good luck with your own framework! :)


On Thu, Apr 24, 2008 at 4:05 PM, Jens-Uwe Korff
> Hi all,
>  I'm currently in the lucky position to be able to design a CSS
>  architecture from scratch. I was thinking of creating a layered approach
>  where I have a CSS layer for
>  - the CSS reset
>  - the site layout (structural parts, ie. columns, rows, header, footer)
>  - the site's elements (boxes which can be reused across pages; a box
>  might contain images, heading, paragraphs)
>  - the site's skin (colours, sprites etc.)
>  I'd like to know if you have been through this thought process and if
>  you have proven concepts that you would like to share.
>  (You can email me offline too, but we've got a long weekend here so I'll
>  contact you Monday.)
>  Thank you!
>  Cheers,
>  Jens
>  The information contained in this e-mail message and any accompanying
files is or may be confidential. If you are not the intended recipient, any
use, dissemination, reliance, forwarding, printing or copying of this e-mail
or any attached files is unauthorised. This e-mail is subject to copyright.
No part of it should be reproduced, adapted or communicated without the
written consent of the copyright owner. If you have received this e-mail in
error please advise the sender immediately by return e-mail or telephone and
delete all copies. Fairfax does not guarantee the accuracy or completeness
of any information contained in this e-mail or attached files. Internet
communications are not secure, therefore Fairfax does not accept legal
responsibility for the contents of this message or attached files.
>  *******************************************************************
>  List Guidelines:
>  Unsubscribe:
>  *******************************************************************

List Guidelines:

List Guidelines:

Reply via email to