Compressing images - how to

21 years ago

Hi

With so many wonderful images being posted here, it's important to remember that, if they are too big, it will take a long time to download for those members with dial-up connections. No fun at all!

I'm going to post this in several forums - we should probably put together a FAQ on this, however that's done. Web graphics is a huge subject area, but it doesn't have to be all that complicated.

This is a lot of stuff - if you reduce the width of your browser window it may be easier to read.

Hopefully, you will find this helpful.

File Compression

When images are scanned or downloaded from a camera, they are often in a high-resolution format that is unsuitable for the web (or for emailing) simply because they are too large or because they are of the wrong file format. (You do want a high resolution for printing purposes, though, so always, ALWAYS, keep a "good" copy before you do anything to an image)

There are many ways to enhance and improve images, depending on your skill with image editing programs but, most fundamentally, you may want to:

change to overall physical size of an image (how large it is on the screen), and

add a little compression to reduce its file size (in kilobytes, this affects how long it takes to download).

How you do this depends largely on which program you have on your computer. Your camera or scanner may have come with some software, you maybe using Microsoft Image Editor, or you may have something more sophisticated, such as Photoshop or Photopaint. The "Paint" program that comes with Windows is not unsuitable.

So let's say you have an image of a pretty flower. Let's say it came off your camera at about the size of your visible screen and a megabyte in size (1,000kb). Way too big.

First, do what you will with your image (colour correction, sharpening etc). Then look at it critically to see if it could stand a little cropping to get rid of unneeded bits and pieces.

See the images below. One image might be selling a house, the other is about driveway paving. Decide what is important about your image and crop it down. (artistically, of course, keep composition in mind. Single items often look better slightly off-center, horizons generally don't go in the center of the image etc)

Now you've taken the first step toward reducing download time - your image is a bit smaller.

Now you can resize it: change the overal size of the image to something that fits comfortably onto people's monitor. Larger images tend to look nicer, but you will have to give up some impact for fast download.

Tip: Low contrast images tend to compress better into smaller file sizes than images with sharp contrast between light and dark areas. So if your image doesn't have a lot of strong colour changes or light/shadow, you can "afford" to keep it a little larger.

Also keep in mind...

Sort by:Oldest

Comments (9)

rosemariero
21 years ago
Chris, thank you SO MUCH for taking the time & effort to give us this lesson! I will try to make use of it...practice, practice, practice! I appreciate you sharing your knowledge with us!

Would you advise use of clickable thumbnails as a good alternative? I have found a few people who couldn't see the thumbnails due to their firewall (maybe?), though.

I made the mistake of compressing/resizing/resampling without keeping a copy of the original & then, when I wanted to make a large print I was unable to get a quality pic. :( Live & learn to SAVE your original elsewhere!

~Rosemarie
Herb
21 years ago
All that is good advice, but for just compressing a picture file, Jpeg Optimizer is also very easy to use. You can download Jpeg Optimizer from this site - Click here
Related Professionals
Salisbury Landscape Architects & Landscape Designers · Waterbury Landscape Architects & Landscape Designers · Bloomington Landscape Architects & Landscape Designers · Mankato Landscape Architects & Landscape Designers · Oshkosh Landscape Architects & Landscape Designers · Paducah Landscape Contractors · Montgomery Landscape Contractors · Magnolia Landscape Contractors · Florence Landscape Contractors · Morgan City Landscape Contractors · Saint George Landscape Contractors · Selma General Contractors · Kansas City General Contractors · Johnson City General Contractors · Chula Vista General Contractors
shrubs_n_bulbs
21 years ago
I save every image with a jpeg quality setting of 70, just for convenience. A typical photo looks great at this setting (check out any of my posts, I think the image quality is good) and the size is suitable, but there are subtle imperfections from the compression. Look at the second picture to see what happens to narrow lines and sharp edges of colour in JPG files (image saved at quality setting of 70).

{{gwi:2101266}}
chris_ont
Original Author
21 years ago
This is where you need to save as GIF instead of jpg, Shrubs. Flat colours (colours without gradients) like this map work better as gif and still give you a decent file size.

The first image here is a gif file, at 29 kb, which is a reasonable download (although physically too big for people with low-rez monitors - they will have to scroll)
The jpg (right) is not very good and is a larger file (45 kb!). The opposite is true for photographic images.

Therefore: photos=jpg, drawings=gif.

(yes, there are exceptions, but that just gets complicated :)
C.
shrubs_n_bulbs
21 years ago
Chris, are you running at 1600x1200? I didn't think anyone would be able to see the two images side by side! But the artifacts were not so clearly visible on smaller images.
cheerpeople
21 years ago
Chris,
I want to thank you for the excellent lesson. I am with Rosiemarie and you on the ALWAYS SAVE a good copy. Man, I wish I'd read this a few years back...

I learned some new things.THX, Karen:)
iris_gal
21 years ago
Nice post Chris. My order is different.

Crop-resize first. In that order.
Color/bright-dark adjustments next.
Sharpening.
Saving with specific compressing chosen.

A trick for beginners having trouble with file size: when shooting a flower specifically for posting I get some distance away - perhaps 6 feet. When I crop the flower in the image the resulting file is sometimes around 80Kb, if I've done it right, and doesn't require compression.
jeff_al
21 years ago
the image-hosting site of photobucket has a feature that allows you to do this, too, but your options are limited to 25, 50 and 75 percent of the original size (kb).
ahmed emad
3 years ago
nice website, i see different websites that present compressing image service and like https://www.compressorjpg.com/ because have ability to reduce image size exactly you want and optimize it.