Until the Data URI scheme gains widespread browser support, CSS image sprites are the best method for reducing HTTP requests for multiple decorative images used on a webpage.
Sets of UI graphics used throughout the widget examples on irama.org use these sprite techniques. Using sprites in this way requires an image replacement technique.
Best effects for decorative transparent images (like round corners) can be gained using 8-bit PNG with alpha transparency.
- CSS Sprites: Image Slicing’s Kiss of Death
- Minimize HTTP Requests
- Optimize CSS Sprites
- iPhone Cacheability – Making it Stick (keep sprites under 25 kB so iPhone will cache them).