cSprites – Speed Up Page Load Time with Dynamic Image Sprites

Automatically compress your images into a big sprite, decreasing web page load time. SEO features automatically generate rich ALT and TITLE tags.

Author:Adrian Mummey (profile at wordpress.org)
WordPress version required:2.7
WordPress version tested:2.7.1
Plugin version:0.510
Added to WordPress repository:01-03-2009
Last updated:04-06-2009
Warning! This plugin has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.
Rating, %:20
Rated by:1
Plugin URI:http://wordpress.org/extend/plugins/csprites-...
Total downloads:15 694
Active installs:30+
plugin download
Click to start download

The idea of combining images into a larger one and displaying this using CSS tricks has been around for awhile.

There are a couple big benefits to doing this: First it reduces the number of HTTP requests that the browser has to make, by combining say 5 images into 1 big image, the number of image requests has been reduced by 4. This can increase the effeciency of page loading and you can see gains in the speed at which your page is loaded.

cSprites will enable you to compress all of the images in your content into one big image, called a sprite and display this in parts. Thus the user will only have to make 1 request rather than many for all your content images.

cSprites now has some nice SEO behavior, you can let it automatically generate ALT and TITLE tags based on things like Post title, categories, image name, etc.

cSprites has another possible benefit or problem (depending on how you look at it), that is that people will no longer be able to directly copy/download your images without first going into the CSS finding the sprite-ed image file, then going into photoshop and cropping out the image that they want. You can still link the sprite-ed images to the originals, because cSprites doesn't delete your original images.

cSprites is compatible with lightbox plugins.

DEMO on my home page: View Demo

For more information on this cSprites plugin : cSprites for WordPress

For more information on the cSprites core API please see my blog post: cSprites info

NOTE

By default I have disabled the sprite-ing of PNG images. PHP does not have a great PNG compression algorithm and therefore the image size of a sprite-ed PNG could actually be larger than the sum of the individual PNG images. You may still turn this option On in the settings if you like. I am currently investigating adding support for some great command-line PNG compression utilities.