Image Compression Experiments
a mostly black-and-white
|
This is the image used in the PNG, JPEG, GIF experiments below --- experiments in image-file-size-COMPRESSION versus image-QUALITY-preservation. |
! Note !
Text, images, file-size-data, or links may be adde
or improved --- if/when I revisit this page.
INTRODUCTION to the IMAGE EXPERIMENTS : This is a page of experiments in image compression-versus-quality. Images are shown, and text under each image explains how the image was processed. Before the images, a summary of file sizes is listed, at the bottom of this introduction --- along with some discussion of how one may be able to get relatively small GIF or JPEG or PNG image files while preserving (for the most part) the quality of the original, captured image. The summary of file sizes is followed by the images, along with some information about each image, underneath each image. If you want to examine the images --- for example, by magnifying them --- you can 'right-click' on each image to do a 'Save As ...' of the image file to your local computer. Then you can use image-viewing software on your computer to examine any of these images in detail. This page is a link on the 'parent' web page JPEG vs. PNG vs. GIF - quality vs. file size. The 'Introduction' on that page describes some of the considerations in compressing GIF, JPEG, and PNG files while preserving the quality of the original image (in terms of what the eye can see, without magnifying the image). See 'The bottom line' section of that page. It contains a summary of GIF-JPEG-PNG compression-versus-quality guidelines that were deduced from the image compression experiments in these web pages. The making of the images on this page : The images on this page were made from an 'original' image in a PNG file. That 'original' image-file was created by doing an 'entire-screen' capture (to a PNG file) when the cartoon was displayed in a web-browser window. The capture was done with the 'gnome-screenshot' utility. I then used the 'mtpaint' image-editor program to read the PNG file and crop the cartoon from the image of the entire screen. I saved the cropped image to a PNG file, from the 'mtpaint' program --- which creates rather large PNG files that can be compressed using a utility command like pngcrush. So the 'original' PNG file was made using the 'gnome-screenshot' and 'mtpaint' programs. Other, compressed image files (PNG, GIF, and JPEG) were made from this 'original' PNG file by using either
In a little more detail, the steps in making these images were as follows.
Below is a list of the sizes (in bytes) and names of the image files shown below --- sorted by size, largest files first. The filenames indicate the kind of conversion and/or compression that was done. |
File size results from various compression tests are listed below --- in file size order --- largest to smallest. The descriptive file names are quite long and have been 'folded' onto a second line. |
944,184 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482.png
(the 'original' PNG file)
PNG compression results:
293,029 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_CompressType00.png
272,725 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_pngcrushBRUTE.png
(This is the best LOSS-LESS PNG compression we
get. Converting to JPEG and GIF, below, give
smaller files sizes. Test images below indicate
that some of the JPEG and GIF files would be
acceptable -- no noticeable quality loss.)
PNG-to-GIF-and-JPEG results:
83,164 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_PALETTE256.gif
(256-color GIF ; no noticeable quality loss)
66,136 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_Quality92_SampFact2x2_
FilterMitchell_Stripped.jpg
(quality-92 JPEG ; no noticeable quality loss)
52,081 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_PALETTE64.gif
(64-color GIF ; no noticeable quality loss)
39,537 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_Quality70_SampFact2x2_
FilterMitchell_Stripped.jpg
(quality-70 JPEG ; still good quality)
31,904 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_PALETTE16.gif
(starts showing quality loss with only 16 colors)
31,336 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_Quality50_SampFact2x2_
FilterMitchell_Stripped.jpg
(very little quality loss)
22,336 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_PALETTE8.gif
(obvious color loss)
15,557 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_PALETTE4.gif
(obvious color loss ; text is getting ragged)
9,535 cartoon_minimumWage_maximumWage_gnome-screenshot_
fromMTpaintCrop_651x482_PALETTE2.gif
(obvious color loss --- just black and white remain)
PNG vs. GIF vs. JPEG : Note that we achieved the maximum loss-less compression of the PNG file to another PNG file with the '_pngcrushBRUTE.png' file --- created with the 'pngcrush' command with the '-brute' option. We also created a PNG file several times smaller than the 'original' by using the ImageMagick 'convert' command with a '-quality' compression parameter of '00'.
For the PNG '-quality' parameter of 'convert': The first digit (tens) is the zlib compression level, 1-9. However if a setting of '0' is used you will get Huffman compression rather than 'zlib' compression, which is often better! The second digit is the PNG data encoding filtering type (before the data is compressed): However, we can get still smaller files, than these PNG files, by allowing some 'lossiness' --- by going to GIF files (with a max of 256 colors) or by using the 'lossy' compression inherent in creating JPEG files. On GIF : Since this cartoon image is composed primarily of several solid colors (mostly black and white --- with some blue in the sky and some beige on the seat cushions), we can expect to preserve most of the original image if we convert the 'original' PNG file to a GIF file of less than 256 colors. In fact, it turned out that for this image, we could even go down to 16 colors and still get a GIF file that was quite close in appearance to the 'original' PNG file from which it came. (We could try converting the 'original' PNG file to PNG files with a restricted number of colors --- such as 256 or 16 --- but if we are going to do that, I would rather use GIF --- since it has been supported by web browsers for about 10 more years than PNG --- and there may be some cases of software not reading certain types of PNG files.) On JPEG : Note that when text fonts (in a quite contrasting color to their background) are in an image, the 'lossy' compression of JPEG typically introduces 'mosquito noise' around the text characters --- especially when we use a 'quality' value lower than the range of 100 to 92 for the 'convert' command. But in this image, there are no high-contrast text characters --- so we do not have to be so concerned about introducing 'mosquito noise' when converting the 'original' PNG file to a JPEG file of 'quality' less than 92. These JPEG files do NOT show appreciable 'mosquito noise' --- even when we go down to a '-quality' value of 50. On choosing a file-type : For this particular image, IF file size was my main concern (for example, if I were posting the image on a web page along with a lot of other images), I would be tempted to use a JPEG file of 'quality' 70 (or even 50) rather than use the loss-less, maximally-crushed PNG file. Those JPEG's would be about 7 to 8 times smaller than the loss-less, maximally crushed PNG file. Alternatively, I would use a GIF file with about 16-colors --- because its size and quality compare favorably with the JPEG's that were created with '-quality' of about 70 to 50. To me, it would be almost a coin-flip whether to use the JPEG-quality-50 or the GIF-colors-16 image file of this cartoon. If it proved to be the case that a GIF file would load into a web page faster (or with less CPU processing) than the JPEG file, then I would probably choose the GIF file. Below are the images. Judge for yourself. |
(Click on these images to see the image
in a separate window or tab.)
The 'original' cropped PNG file from
'gnome-screenshot' and 'mtpaint'.
File size: 944,184 bytes
(The 'mtpaint' image-editor saves to
a rather large PNG file.)
PNG from 'convert -quality 00'
File size: 293,029 bytes
PNG from the 'pngcrush' command
with the '-brute' option.
File size: 272,725 bytes
About 3 times smaller than the original PNG.
GIF from 'convert -colors 256 +dither' (no dithering).
File size: 83,164 bytes
About 3 times smaller than the maximally-compressed PNG
via the 'pngcrush -brute' command.
JPEG from 'convert -quality 92 -sampling-factor 2x2 -filter Mitchell'
File size: 66,136 bytes
GIF from 'convert -colors 64 +dither' (no dithering).
File size: 52,081 bytes
JPEG from 'convert -quality 70 -sampling-factor 2x2 -filter Mitchell'
File size: 39,537 bytes
GIF from 'convert -colors 16 +dither' (no dithering).
File size: 31,904 bytes
JPEG from 'convert -quality 50 -sampling-factor 2x2 -filter Mitchell'
File size: 31,336 bytes
GIF from 'convert -colors 8 +dither (no dithering).
File size: 22,336 bytes
(Here you can see a definite degradation
of the image. It appears that we need more
than 8 colors to get an image whose quality
is near that of the 'original' PNG file.)
GIF from 'convert -colors 4 +dither' (no dithering).
File size: 15,557 bytes
(NOTE:
Lines on the back of the seat cushions are
degrading. Also edges of the text have
become 'harsher' --- not so soft.)
GIF from 'convert -colors 2 +dither' (no dithering).
File size: 9,535 bytes
(NOTE:
The text has become quite 'harsh'.
All color, even grays, have disappeared.
In this 2-color image, only black and white
are left. This is a pretty unacceptable image
--- unless you really need to save about
20 kilobytes versus a nice 30 kilobyte file above.)
MORE IMAGE EXPERIMENTS : Some other PNG-JPEG-GIF compression-versus-quality experiments (using different image types) are available from the 'parent' page of this page --- the JPEG vs. PNG vs. GIF - image-quality vs. file-size page. |
'External' WEB LINKS to other JPEG/PNG/GIF info : For more information on image file quality and compression issues, for JPEG and PNG and GIF files, you can try the following WEB SEARCHES on the indicated keywords. You may wish to change or add keywords to these queries in order to hone in on answers to your particular questions. |
Bottom of this page of
To return to a previously visited web page, click on the
Back button of your web browser a sufficient number of times.
OR, use the History-list option of your web browser.
< Go to Top of Page, above. >
Page history:
Page was created 2015 Feb 03.
|