Image Extensions Explained
This will not be a long article. Lets keep it simple. All around the web I see that image extensions are "misused" and wrong type of images are being used. So what is the best image extension to be used and when? Well, lets put it this way.
JPG Files Usage
When to use JPG files on the websites? Any photos should be posted in the JPG files. Any photos that don't require transparency, JPG is the way to go. Try to keep all the images under 200KB.
PNG Files Usage
When to use PNG files on the websites? Nowadays with the fast speed internet users, I would recommend PNG files for pretty much every graphic used on a website. It is the go-to file type for images that require transparency. Yes, GIF file does support transparency, but quality-wise you would be losing a lot. Keep in mind that you can compress PNG files for fast loading. Try to test your websites with Pagespeed for Chrome or Firefox.
GIF Files Usage
When to use GIF files on the websites? Well, small backgrounds images work well. Anything with 256 colors or less will save you bytes of loading time. If you need an animated image, GIF is also the way to go. By the way, did you know that you can simply drag a small video into Photoshop, it will automatically create multiple GIF frames for you? Once again, keep in mind that it's best if the video is using 256 colors or less.
BMP Files Usage
When to use BMP files on the websites? Never. Simple as that.