March 22, 2004

CSS Sprites

*Smacks head and wonders, "Why didn't I think of this?"*

Here it is in a nutmeg: all your site image(not content images) are on one file and your CSS handles the cutting, rollovers, etc.

It's an old idea from the days of 8-bit gaming. little graphics (called 'sprites') were plucked from a map and selectively painted on the screen. You can do the same thing with CSS.

This same method is used by many programs today(winamp and trillian being two extemporaneous examples), so why not use it in web sites? One of the big(and I mean HUGE) advantages is that you won't have to worry about slicing graphics anymore. No more burning your retinas on the screen, trying to make sure your slices were tight before submitting yourself to the mercy of Fireworks.

There are other advantages. Less http requests, consistent color palette, and the potential for cleaner HTML markup, which never hurts.

I thought it was a pretty cool combination of ideas. I'll be trying it out on the v2.0 of, along with the complete removal of tables, as evidenced by Spoono, and other sites.

Posted by Jeffrey at March 22, 2004 8:07 PM
Post a comment