People are always asking me about this so I thought it might be worth a quick blog article to explain how different image formats work, and when to use them!
For most of us, we would snap a quick photo on the iPhone, and then email/text/snapchat/messenger it through. That works for most of our needs!
But what happens when you want to use images on a website design, in a logo, or for any other digital sort of means? Printing images is a whole another kettle of fish, so we will keep that for another blog.
Photoshop allows us to save images as many different formats. Here is a brief introduction to the different image formats.
RAW
A RAW image is straight from a Digital Camera that is basically used by a Professional Photographer. They are HUGE in file size, and often need to be imported in a special way. RAW photos are awesome to work with and process to get the best possible image as they hold every little bit of data contained in that image, untouched. They do however require a computer with a fair bit of grunt to process. A RAW file won’t work on the web. A photographer would often shoot in RAW, and then process the image, and save it down into another format depending on its use.
JPG/JPEG
A JPEG image are probably the images that you are most accustomed to seeing. JPEG is a special format that compresses the image down. Often programs let you set how much you want to compress the image (ie preserve quality vs minimal file size). As a general rule of thumb 60-80% quality often works quite well! JPEG is great for the web (as they are quite small in file size), great for sharing, and what most people normally will use.
JPEG however does lose image quality on compression. It is something called ‘lossy’ compression. What this means is that data in the image file is approximated. So yes, quality is lost.
If you wanted to shrink an image with a compression that could be perfectly reconstructed into the original, then you would need to use a type of compression that was lossless (PNG/TIFF).
GIF
GIF is a format that basically supports 256 colours only. A typical photo has millions of colours. So 256 won’t work well for a photo! But a GIF file format can be awesome for logos with only a couple of colours. It can save the image right down as a tiny file size!
PNG
Designed to replace GIF, PNG has a huge amount of colours available, making it great for most images. It also provides transparency. This is really important if you want a part of your image see through, ie not on a white background. It also was designed to use lossless compression, however these days can do either. It can shrink down to pretty decent file sizes for the web. Often graphic designers will supply logos in this format for your website as they do have transparent backgrounds.
SUMMARY
We hope that gives you a brief overview of the image formats. It’s all about file size at the end of the day, to make websites load quicker. Often its a compromise between quality and speed.
If you need any help choosing the right file format for your website, please get in touch! And if your website is terribly slow, sing out, we can help.
