Fast website is very enjoyable and absolutely improves user liking and server load. Also you will see bounce rate reduces with increased speed if you have quality content. I am working on new theme to make it minimal in terms of size and optimizing website speed. Coming to the site, I have seen a number of sites having logo itself with about 30kb to 40kb; other banners and images too even more than 150kb. 150kb is extremely massive and users will instantly close browser when website takes too much time.
I am not going to cover all the theory of its – coming to steps – let me show you what I do as an alternative of making it more difficult:
1. Resize images to the size required for you site. Uploading 3000 x 2000px image and showing it at 600 x 400px through html is of no importance. You may resize image, or edit image or even crop photos. Never use images directly from your digital camera.
2. If it is a post with multiple images use multiple image resize tool to make all images standardized width
3. Upload all images to ImageShack – I suggest this because it makes your work faster by given that multiple image uploading features. Upload all images and get direct url of images.
Optimization of uploaded images
4. Use these direct image urls in SmushIt. Note that SmushIt gives you only 5 urls at a time, if you have more, you have to do it next time. Smushit is really a magnificent tool and compresses your image size keeping equivalent quality. I have seen few images getting optimized by upto 80% (File size reduced to 30% of original size).
Also make sure that the images used on your site/blog like logo, banners, buttons etc are all optimized in size – if not, then what are you waiting for? Just do it.
You can use Smush.it WP plugin for your WordPress blog – It will help you to compresses automatically the uploaded images.
My Recommendation: Don’t use GIF format on websites except the image you use is an animated one. Use PNG as alternative of GIF as they too support transparent backgrounds and take less space. Use PNGs for images with most single color background – like a whiteboard, screenshot of webpage like Google etc. Or else use JPEG. JPEG is for images with maximum colors.