Saving in JPEG, Quality Levels, and Previewing Your Compressed Image in Sagelight

Image Pasted from Clipboard2

Introduction

When saving out to a JPEG in Sagelight, you can easily preview how the image looks as a compressed JPEG at the current quality level settings, both from a general look-and-feel viewpoint, as well as a close-up inspection of the image details.

It’s as easy as pressing the Preview Compressed Image button in the JPEG Save Function.  Pressing this button will show you how your image will look when it is reloaded or displayed on the web or your computer at the current quality level settings.

A Brief Introduction to JPEG

If you’re familiar with JPEGs, skip this section.

JPEG, which stands for Joint Photographic Experts Group, allows an image to be compressed in a way that is typically undetectable by the human eye.  It allows images to be displayed on the web at a fraction of their original size with either no apparent loss of quality, or a loss of quality that is acceptable to the human eye – that is, it doesn’t look blocky or edgy, and degrades in a way that keeps the lost details looking more-or-less natural.

The reason a 50 Megabyte image can be saved to a size of less than 1 megabyte while still looking great is because the image is compressed, and not all information is saved – much of the high-frequency (i.e. sharp) details are simply thrown out.  In other compression methods, such as TIFF LZH, no image data is lost. This type of compression is called “lossless compression”.

With JPEG, image data is thrown out via lossy compression, which allows extremely small file sizes compared to the original, but still with great detail.  Most of the time.

Deciding on the right compression ratio can cause problems, and JPEGs can often lose too much detail, especially if there is a chance you may edit them again, or you want the image to look as great as possible while still shrinking it down to a suitable size for the Internet or your personal storage after editing (which Sagelight uncompressed in memory, and must be re-compressed in lossy-compression form before being saved again as a JPEG).

 

Image Pasted from Clipboard2_edited

The JPEG Save Function Window

When you save a JPEG, you are presented with the above JPEG Options window.  The numbers 0-9 and Best setting are the quality levels of the JPEG compression; the lower the numbers create more lossy compression. Less information in the image is stored in the file with lower settings, causing more image degradation, often visible and sometimes distracting.

The “File Size on Disk” value shows you how many kilobytes the image will require on disk at the current quality level, and this number is recalculated each time you press a new quality level option.

You can optionally include any ICC color profile (i.e. Adobe, Pro Photo) that was attached to the image when it was loaded.  If you are saving for the web, however, it is better to leave this value unchecked.  When unchecked (or this option is not presented), Sagelight save the image in sRGB color space, which is the standard for the Internet.  Saving in any other color space will – most of the time, depending on the browser and the individual website on which the image is displayed – cause the image to look much more plain than it actually is in reality.

(The above image is a screenshot of the settings used to save the main image.  I should have unchecked the “Include Color Profile” option, as there is rarely any reason to save an ICC profile out to a JPEG – another subject for a blog post)

Using the Preview Compressed Image Button

Before saving, you can see how the image will appear once reloaded or viewed as the saved JPEG with the current quality settings – that is, how degraded the file in which the image is stored will store the data, and how it will be retrieved – you can always save out to two images, one with a lower setting, and another with a higher quality or as an uncompressed 16-bit tiff (which is always the best option for storage, where JPEG is the best option for your final image).

Press and hold down the Preview Compressed Image Button to see the image as it will exist in the saved file.

The preview works the way it does so that you can zoom in and out, and move around in the image.  This allows you to see how the image will look generally, but also zoom in at up to 1500% to inspect various areas of the image.

In many cases, especially with higher quality level settings, the eye detects no difference in the images.   Pressing and Unpressing the Preview Compressed Image button will sometimes slowly reveal some visible degradation as the eye becomes accustomed to the subtle differences between the two images.  At levels of 8 or above, image degradation is usually not visible, where below 8 it starts to become visible at a much higher rate.

Some degradation is fine, and for Internet, storage, or viewing purposes, it doesn’t hurt the viewing experience.  But, when saving for utmost quality or there is a chance the image may be re-edited, it is better to save in the Best quality setting, even though it takes more space on disk. As mentioned, for images that are in-progress or may be returned to at some point, it is better to save as a 16-bit per-channel .TIFF, as there is no image degradation at all.  Even at the ‘Best’ setting with the JPEG option, many loads, saves, edits, and reloads will start to show some problems, such as artifacts and banding.  However, small edits and fixups here and there are usually fine when an image is saved as a JPEG at very high quality.

Quality Level Rules-of-Thumb

The basic Rules of Thumb for saving images are as follows:

  1. If you’re saving for long-term storage, or to re-edit, use 16-bit TIFF or greater.

