Many books on web development advise readers to save images such as clipart or ones with less than 256 colors in PNG format and to save photographs of real objects such as people that are made up of millions of colors in JPG format. The issue with PNGs (PNG-24), however, is their file sizes are considerably larger than JPG (at 80% quality) even though you can hardly tell the different in quality between a PNG-24 image compared to the same image save as a JPG with 80% quality. Therefore, my advice for saving website images is as follows:
- Save all images that have a transparent background as a PNG (PNG-24)
- Save all other images as a JPG (80% quality)
This should help with your website loading time without sacrificing image quality.