6 Ways to Optimize Website Images Without Impacting Performance
3. Compress images. There are a vast number of image compression tools available, including ones that allow you to compress batches of images simultaneously. Do a search for "image compression tools" to explore your options.
4. Spriting. This is a CSS technique for consolidating images into one file, thereby reducing the number of server calls and speeding up render time.
5. Ensure images are in the right format. Incorrect image format is a surprisingly common problem. An image that's saved as a JPEG but should be a GIF or PNG can be several times larger than it needs to be.
6. Defer rendering below-the-fold images. Be sure you're serving your images in the order they need to appear. All too often, I see pages where the feature image loads last instead of first.
If you're like most site owners, you care about page speed. You've probably already invested significantly to improve your back-end and middle-mile performance. Images represent a fertile ground for making potentially huge performance gains at the front end.
Tammy Everts is a senior researcher, writer and performance evangelist at Radware, a provider of application delivery and application security solutions.