Five essential CSS tips from top developers

Warning This article was written over six months ago, and may contain outdated information.

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.

3 comments on
“Five essential CSS tips from top developers”

  1. Good tips, thank you! I’m just getting started with CSS.

  2. great tips mate but you should increase font size of headings.

  3. 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.