For JPEG Saving

  1. Best Setting. Highest Quality, Nearly Lossless.  Best for the ability to re-edit and re-save the images.  Takes about 2x the space as the next setting
  2. Setting 9. Very High Quality, still nearly lossless, but not as much as the ‘Best’ Setting.  Useful for re-editing, and web usage.
  3. Setting 8. High Quality.  Minimum recommended setting for high quality images. Great for web uploading and personal storage.  Slightly lossy, but not very noticeable.  Not as good for later re-editing.
  4. Setings 6-7. Medium Quality.  Best used when space is a factor, and you want a lower file size.  The images will still look great, but some noticeable loss in quality will be present.
  5. Settings 3-5.  Low Quality.  Not terribly useful for display presentation.  Useful mainly for specific purposes.
  6. Settings 0-2.  Very low quality.  Can be useful with some very large images to keep space down.

Saving Images with Very Large Dimensions in Lower Quality Settings

In some cases, the lower-quality settings can be useful for images with very large dimensions.  Large images are often displayed at smaller sizes, and this will cause the artifacts to basically disappear.

Most of the time, it is better just to resize the image and then use a higher-quality JPEG settings.  However, there are times when it makes sense to keep the original dimensions, such as a large printing job, where the mathematically natural degradation inherent in a low-quality JPEG can keep the overall perceptual sharpness (when viewed as a very large print, for example); shrinking the image, saving at high quality (even lossless .TIFF) and then sizing it up will cause it to look blurry.

 

Exploring Different Preview Settings

Here are some before & after examples, where the image was set next to the original, for comparison purposes – in a real-time editing session, you can toggle the Preview Compressed Button to get a more direct off-on-off-on style overlay, which usually presents a more dramatic before-and-after experience than side-by-side.

The Best Setting

Image Pasted from Clipboard3

With the Best setting, you can see there is basically no difference in the before and after.  This image was originally loaded as a JPEG and, therefore, there are already artifacts from the previous save (at lower quality), and the Best Setting preserves all the details – original and artifacts from a previous lossy Jpeg Save.

A Quick Pass with the Sagelight Noise Reduction Tools will take care of the noise in this image prior to saving. 

Note the file size is 899k

Setting 8 – High Quality, a Little Degradation

Image Pasted from Clipboard4

Setting 8 is the minimum recommended setting for high-quality JPEGs.  Below this setting, the image tends to degrade visibly, and such lower settings should only be used when you are specifically saving for lower space requirements.

In this image, the image is clearly starting to degrade just a little.  In most cases, this is not an issue.  When saving for the web, printing, or personal storage, the artifacts are rarely noticeable or make a difference.  In this particular case, we have the advantage of seeing the before and after images next to each other.  Without the original next to it, the image degradation would only be noticeable to those who specifically look for it.

Note the file size is 207k, much smaller than the maximum.  For the web, printing, or display level 9 is also a great option, as it keeps the file sizes smaller than the ‘Best’ level, and also keeps the quality a little higher.

Level 3 – Very Degraded, but Small File Size

Image Pasted from Clipboard5

With this image, saved at the ‘3’ setting, there is clear and obvious degradation to the image, to the point where it would be distracting to look at.  This is presented here as an example, and it is never recommended to save at this image except for the specific reason to keep the file size small.

Note: This setting (i.e. 3, low quality), while creating distracting edges, also cleared the grain noise in the middle of the image.  In case you’re wondering, this is the basis of DCT noise removal; Jpeg and DCT noise reduction use the same base DCT algorithm. 

Note the file size is 61k

Level 0 – Lowest Quality, Highly Degraded

Image Pasted from Clipboard6

This image is included just to show an example of how JPEG degrades your image.  The degradation is clearly visible in this image, and wouldn’t be worth saving under normal circumstances.

With a file size of 36k, it’s hardly worth the 50% savings over the level 3 setting.

Conclusion

When saving a JPEG image in Sagelight, you can see a preview of the saved image before you commit to saving it.  Pressing the Preview Compressed Image button will overlay the current image with the image as it will be saved to disk.  You can use this button as a before/after toggle, or use the side-by-side format in Sagelight.

You can see how the image will look as a general image, or use the Image View controls to zoom in and move around the image for close inspection of details.

Using values of 8 or more are the best settings for saving out to the web or for personal storage, and the Best Setting or 16-bit tiff is recommended for long-term storage or re-editing.

Sagelight JPEG Level 8 is the recommended minimum setting for maintaining visible image quality, and levels 6-7 are useful to conserve space while keeping still keep image quality at an acceptable level. Levels 9 & Best (as well as 16-bit TIFF, which is recomended) are ideal for storage and can be used to re-edit the image later without causing the image too much harm for later editing. 

Levels 5 and lower aren’t recommended for viewing, but can be useful for websites or other areas where you want to conserve space.

While the highest setting (i.e. Best) takes up the most space, up to 3x of level 8 and 2x of level 9, it is nearly lossless and captures the highest level of detail, while still taking the fraction of the space of the uncompressed original.

Advertisements

One thought on “Saving in JPEG, Quality Levels, and Previewing Your Compressed Image in Sagelight

  1. I would be interested in learning more about converting images to black and white. Also, ways to achieve different looks in black and white. Also, guidance on establishing presets with Sagelight would be appreciated.

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 )

Twitter picture

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

Facebook photo

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

Google+ photo

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

Connecting to %s