Sizing your image for the web - DPChallenge Forums

Canon EF 24-105mm f/4.0L IS

05/17/2003 02:20:00 PM · #1

I've noticed that several photos in the latest few challenges are very small, so I'll share my way of getting them the right 'size'. There are probably other ways, and I'd like to see them, too.

This will be 'for' Photoshop; I hope others will post methods 'for' other applications such as Paint Shop Pro.

Step 1: Import your photo into Photoshop and make adjustments as desired (dark/light balance, hue/saturation, etc.). SAVE IT AT THIS TIME.

Step 2: select "Image 'Size'..." from the Image Menu. Make sure "Constrain Proportions" and "Resample Image: Bicubic" are selected.

Step 3: In the Pixel Dimensions boxes, change your longest photo edge to be 640 (the DPC maximum) and then select "OK."

Step 4: Use the Unsharp Mask filter, if desired at this time (this one was new 'for' me!--I always did it before resizing).

Step 5: In the FIle Menu, select "Save 'for' 'Web'..." Usually, four options of your photo will appear. Just select the best one, no matter the file 'size' (which must be under 150k).

Step 6: Under "Settings" select "JPEG" and "Maximum." You can see the file 'size' just under the photo you've selected.

Step 7: Adjust the Quality box until the file 'size' is under 146K (it always adds a couple of K). Then select "Save," rename your file 'for' the 'web'.

You are now done! Yay! And you have two files now: your original file that is large that you saved in step #1 (from which you can make a print) and your 'web' version, which is smaller, grainier, and not as good, but is optimized 'for' the 'web'.

Other notes:

'For' all intents and purposes, the internet only displays 72 dpi, so there is no need whatever to save your 'web' file at any greater dpi. If you save it at 300 dpi, 'for' example, it will still only display it at 300 dpi, and your image will need to be much smaller because of memory 'size'.

'For' changing sizes 'for' prints, see these tutorials:

//www.dpchallenge.com/tutorial.php?TUTORIAL_ID=8
//www.dpchallenge.com/tutorial.php?TUTORIAL_ID=10

And this tutorial 'for' Paint Shop Pro:

//www.dpchallenge.com/tutorial.php?TUTORIAL_ID=15

Good luck! I hope to see other methods, if mine doesn't give me the best 'web' image possible.

Message edited by author 2003-06-27 14:08:04.

MikeO

Fujifilm x100

05/17/2003 05:36:59 PM · #2

Thanks 'for' that - I have had trouble with a couple of images - too small etc.

margem

Minolta DiMAGE 7Hi

05/17/2003 08:10:38 PM · #3

I was one of the postage sized people. Another thing to add, is don't wait till the last minute to submit or when you are so tired you can't think straight. I did both and manged to shoot myself in the foot by "cramming 'for' the big one" or waiting till the last minute to submit. I had caught my mistake and fixed the file 'size' by creating a new file and still managed to upload the wrong file. That's life.

zeuszen

Canon EOS-1Ds Mark II

05/17/2003 09:55:59 PM · #4

Sizing photos 'for' the 'web' using a Mac, OS X Jaguar, with iPhoto and Graphic Converter

1. Import photo into Graphic Converter and fine-tune edits not yet achieved in iPhoto (Sharpen, Channels etc.) via the Picture and/or the Effects menu.

2. Select Scale from the Picture Menu > 'Size'. Select either Width or Height (whichever is the larger dimension) and enter 640 Pixel. Make sure the Scale Picture, Keep Proportions and Use High Quality Scaling boxes are checked. Do NOT make any additional adjustments under ''Size'' here. The default resolution should remain at 72.0 'for' both x and y. Click OK.

3. Select Save As in the File Menu. In the Save dialog box JPEG (not JPEG 2000!) should be selected by default. Check the box labeled ''Web' Ready (without resource)'. Click Options.
If the File 'Size' box is checked, the 'size' will be indicated to the right of it. Move the slider 'for' Image Quality to the closest value to 132 KB (usually somewhere between 89 % and 96 %). (Up to about 18 KB may be held in latent data under OS X). Click Save. -Done.

Little Caveat: Remember to save with a file name that adheres to cross-platform conventions, i.e. without spaces and/or odd symbols in it. Do not make the name overly long either. Windows machines will not be able to read them.

Tamron AF 28-300mm f/3.5-6.3 XR Di LD Aspherical IF for Canon

05/18/2003 12:42:25 AM · #5

Just bumping this in case it is needed....

cykhansen

Canon PowerShot G1

05/18/2003 09:34:15 AM · #6

My steps 1 to 4 are the same as yours, dsidwell, but instead of
Step 5: In the FIle Menu, select "Save 'for' 'Web'..." etc.

I simply save as, change the filename and save as High (not maximum). That always seems to get me under 150KB, and often under 100KB. However, I haven't tried your method. I plan to do that to see if it will give me better results.

