JPG Compression - The Bandwidth Saver Article

It's time for something a little different. Instead of the usual PC product review, today Cameron "Mr.Tweak" Wilmot has written an article for webmasters and site owners showing how they can significantly reduce the amount of bandwidth they use by compressing JPG images, one of the most common formats for web images. If you own a website and don't yet have knowledge in the field of JPG compression, you should find this very interesting indeed - Save money on bandwidth and please viewers at the same time with quicker loading webpages.
| Apr 19, 2002 at 11:00 pm CDT
Manufacturer: none

JPG Compression - Introduction

IntroductionAs a webmaster, I'm always looking for new ways to reduce the total amount of bandwidth (website data being requested by client and sent from server) our website uses to save money on what can be expensive monthly hosting bills.Unfortunately, we no longer have the luxury of unlimited outbound bandwidth like past years. This can be attributed to several reasons; firstly we draw a quite a bit of traffic, as a result we no longer use a shared server but our own dedicated servers which obviously means we no longer use free servers, like in the early days of our existence. If you want a website which is going to be up and accessible 24 hours a day, like we try to maintain here at TweakTown, you have to pay for it - and this usually includes outbound bandwidth transfer. Because of this, webmasters spreading the globe have to continually look at new ways of reducing the amount of bandwidth their websites use for the simple reason, bandwidth is not cheap. Being a tech site, we include a lot of JPEG (or JPG as they are also known as - I will refer to JPEG as JPG in this article. "JPG" is the three letter DOS extension of JPEG) images in our content, which is one of the biggest elements of our website that draws the most amount of bandwidth.As a side note, a new version of JPG is currently being developed, currently dubbed JPEG2000. This new version of JPG is apparently set to improve the current JPG compression making images load quicker by improved compression methods. According to the JPEG2000 website: "The JPEG 2000 initiative is intended to provide a new image coding system using state of the art compression techniques, based on the use of wavelet technology. Its architecture should lend itself to a wide range of uses from portable digital cameras through to its use in advanced pre-press, medical imaging and other key sectors."I've written this basic article for webmasters and site owners showing how they can significantly reduce the amount of bandwidth they use by compressing JPG images, one of the most common formats for web images. While we don't normally publish web development type content like this on our site, looking around at various sites, I thought this article may prove to be useful for some. This article was not intended to be read by experienced webmasters with knowledge in the area of JPG compression, but webmasters who don't know how to tweak images by compressing them down thus saving incredible amounts of bandwidth and decreasing page load times, yet maintaining image quality.

JPG Compression - JPG Compression, a wonderful commodity

JPG Compression, a wonderful commodityJPG images are good when it comes to compression. The best lossless (image quality) compression for photographic based JPGs I could achieve was 2:1 with no effect on image quality. I found most photographic based JPG images can achieve a compression ratio of anywhere from 10:1 to 25:1 - without visible loss in image quality. Although when trying to compress non-photographic images, such as screenshots from Windows, the loss in image quality becomes more noticeable than ever.The first image below is the original image (2:1) and the image below it is has been compressed to a ratio of 25:1 using Paint Shop Pro 7 by Jasc Software - I'll explain how to physically compress images shortly.Original Compressed Image (2:1) - 61.3kb
Highly Compressed Image (25:1) - 16.7kb
As you can see from the 25:1 compressed image above, there is really not much of a difference in terms of image quality from the original image at 2:1 - but a save of 44.6kb in file size. Consider this as a practical example - a new piece of content you post has ten images in it, for simplicity reasons at 63.2kb each (632kb in total), we save a total of 465kb, seemingly not a great deal on an individual basis.Now say 2000 different people read that same review uncached, we save a total of roughly 908mb in outbound data bandwidth for that single review. If 5000 people were to read that review, we are talking gigabytes of bandwidth which can be saved through compression, 2.27gb to be exact. I'll let the stunning numbers speak for themselves. The only time you really notice the compression is when you zoom in on images, but since JPG images on the net are usually static, this is not an issue we have to worry about.

JPG Compression - Compressing through Paint Shop Pro 7

Now I've shown you the benefits of compressing JPG images, I figure some of you may need a bit of guidance on how exactly it is done since many programs don't have a real emphasis on this area.While there are several programs you can use to compress JPG images (and other formats for that matter), I choose to use Paint Shop Pro (PSP) 7 by Jasc Software for the simple fact I already had it installed on my system and after trying a few different programs I found it to be one of the most easiest to use, as well it is one of the most popular graphics editing programs around. You can download a 30-day trial copy of Paint Shop Pro 7 from the Jasc Software website.Step 1 - OK, so you have your JPG image open in PSP, click Save As like you usually would, which brings you to this screen:
Instead of just saving the image as you normally would, click Options.Step 2 - This will bring up a new window as shown below, click Run Optimizer to give us a more detailed idea of what we are doing.
Step 3 - In the image below, this is where we optimize the JPG image.
The shot on the left is the original preview (what it would look like if you saved it usually with no optimization), on the right is a preview of what the optimized image will look liked when saved.You can set the compression value ratio, as seen above, anywhere from 1:1 to 99:1. In this example, I used a compression ratio of 25:1 - Increasing the ratio anymore I found images began to loose quality. However, experiment with this value - You may be able to compress certain images more than 25:1 or if the image doesn't look right, you may have to reduce under 25:1 to maintain quality - The sweet spot shouldn't be too hard to find.

JPG Compression - Conclusion

I hope this short article has been helpful and interesting to those who didn't know much about JPG compression before reading. If your website is based heavily around JPG images which aren't yet compressed, you should be able to halve your bandwidth usage per month, at least. Remember though, there are also a cavalcade of GIF optimization programs out there if your website has a focus on GIF images more so than JPG, a Google search proves this.I didn't set out to put hosting companies out of business by posting this article, but the facts are simple - with the way the advertising dollar is right now, us webmasters need to do everything possible to cut back on costs while maintaining quality websites, and in this case, image quality.If you have any comments or other suggestions about saving bandwidth, please leave your comments in our Application & Web Development forum.

Last updated: Apr 7, 2020 at 12:25 pm CDT

PRICING: You can find products similar to this one for sale below.

USUnited States: Find other tech and computer products like this over at Amazon.com

UKUnited Kingdom: Find other tech and computer products like this over at Amazon.co.uk

AUAustralia: Find other tech and computer products like this over at Amazon.com.au

CACanada: Find other tech and computer products like this over at Amazon.ca

DEDeutschland: Finde andere Technik- und Computerprodukte wie dieses auf Amazon.de

ABOUT THE AUTHOR -

Cameron founded TweakTown in 1999 after it originally started off as his personal homepage. Cameron was once, many years ago, the only person at TweakTown producing content, but nowadays, he spends his time ensuring TweakTown operates at its best in his senior management role.

We openly invite the companies who provide us with review samples / who are mentioned or discussed to express their opinion. If any company representative wishes to respond, we will publish the response here. Please contact us if you wish to respond.
Go to top of the page