Improve Theme Performance with CSS Sprites

CSS sprites are multiple images merged into a single image. This reduces the number of HTTP request to your server. Using CSS style rules, you can position the sprite in such a way that it show different graphics for differenet sections of the site. For example, you can merge the header, logo and footer into one CSS sprite image.

CSS Sprites are part of Google's Page Speed and Yahoo!'s YSlow recommendations for performance.

Advantages

  • Reduced HTTP requests to your server

References