Saving for the web

[ksp]

Hello, please forgive me if I'm in the wrong forum as I see this one basically

talks to 'equipment'...I'm really looking for advice on the proper way to save

a file in PhotoShop 7 for a website?

 

I have been hired to shoot clothing for a company's new website and at first

their only stipulation was that the digital photo had to be saved at 100 ppi.

THEY would then take the jpeg and re-size it to 72 ppi with a width of 275

pixels by 430 pixels.

 

Recently, they mentioned that items like blouses & jackets, that have long

sleeves (therefore taking up more space on the sides of the photo) are causing

problems when they go to re-size for their website as the photos are being

stretched one way or the other and are therefore disproportionate (and/or

appear very small)! It has been driving me crazy trying to fix this problem! We

have been trying to figure out the problem between us but it seems that neither

side has the answer. They continually want me to re-shoot those items and I

keep telling them that I will have to charge them for this but unless I know

the 'fix' then there is no use in me doing this as it will waste my time and

their money!

 

Can someone help?? I have a deadline to meet for their upcoming ads!

 

I have two questions that need consideration:

 

1) Is this "my" issue to fix (i.e. in the way I'm shooting it - which is just

pinned flat, portrait (vs. landscape) - do I need to leave more room for

cropping, etc. on the top or sides? Typically, I get in as close as I can to

the sides of the garment and allow for cropping at the top if needed - should I

aim to leave more space on the sides? OR, is this their issue to figure out as

I am only paid to photograph it, not set it up for their website?

 

2) What is the "proper" way to save the file exactly as they need it for the

web? REQUIREMENTS being: 72ppi at 275 pixels by 430 pixels. Can someone provide

a step-by-step instruction as I have never had to do this before. I do

have 'some' clue as to how to do it but fear that I may be checking or

unchecking the "constrain proportions" and "resample image" boxes under either

IMAGE SIZE or CANVAS SIZE when I should / shouldn't be??

 

Any assistance would be very much appreciated!

 

Thank-you,

Ken

[mark pav]

Ken, it sounds like they don't know what they're doing.<br><br>

 

If you want to save a file at 275 pixels by 430 pixels and 72 pixels per inch, then you will

have to crop to that size if the photo is larger than this. Use the crop tool and at the top

of the screen there will be some spaces for you to type these figures in. Type in '275 px',

'430 px' and then 72 in each respective box.

 

<br><br>You will have to allow room for the pics to be cropped this way when you shoot.

Otherwise you can add empty space the the edges of the pics if they will allow that. So

figure out your proportions and then add some black or white (or whatever matches their

site) to the sides of the pic so that the pic is proportionate to the 275x430 dimensions

they've given you. Then you can reduce the image in size by going to Image>Image Size

and typing in these dimensions.

[Matt Laur]

Pixels-per-inch means nothing when an image is going to be displayed online. The ONLY thing that matters is how many ACTUAL pixels wide and tall the image actually is. If all images, regardless of the shape of the subject, are going to be the same size (width/height), then, shoot with plenty of room around the object, and leave it to a more experienced web designer to make the important parts of those images fit the template they're using. They clearly don't grasp the fundamentals of image handling for the web. It's hard to imagine they've got someone helping them set up a web site, but aren't comfortable on this topic.

 

You haven't indicated if the images include a black or white background that would allow someone in post production to fatten up margins if needed, but there are plenty of tricks along those lines - and anyone who's prepped product images for web use before will know them. Don't forget that if your shots are ONLY going to be used online (at resolutions vastly lower than required for print work) that you won't lose any appreciable quality if you back off the subject a bit and leave plenty of working room around it. Good luck!

[pvp]

Ken, so far everything said here is correct: Per-inch is meaningless for online presentations, the people you are dealing with are clueless, and (because they are clueless) it is your problem to fix.<P>

 

I suggest you forget about using the "save for web" feature until you're more comfortable with what you need. Here's how I save for a specific size:<P><P>

 

1. Don't resize until you are finished with any other Photoshopping (curves, color adjust, etc.)<BR>

2. Click on the <U>Image</U> menu, <U>Image size...</U><BR>

3. In the "Image Size" dialog, <U>set the Resolution to 72 PPI.</U></B> DO THIS BEFORE YOU CHANGE ANYTHING ELSE.<BR>

4. Then <U>change either the height or width</U> to the required value, followed by TAB. (The TAB simply moves the focus to another part of the dialog, and forces the other numbers to update.)<BR>

5. Then <U>check the other dimension</U> (width, height) and be sure it is AT LEAST AS LARGE AS YOU NEED. If it is smaller than required, change it to the required value (the dimension you changed first will then be changed to something larger.)<BR>

6. At this point, you should have a dialog that is going to make your image the size you need in one dimension, and larger in the other, at 72 pixels per inch. <U>Click OK</U> to resize the image.<BR>

7. Then <U>Crop</U> or use the <U>Canvas size</U> dialog to set the other dimension to exactly what you need. (This step is destructive; i.e., you'll be clipping off part of the image to get the aspect ratio correct.) Of course, if you can't afford to crop anything, you'll need to either add blank space, or reshoot the photo.<P>

After you've resized and all, save the image with a different name. Then you'll still have your original if you need to start over...<P>

You'll probably receive more than one suggested workflow, and I don't doubt there will be something easier than mine. One of the cool things about Photoshop is that there are usually several ways to reach a similar end.