Asexaul duck

Toshiba PDR-M81

05/18/2003 12:32:53 PM · #7

That mucho helped. tsankyou

sher

Canon EOS-300D Rebel

05/18/2003 01:05:12 PM · #8

Originally posted by cykhansen:

i used to save my photos the same way, cyk...just as "save as". i find i can get a lot closer to the 150kb 'size' if i use "save 'for' 'web'". the closer you can get to that 'size', the better it is...it keeps your photo from having the "jaggies" (technical term :P)

:D

Nikon AF Nikkor 50mm f/1.8D

05/19/2003 08:10:40 PM · #9

I'm bumping this because I've received several privat messages from folks looking 'for' it.

frisca

Nikon D70

05/19/2003 08:50:37 PM · #10

david..is there a way to make this a tutorial? That would certainly preserve the information in it.

06/27/2003 02:06:07 PM · #11

Bump.

I've noticed several small images in recent challenges. It would be nice to have other software methods here too as zeuszen has done above.

byetko

Canon EF 70-200mm f/4.0L USM

06/27/2003 05:34:23 PM · #12

The way I do it in PS7 I go to "save 'for' 'web'" and theres a small arrow near the right 'size' where you can optimize and set the file 'size' to 150k.

MarkS224

Canon EOS-300D Rebel

06/29/2003 09:48:52 AM · #13

OK, I've saved 'for' the 'web' as per Dsidwell's PSE2 instructions and my print 'size' is 3.7" x 3". This stills seems pretty small. Is this OK sized or too small?

Mark

kavamama

Panasonic DMC-FZ10

06/29/2003 09:57:22 AM · #14

Somebody check me if I'm wrong, but couldn't a high resolution reduce the 'size' of the photo if the end result sought was 150k? I use (easy because that's how they come out of the camera) 72 pixel/inch resolution 'for' uploading to dpc.

MarkS224

Canon EOS-300D Rebel

06/29/2003 10:13:20 AM · #15

Thanks , that got it better. 72 DPI it is!

David Ey

Nikon D80

Nikon AF Micro-Nikkor 60mm f2.8D

06/29/2003 10:41:55 AM · #16

Are you forgetting about Image>Image 'size' where you set the number of pixels (640x480 max)? Do this BEFORE you save 'for' 'web'. This sets how large the image appears on one's screen. Then when you save 'for' 'web' you change the file 'size' to 150K max. This effects the quality of appearance on the net.
You can also set the resolution here too but I don't think it has anything to do with viewed quality on a monitor, only on a printed photo. Actually I think your printer overrides this setting too 'for' quality of print.

Originally posted by MarkS224:

OK, I've saved 'for' the 'web' as per Dsidwell's PSE2 instructions and my print 'size' is 3.7" x 3". This stills seems pretty small. Is this OK sized or too small?

Mark

Message edited by author 2003-06-29 10:46:08.

04/07/2004 10:55:49 PM · #17

Bump.

Looks like some of us need this again.

Prof_Fate

04/07/2004 11:52:44 PM · #18

Originally posted by kavamama:

PPI/DPI have no relationship to anything regarding a monitor and 'web' 'resolution'. When printing, then the dpi has a direct relationship to the 'size' of the print.

'For' example, my monitor has a physical display 'size' of 13.25" wide. I am running 1024x768 resolution. so across my screen the 'dpi resolution' is 77.28. However, with a click or two i can make that 800x600, so the resolution is then 60.37. or i can go 1600x1200, so then i have 120.

The picture is 640 pixels wide. that does not change, so on teh above examples, teh pic would measure on my monitor:
10.6 inches wide, 8.28 inches wide or 5.3 inches wide.

YOU have no control over my screen setting, and no matter what resolutoin you save your picture at, it will have no bearing on how it is displayed (it might if your software takes DPI and inches and does math to get teh actual file 'size' in pixels. PS does not do that)

'for' more info see scantips.com

Olympus 14-54mm f/2.8-3.5 Zuiko Digital Zoom

04/08/2004 07:49:01 PM · #19

Originally posted by bestagents:

scantips.com

Interesting stuff, Chris. Of course, now I have no idea what to do anymore . . .

kposey

Sony DSC-P50

08/11/2004 05:37:00 PM · #20

I use IPhoto Express. If I shoot a picture at 640 X 480 it shows a resolution around 150, which is fine. But if I change anything, say lighting or contrast, and save it the resolution is reduced to about 50. How can I keep the resolution up?

Thanks.

TomH1000

Olympus E-3

08/11/2004 05:45:31 PM · #21

Originally posted by dsidwell:

Step 4: Use the Unsharp Mask filter, if desired at this time (this one was new 'for' me!--I always did it before resizing).

I feel this step is very important. When you downsize you loose some of the sharpness so adding a little at this point brings the pop back into the image I think.