Banner Image AS IS
Filesize: 547KB
Change in filesize between the AS IS and OPTIMIZED banner image
(Result can be seen in banners above and below)
By simply using the 'save for web' function from Photoshop, and carefully choosing the quality/compression, the filesize is reduced to 32% of the original image (from 547KB to 175KB).
WITHOUT visual impact on quality!
Banner Image OPTIMIZED
Filesize: 175KB
Blog Image AS IS
filesize: 344KB
Blog Image OPTIMIZED
filesize: 72KB
Change in filesize between the AS IS and OPTIMIZED blog image
(Result can be seen in images above)
By simply using the 'save for web' function from Photoshop, and carefully choosing the quality/compression, the filesize is reduced to 21% of the original image (from 344KB to 72KB).
Again, WITHOUT visual impact on quality!
Conclusion
Even though there are more ways to optimize loadingtime of images, Choosing the correct filetype and compression is a good start.
Given the examples above, on a page with 1 banner en 3 blog images, the total filesize of the images would already be reduced from 1579KB to 391KB by simply applying these best practices.