Eoin Johnston

 

DNET4 - CN415     Assignment 2

 

How pixel depth reduction can be used to reduce the size of an image file

 

 

Introduction

An image in its simplest bitmap form is stored on a disk pixel by pixel.  A pixel is basically a ‘dot’ of colour and collections of pixels make up an image.  Provided there are enough pixels in any one area the human eye perceives this collection of ‘dots’ to be a continuous analogous image.  From a computers point of view, a bitmap image is a rectangular grid of pixels, each pixel is a numerical description of its composite colour on the Red, Green, Blue or RGB Scale.  The number of levels of each colour in a pixel is not fixed and is directly proportional to the size of the image - the more levels the bigger the image. For example a 16-colour bitmap stores 16 levels of ‘redness’, ‘greenness’ and ‘blueness’ for each pixel whereas a 256-colour bitmap stores 256, as a result the 256 colour image will contain 16 times more information per pixel.  Thankfully a number of compression and configuration techniques can be used to store a presentable image without have large unwieldy files.

 

GIF – Graphics Interchange Format

The particular method of compression used for this assignment was GIF or graphics interchange format, it operates by creating a colour scale specific to the image.  This allows it to discard unused colours and better describe the range of colours specific to the image.

This format also lends well to describing the technique of pixel depth reduction in order to reduce the size of an image.  By allowing the GIF to use more or less colours you can control the size of your image, but at the expense of image quality.

Take image 1 below, it’s a 300x400 pixel image 256-colour image.

Image 1

 

Now lets look at this image again but with only an 8-colour pallet

Image 2

 

While this image is a very web friendly 16KB (as apposed to the original 75KB) the reduction in image quality is unacceptable, it is no longer even possible to distinguish the horizon.

It is interesting to note how the computer can mercilessly remove the 97% of the colours, select 8 ‘best fit’ and still maintain a resemblance to the original image.

The key to using a compression system like GIF is to find the medium that best suits the image in question and the role it will fill. 

 

Dithering

Before we look at the relationship between file size and number of colours used, dithering must be mentioned.  Dithering is the scattering of pixels ether side of a transition between two colours so as to give the impression of a gradual change between the two colours.  The sky in Image 2 is distorted with colour ‘edges’, Image 3 is still an 8-colour image but the dithering gives a substantial improvement.

Image 3

Dithering gives the impression that there are more than 8 colours, it does however add a small amount of overhead, image 3 is 22KB a 25% increase over the undithered image. Thankfully however this is only as the file is quite small and as the number of colours increases; the size impact of dithering becomes less apparent.  Image 4 shows the percentage impact of dithering decreasing as the file size increases.

 

Image 4

 

 

Pixel reduction Vs file size.

By taking the original 256 colour image and gradually reducing the number of colours it was possible to examine the effect that pixel reduction was having on the image while keeping an eye on the file size.  Table 1 shows the results for both the undithered and dithered GIFs, I have also given each image a grade out of 10, 1 being the worst.  Click on the image size to see the image itself.

 

 

Colours

Image (UnDithered)

Size

(KB)

Grade

 

Image

(Dithered)

Size

(KB)

Grade

8

008noDith.gif

16.11

1

 

008Dith.gif

21.55

4

10

010noDith.gif

17.75

1

 

010Dith.gif

23.61

5

20

020noDith.gif

23.94

2

 

020Dith.gif

30.02

5

40

040noDith.gif

37.93

3

 

040Dith.gif

43.54

6

60

060noDith.gif

42.87

4

 

060Dith.gif

48.32

7

80

080noDith.gif

48.95

5

 

080Dith.gif

54.4

7

100

100noDith.gif

52.24

6

 

100Dith.gif

58.22

8

120

120noDith.gif

56.88

7

 

120Dith.gif

63.35

8

140

140noDith.gif

61.75

8

 

140Dith.gif

68.38

9

160

160noDith.gif

64.27

8

 

160Dith.gif

71

9

180

180noDith.gif

66.61

9

 

180Dith.gif

73.1

9

200

200noDith.gif

68.93

10

 

200Dith.gif

75.23

10

256

256noDith.gif

74.9

10

 

256Dith.gif

80.86

10

Table 1 – Click on the image name to see the image

 

The graph below in image 5 gives a visual representation of the data in the table above.

There is an interesting jump in the file size between 20 and 60 colours, there was also a substantial change in the appearance of the image at this stage.  I suspect this is due to the fact that the number of key colours in this image lies somewhere between 20 and 60.

 

 Conclusion

When taking advantage of today’s image rich medias such as the Internet, it is important to choose your content carefully, a slow loading web page can and will turn prospective customers away.  This assignment demonstrates one of the ways images can be edited and compressed so as to decrease their physical data size, it also shows that over compressing an image can reduce its quality to a point where the image is unsightly, this is also undesired.  The key to using this method is therefore to select your level of compression carefully, good quality with a manageable filesize.  I think the best balance for this particular image would be the 120 Colour Dithered image as seen at the top of this Webpage.

 

Hosted by www.Geocities.ws

1