Destylio News

Understanding file types - do you know your .GIF from your .JPG?

When faced with saving an image on our computers it is commonplace to be offered what seems like a never ending list of options to choose from in terms of the file type to create. If you are a web design or graphic design professional, then this list can become much easier to navigate, however we have created a little 'who's who' of the file world below to help you if you are not so familiar with all of your options!

So, what is the main reason we have to choose from this list of file types? Well, it is to do with compression. Image files can often be pretty hefty in size and therefore cause slower downloads and also more disk usage. Compression is how the file size is reduced.

There are two types of compression, 'lossy' and 'lossless'. Again, this can be explained rather simply - a 'lossy' compression will accept some degradation or loss of quality in the actual image in order to acheive a smaller file size. On the other hand a 'lossless' compression will look at every way possible it can reduce the file size WITHOUT making any kind of negative impact or reduction on the physical image quality.


Let's summarise the common choices...


In the majority of instances a .TIFF file is a 'lossless' file, so no image quality is compromised (though in principal it can also be 'lossy'). It is a very flexible file format and often creates rather large files due to the fact that it's largely high quality.


A .PNG file is also a 'lossless' format, however it is a rather clever little file! It looks for patterns within the image that it uses to compress the file, however the compression patterns used are exactly reversible, so the image is recovered exactly when re-opened.


The .GIF file type does compress imagery and the main way in which it does this is by reducing the amount of colours used. The file creates a table of up to 256 colors from a selection of around 16 million options. So if an image contains less than 256 colours a .GIF can render it exactly, if it has more the .GIF uses any of several algorithms to approximate the colours in the image with the limited palette of 256 colors available.

So essentially, a .GIF file is 'lossless' if your image has less than 256 colours in it. If not, it will reduce the quality by means of colour compression (becoming 'lossy').


This is probably the file type that you are most familiar with and it is best for photographs. These files can withstand a decent amount of compression whilst still retaining a very high level of quality. How do they do this? Well, .JPG files are very clever in that they analyse themselves in depth and remove absolutely everything they can that is very unlikely to be noticed. Another super thing about .JPG files is that the level of compression is alterable, meaning they give you the most control over the quality and size of the file created out of all file types.


The RAW file option can be seen as an output option on most digital cameras, however each manufacturer has a different RAW format. This is a 'lossless' file type, favoured by professional photographers as it creates smaller files than .TIFF files of the same size but also captures every little detail just as the camera sees it. Often these RAW files will be edited and re-saved as high quality .JPG files for ongoing use once editing is completed.


What should be used and when?


Use for: Multiple 'rounds' of photo editing on an image, as unlike a .JPG file, it won't lose quality with each new save.

Don't use for: The Internet or web purposes. The files are too big and what's more, a lot of web browsers won't display them!


Use for: Displaying an image on the web without losing any quality.

Don't use for: Be wary of using a transparent .PNG file in your web work as older versions of Internet Explorer won't render the transparency!


Use for: Images that contain less than 256 colours and large areas of uniform colour.

Don't use for: Photographic images, as the colour range of 256 colours will not produce the resuts you need in a tonal photograph!


Use for: The final file for all your photographs, whether for web or print. Just ensure you use the right compression level.

Don't use for: Line art or images which contain large areas of uniform colour.


Hopefully the summary above has helped to guide you in terms of which image file type to use for your next project! If unsure, you can always bookmark this article so you have a quick reference guide to use!