The October 2007 issue of the UK web development magazine .net has an interesting feature this month where web professionals share their favourite tips for coding CSS. Here are the five tips, with links to read more about them.
-
Split your CSS
Using the power of the cascade, running separate CSS files for different aspects of the site allows you to make changes quickly and easily. Mike Stenhouse’s Modular CSS is a good introduction to this.
-
Perform version control
On smaller sites, it can be as simple as adding numbers or dates to your files; on larger projects, you might want to think about using a Wiki or even something like Subversion.
-
Reset browser style sheets
This will eliminate the majority of cross-browser problems. But don’t just go for:
* { margin: 0; padding: 0; }
As this can cause more work for you. Instead try something like Yahoo!’s YUI reset or Eric Meyer’s Reset Reloaded.
-
Image replace
Probably the most widespread technique in use today, although there’s still no bullet-proof way to do it. Mezzoblue has the best round-up of pure CSS techniques, while the sIFR method uses Flash and Javascript to give greater flexibility.
-
Code semantically
The most important CSS tip is to write good HTML. The more descriptive and logical your code is, the easier it will be to provide full accessibility across multiple platforms; plus, you will have more hooks to apply style to. It even has its own acronym now: POSH.
The article goes into greater detail than I can here, so I recommend you pick it up where possible; it’s a consistently good read.
Good tips, thank you! I’m just getting started with CSS.
jen [September 30th, 2007, 17:40]
great tips mate but you should increase font size of headings.
Css tips [May 25th, 2011, 14:08]
Oops, you’re right; I wrote this a while ago and it must have broken when I created the new theme; I’ll update it when I get a moment.
Peter [May 25th, 2011, 14:11]