I just took almost all the graphics on my website that are used often in the design and put them into a CSS sprite. Because of the varying sizes this created large area of the new image file that had nothing in them. The result of this was a new CSS sprite that was about 80KB when all the original images together were only about 48KB. I can tell how the webpage is actually loading slower now.
Is it worth keeping the sprites to minimize HTTP requests? Does size matter more or the amount the server is contacted to download each file? I am not sure what to do to fix the problem, keep the sprite, or go back to individual images.
Also I have compressed the sprite as much as I could using Photoshop and other online tools.