Process for writing CSS
CSS is a huge pain in the butt. Theoretically in web design you should separate data (xhtml) from presentation (css), but if you are developing quickly you will probably want to do both at once because it’s faster. Ultimately however it’s a good idea to separate out the CSS, it causes pages to load more quickly and it makes for a cleaner HTML which is easier to debug.
What I do when I develop CSS is do it in stages.
Stage 1: Add style=”” attributes to elements and directly edit styles. (fastest)
Stage 2: Add <style> tags to the html file just above what they reference (still pretty fast)
Stage 3: Abstract those style tags to a separate css sheet. (prone to clutter at the css level but cleans up the html)
The PHP framework we developed uses a CSS collapsing model where we only include 1 stylesheet to improve page load time, but behind the scenes we use multiple stylesheets. Each page gets its own ‘name.css’, and then within that name.css we require() components like ‘userbox.css’ that are shared across pages.
I actually use this same process pretty much for JavaScript too.
