CS Designs Image Compression Tutorial




Image Compression: I'm always a little hesitant to suggest compression to people not too familiar with graphic formats especially those such as jpg which uses a lossless data compression. Jpgs are one of the formats that loses quality each time it is opened worked on and then resaved. If one is not careful the image can pixelate badly and look rather hideous. I am sure you have seen badly compressed images all over the web and they're not pretty. There are several re-size options available which lose very little quality if any. The images in my slide show are all re-sized, from very large photos using the smart re-size option in Paint Shop Pro, and have virtually no compression added. Gimp as well as many other programs also have similar options. Inkscape also produces very small png files.



My ATC "Mirrors of the Soul" above/right, has been re-sized and then compressed with an amount of only 1 which is the lowest compression available for PSP. It goes up to 99. Even though I have re-sized it, it is still a fairly decent image and quite adequate for viewing on a web page, yet the file size is only 81kb which is a very small file size and will load quickly.

Just to give you an example of file sizes, some of the photos I have been getting from some of you for the Fan Gallery average about 600 kb to over 1.3 megs a piece. On dial up a 1 megabyte file will take about 5 minutes to load, way longer than someone will be willing to wait, now add to this other images that may be on a page. Large files also put a strain on the resources of you computer and graphic intense sites with large files may cause someone's browser to hang up/crash.


A small photo does not necessarily indicate poor quality, that comes from the type of option you use to resize your image as well as the degree of compression you add. Some file formats handle compression better than others. Png is a much better choice than jpg and also allows for layers when you need them. Below is what compression actually does to an image.




Although the example image above indicates a file size of 256kb, it was a screen dump and the entire tag on the right is actually only 81.4 kb. a similar size to my Atc.