CSS Sprites and image optimization...

I am looking for someone who knows how to do this well to be able to do it for me.

I have a design that has alot of images that are not in the sprites. And the nav doesn’t have the images in the sprite so when you hover it takes time.

The other issue I have is that the image is about 280kb. Not all the important images are in this file. So I would like to get one sprite with all the ‘important’ images in it, the file size would be smaller on this.
Then another sprite for the rest of the images.

Why? Because the important images are things background images and main images. However they don’t seem to display until the entire image is downloaded.

To summarize:
I want sprites for all the images.
I want a sprite for the important images. A sprite for the rest.
Image size optimized.

Post Reply

<strong></strong> to make things bold
<em></em> to emphasize
<ul><li> or <ol><li> to make lists
<h3> or <h4> to make headings
<pre></pre> for code blocks
<code></code> for a few words of code
<a></a> for links
<img> to paste in an image (it'll need to be hosted somewhere else though)
<blockquote></blockquote> to quote somebody