On File Types
Apart from the image quality of the pictures you use in your graphics, saving your graphics in the wrong file format can also be disastrous for your image quality. If you’re saving and plan to edit your graphic again at some later time, it’s best to save in the file format that saves the layer information for your graphics editor (such as PSD for Photoshop). When saving for the web, the three most common graphic file types are JPG, GIF and PNG. They all have different properties and their own ideal use for which they were created.
JPG/JPEG
This is the format you will find most photos in. It’s a “lossy” format, which means it loses “unnecessary” information from graphics to compress the file size. Graphic programs usually allow you to select the quality when saving to jpg. However, when selecting the highest quality, it’ll usually lead to very big file sizes. Selecting a lower quality can result in blurry images. Repeated opening, editing and saving of a JPEG causes gradual quality loss on each save, even if the same quality is selected in your graphics editor.
GIF
In my opinion, GIF should not be used except for animations. GIFs can only save up to 256 colours, leading to a huge loss of colour information and thus quality of your graphics. However, it’s ideal for small images with few colours, such as logos and charts. It’s also the format to use for animations.
PNG
In my opinion, PNG is usually best for graphics such as blends and website headers. However, you should always optimise PNGs when saving, or it could lead to HUGE file sizes. PNG supports varying degrees of transparency, allowing for opacity effects, but that might not be displayed correctly across all web browsers.
Conclusion
When saving your graphics for the web, pay attention to the file types and choose the right one for that particular graphic. If you’re not sure which one you should use, you can save copies of your graphic in each file type and choose which one to upload based on image quality and file size.
I’ve only shortly explained what the properties of each file type are and what they are best used for. If you have anything to add, please do feel free to leave a comment!

Recent Comments