Monday, 29 October 2007

Big Stock Photo - Image File Formats

Because this subject often causes confusion between the types, I thought I'd take a few minutes to try and outline the key concepts of some common image filetypes and explain the pros and cons of using each method.

The image filetypes that I will look at are:

JPEG - Joint Photographic Expert Group
GIF - Graphics Interchange Format (Compuserve)
PNG - Portable Network Graphics
PSD - Photoshop Format
RAW - Found on expensive digital cameras
TIFF - Tagged Image File Format
BMP - Windows Bitmap

The above is a list of the most commonly used filetypes. Now, depending on how an image is to be used, depends on how the file should be saved. Each format offers it's own method of compression, be it lossy or lossless, but if an image is to be posted online, factors that should be considered are: file size (for download time) and compression to quality ratio. First let me explain the difference between lossy and lossless compression.

The difference between LOSSY and LOSSLESS compression is that the lossy method uses a complex compression algorithms that get rid of bits of data, for example parts of the image that the eye physically can't see and won't be missed. Of course, this does create issues with the quality of the image. If the image was to be resized (large OR small), the user will be able to see the degradation in quality, which is not a good thing if it was being used in a professional photography environment. For internet use however, lossy compression reduces file size, and is generally ok. The lossless variant of image storage is again a complex set of algorithms that stores image data without getting rid of any bits of the file. Files using lossless compression generally have a larger file size, making them unusable on slow internet connections, as large files take longer to download.

From the list above, here is a breakdown of which formats use lossy and which use lossless compression.

LOSSY Formats: JPEG, GIF
LOSSLESS Formats: RAW, PSD, PNG, TIFF, BMP

Lossy file formats are generally used on the internet because the file size stays low, even on images with large dimensions.

So what are the differences? I'll start by comparing the lossy file formats, JPEG & GIF.

JPEG (Joint Photographers Expert Group), has the ability to store images with a HUGE compression ratio whilst keeping a 24-bit colour palette (true colour). Excellent results are produced when images are saved in this format, and the format is widely used on the internet, because of its superb compression to quality ratios. File sizes stay low, but the image quality remains high.
JPEG works by making unnoticable changes to an image, and removes parts of a file. Where the format falls is on sharp edges and abrupt colour/subject changes. Saving as JPEG removes any abilty to resize an image greatly (either larger or smaller). The more you compress a JPEG file, the more colour information will be lost, reducing image quality further.
In comparison with other formats, JPEG will easily compress an image around 2-3 times better than the GIF format.

The GIF image file format was developed by Compuserve and is an acronym for Graphics Interchange Format and was designed for graphics rather than photographs. Because of the applications it was designed for, GIF only supports an 8-bit colour palette, making it bad at handling photographic material due to its reduced number of colours. Unlike JPEG, GIF supports transparency and interlacing in images, making it ideal for diagrams and logos. It is also possible to save GIF as a vector graphic, meaning that it can be resized as big or small as the user needs it, and the quality will not be degraded.
GIF is still, and always has been, most favourable for web page design components, such as simple backgrounds, logos, buttons, and small animations (banners etc), but when asked to handle anything with more than 256 colours (unlike the 16million colours of the JPEG), the format will fail.

Moving on to the more favoured formats in the photography and design industry, the BMP file format was devloped by Windows and is an abbreviation of the word Bitmap. BMP works by storing information on every single pixel in an image, which explains any large file sizes! Each pixel has a value for each of the Red, Green, and Blue (RGB) values in the colour system. The main disadvantage of this file format is the lack of cross-platform compatibility. This file type was developed for just the Windows platform, making it unusable on any other system.

The PNG (Portable Network Graphics) file type is probably the only lossless format used online, as file sizes stay reasonably low. Typically compressing 5-25% better than GIF, PNG image data is compressed across rows AND columns, whereas a GIF file is compressed just by rows, which gives it that slightly bigger file size. Again, PNG supports transparency and up to a 48-bit colour palette, which is more than the JPEG format. Be aware though that using a 48-bit palette for a picture that was to be uploaded to a website would be a bad idea because the file size would be much higher than using a 24-bit colour palette.

The TIFF image format is another lossless compression algorithm that is accepted across a number of different platforms. A TIFF file contains only original image data with all the information intact. This in turn makes file sizes very large and people tend not to use TIFF images where big files are an issue, such as on the internet.

RAW is a filetype that isn't widely used, but can be found on some expensive digital cameras. The name gives a slight clue as to how images are stored, in their "RAW" unchanged and original state. Similar to and a genral alternative to TIFF, any image data remains intact. Like TIFF, this file type is very platorm friendly and is easy to transport between systems and applications. The main disadvantage of the RAW file format is that a lot of image specifications have to be set before it can be used effectively.

Finally, I will talk about the Adobe Photoshop PSD file type, which is what I used for the images in the BigStockPhoto project (although the final images were saved as JPEG files for internet use). PSD is becoming more and more accepted in the image editing world because it is a very flexible format, offering support for an (almost) unlimited number of layers, image channels, and paths, making it great for editing, because any changes would be made on a separate layer, and if there were any unwanted layers at the end of an editing session, they can easily be deleted. The PSD file has an option to "flatten" an image, which means to mix all the layers down to a single layer, but if file size is not an issue, store images with all layer information intact, as it will make editing much much easier. Because of the flexibility of this file format, file sizes are often very large, so buy a big hard drive!!

To end this post, I will include an image file size comparison table, just to give an indication of the compression ratios that each file format uses. The image I have used is a downloaded RAW graphic, 1615 x 1465 pixels. The file was saved in all seven formats and the results are shown below (ordered largest to smallest file size):


It was interesting to see that the TIFF and BMP files ended up larger than the original RAW file.

No comments: