ITGS Image, sound and presentations: Bitmap File Formats

Posted: Thursday, 31 January 2008 in 2.2.4 Images, sound and presentations
Tags:

[ source: bbc.co.uk ]

In general, the images that a computer produces can be split into two types: vector drawings and bitmaps. Vectors are a collection of instructions such as: ‘Draw a square in the bottom right, fill it blue, make it 78 units tall’. Bitmaps are basically descriptions of the colour of each pixel in the image.

Vectors are generally produced by ‘draw’-type programs. The most popular of these are CorelDraw, Adobe Illustrator and Macromedia Freehand. Computer Aided Design programs output in vector format as do the £D programs involved in CGI graphics. The big advantages with vector formats are that everything is scalable and editable. If you want to double the size of the image, a draw program can redraw the image double the size and every object will increase in size and remain as crisp as it was at half the size. If you save it again at the new dimensions the file size will remain the same, since every object is saved as its own instruction. They are also completely editable when you load up the file again.

The problem with vectors is that it is extremely difficult to get realistic shapes and pictures from them. The other problem is compatibility. Most draw programs save in their own file format: if you do not own a draw program, it is difficult to find anything that can display it. In recent years Standard Vector Graphics (SVG) and Vector Mark-up Language (VML) have been rolled out on the web, but implementation in browsers has been poor so they have not become popular.

Bitmaps are much easier to use, they are also the type of picture that people are most familiar with. Also every graphical operating system has a simple ‘Paint’ program that will produce bitmap images, and with the growing use of the Internet and digital cameras we see more bitmaps in everyday life. The major problems with bitmap images are larger file sizes and complex editing techniques.

In simple paint applications, when you place a blue square on a bitmap image, the program records that certain pixels are now blue, rather than white. When you open the file up, you see a square, but the program only sees that some pixels are a different colour. There is no way now to edit the square. When you expand or zoom into a bitmap, you tend to get a pixelated image; when you reduce the size of a bitmap you lose detail in the image.

For example, a photograph taken on a five mega-pixel digital camera is a picture made up of about five million pixels. Most standard formats use 24 bits of information to describe each pixel. This breaks down as each pixel has three eight-bit values (0-255) for how much red, green and blue it contains. This image will be about 15Mb in size: to make bitmaps manageable, you need to use compression. Most bitmaps you see have undergone some form of compression.

Some bitmaps that do not use true-colour – that is, they use less than 16.7 million colours – use a palette of selected colours. Instead of each pixel having a colour value, it has a reference to the number of a swatch on the palette. The palette contains the colour values for each swatch and is stored with the image.

RAW Format

RAW format is an image output from a high-end digital camera. It is just a string of pixel values relating to each picture. Different cameras produce files with 24, 36 or 42 bits per pixel. RAW files are like their name, raw. They undergo no compression and no fiddling with. A RAW file doesn’t even include the dimensions of the picture; the program reading the file has to be told afterwards. Different cameras produce slightly different formats, and they all have to be converted to a format such as JPEG or TIFF before a paint program can edit them.

The big advantage of RAW images is that no image data is lost by compression. They are also extremely easy to perform calculations on, such as changing the colour temperature of the photo. Because they record every pixel, it does not matter how complex the picture is, the file will be the same size. The big disadvantage is that they are huge. A single RAW file from a high end camera can be as much as 30 to 40Mb. Artists and professional photographers use this format for producing high quality photos for publishing. There is no point in using RAW format to email your photos to friends – other file formats are much smaller, and the loss of quality can be hardly noticeable for smaller images.

RAW files demonstrate one annoyance that is common across the computer industry; people going their own way and to hell with anybody else. This has led to each camera manucturer having their own slightly different formats for RAW files. Generally, the only way to access them is by buying more software from the camera manufacturers.

BMP

Bitmap format is the native format for MS Windows. It stores pictures as uncompressed graphics at either 1, 4, 8, 16 or 24 bits per pixel (2, 16, 256, 65,536 and 16.7 million colours). Although the files are quick to load and don’t lose data when compressed, there is a big problem with BMPs: they are huge files.

While this format may have been fine when computers couldn’t handle larger images, it is out of date and nearly useless now. Windows Paint still offers the option ‘Save As BMP’ and there are a lot of pictures on the web that are in BMP format. However, using other formats can reduce the file sizes by as much as 90%. With BMP files, compression is an option, but it is rarely used.

Windows logos and backgrounds are still in BMP format as they load slightly quicker and Microsoft are not bothered about how much space they use up.

PCX

This is a file format that possibly should have gone out with the ark! It was the native file format of PC Paintbrush and was relatively popular in the early days of DOS and Windows. It had very limited compression which, though quick to calculate, was not very efficient. PCX was limited to eight-bit (256 colours) format.

GIFs

Graphics Interchange Format was popularised by CompuServe. It offers loss-less image compression, interlacing, transparent images and animation. The format first arrived in 1987 and was revised in 1989 to include animation and interlacing. It was one of the first two image formats on the World Wide Web; the other was the black and white XBM.

Loss-less image compression means that no image detail is lost in the compression. GIF does this by splitting an image into rows and looks along the row. Where there are blocks of the same colour, it records it as a block, rather than recording each pixel. This use of horizontal repetition means that horizontal stripes can be compressed into a very small size. A drawback of using this technique is that to do this quickly and efficiently, the palette (number of colours) has to be reduced. The most colours that a GIF image can display is 256, although by reducing the amount of colours even further, one can reduce the size of the image even more.

Interlacing means that the image can be saved as alternate rows. This means that when an image is loading, the first row shows, then the third and so on until the bottom of the image is reached. Then the second row, the fourth and so on are loaded. This enables users to get a quicker idea of what the picture they are loading is. With modern download speeds, this is not really an issue.

GIF images offer one-bit transparency. This means that a pixel can be transparent or opaque. It allows designers to make an image fit in with the background. The problem is that it only works properly for images with straight horizontal or vertical edges. Other edges are normally subject to anti-aliasing where shaded pixels are added outside the line to make the line look smoother. With one-bit transparency, they are set as opaque and so will clash with the background colour.

GIF format allows more than one frame of an image to be stored in a file. This allows simple animations to be stored. GIF animations spread like a plague over the web and it is still easy to find personal homepages infected with dancing frogs and small business sites with spinning globes proudly on display. Many sites, including h2g2, also use animated GIFs for banners and advertising.

One big debate surrounding the format is the pronunciation of GIF. Some people prefer to have a hard ‘g’, ‘gif‘ others belive it should be a soft ‘g’, ‘jif‘.

In the late 1990s, there was a case over licensing issues with GIF. The LZW compression that GIF uses was patented by Unisys. They discovered this and tried to make everybody who made software that used GIFs pay royalties. In 1999, Unisys stopped free licences for the compression’s use. This panicked the industry into releasing PNG (see below). The US patent ran out in 2003, and GIFs were free to use again. One thing to note is that there are one or two colours where for an unknown reason an Internet browser will render differently as a webpage background than in a GIF image.

As they handle block colour really well, it is best to use GIFs for logos, graphs and images of text, especially ones that need to be saved small to be put onto the web. As PNG becomes more popular, it will start replacing the GIF. They really struggle with gradients, and in general, most photos are best not saved as GIF format.

JPEG or JPG

JPEG format is the alternate format to GIF for everyday use. It gets its name from the Joint Pictures Expert Group who came up with the orginal standard. Most pictures on the Internet are JPEG and it is the format of choice for most digital cameras and graphics software. It saves files in 24-bit (16 million colours) format, or in greyscale.

JPEG uses ‘lossy compression’. This means that some of the detail in the picture is lost as the file is compressed. JPEG uses a number of mathematical transformations to work out what detail needs to be kept and what should be lost. A JPG image is build up out of blocks with vertical, horizontal or diagonal gradient ranging from one colour to another. Different size blocks can be used: the larger the blocks, the lower the detail and the more compression. The strength of compression can be altered to either make the file smaller or to retain more detail. Where lossy compression is most evident is on blocks of solid colour, where ‘artefacts1‘ are quite obvious.

There are some techniques to decrease the file size of JPEG images, a common requirement for web pages. The first is that the more blurry the image, the easier it compresses. Another is to reduce the saturation of the image. Bright, sharp, complicated images do not compress well.

If you are working on an image, it is best not to keep saving your image as a JPEG. Each time you save an image then load it up, you lose a little bit of detail.

A handy thing that JPEG images can do is build up the image as it loads. A blurry, low-resolution image loads first, then gradually becomes clearer.

JPEGs are best for storing photos or images with lots of gradients and little or no block colour. While they are fine for storing photos on your own computer or for putting on the web, they are of little use for printing because they lose too much detail. For this, TIFF is the preferred format.

JPEG 2000 is a format proposed by the Joint Picture Expert Group to use a new ‘wavelet’ transformation to decrease file sizes futher.

PNG

Portable Networks Graphics (PNG) arrived with massive claims. It could do everything that GIF could do and handle 24-bit colour and do a decent job with transparencies. It is a shame that its advantages haven’t been fully exploited.

Like GIF, it is a non-lossy format, but it can deal with 24-bit graphics (it can deal with 48-bit if you push it). In theory, this means that it can be used for full-colour photos; however, JPEG compresses these to much smaller sizes.

Its main advantage over GIF is that it can handle transparency much better; pixels can be partly transparent, so curved shapes look much better. Or they would, but until version 7, Microsoft Internet Explorer could not deal with this. In fact a lot of versions of Internet Explorer crashed if they saw a PNG, whereas others needed a plug-in to see it. PNG support was fully implemented in other browers such as Mozilla, Firefox and Netscape Navigator. The w3 consortium, the people who come up with web standards, say that PNG is the preferred format for graphics.

In theory, PNG files can be smaller than similar GIF files. The fact some paint programs have difficulty optimising PNG files leads people to think that PNGs are larger than GIFs. The PNG is the native file format for Macromedia Fireworks: however, Fireworks PNGs can include extra layers of data and so can’t be read by other types of software unless they are exported.

One thing that isn’t available on PNG is animation. However, for everything else that GIF can do, PNG can do it equally well, if not better. Still, people continue to use GIF as they are more familiar with it.

Some GUIs, such as some of the Linux desktop managers, allow transparent PNGs as background images.

TIFF or TIF

Tagged Image File Format (TIFF) is the most versatile bitmap file format. It was originally written by Aldus2 for use in the print industry.

TIFF images can be compressed, can include layers and can even have multiple pages saved in one file. Whatever the compression used, the scheme is loss-less and so preserves all the detail in an image. File sizes are much larger than JPEG, GIF and PNG – and TIFF files don’t display on web browsers.

TIFFs are great when file size isn’t too important, and it is much more important to create high quality pictures that can be read by any computer. This makes them very popular with the printing industry.

PSD

PSD should get a passing mention as it is the native file format of Abode Photoshop, the major bitmap editing program. PSD can include layers with vectors and type on them. The format is only readable by Photoshop, Illustrator and other image-editing software. It produces huge files which have to be saved in another format for public viewing.


1 Artefacts are blurs, distortions and noise that appear on the image.
2 Who were taken over by Adobe, who joined with Macromedia.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s