Web output

[margaretbonson]

Hi Damien,

I searched and couldn't find a step by step guide .....

How do I prepare images for the web? Specifically for my webpage (online portfolio) and facebook. I've been researching but I still feel as if I'm piecing it all together from various research, and am searching for a complete step by step guide! Help please!

 

-Margaret

[Damien Symonds]

Hi Margaret,

It's very easy ... the only difficult part is knowing what size to make them.

First, have you read this article, and this one?

[margaretbonson]

I haven't, and now I am. I've only taken the RAW class, and do not have knowledge of working in photoshop yet. What should I do about sharpening?

[margaretbonson]

So I checked my website, and this is what I found

Suggested Image Sizes

For Online Presentation Only - Images should be around 1,100 pixels by 850 pixels up to 1,550 pixels by 960 pixels.

If you are mainly interested in using Zenfolio for online presentation of your photographs, you should upload digital files resized to 1,100 pixels in width by 850 pixels in height. This is the default image size for online viewing. 

 

SOO... the pictures below show what I THINK is the correct way for web output. Let me know if I made a mistake anywhere. This is although, without sharpening.

[Damien Symonds]

Oh, well done you for your research!  This is very very helpful.

Since they say this:

12 minutes ago, margaretbonson said:

you should upload digital files resized to 1,100 pixels in width by 850 pixels in height. This is the default image size for online viewing.

we should definitely follow those instructions to the letter.  That means, DON'T use the Image Size feature.  Only use the Crop Tool.

Can you choose your Crop Tool, then show me a screenshot?

[margaretbonson]

This sounds really stupid, but I do not know how to use the crop tool to resize. 

[Damien Symonds]

Not stupid at all.  I'm going to help you, that's why I need the screenshot.

[margaretbonson]

is this what you want to see?

[Damien Symonds]

Exactly.

See where it says "Ratio" in the options bar?  Click on that little menu.  In there, is there something that says either "Size and Resolution" or "W x H x Resolution"?

[Damien Symonds]

I beg you, please don't wait any longer to take the Layers & Masks Class.

[margaretbonson]

Yes, here's what I see.

 

Yes, I plan to. I have my calibration system sitting in my office ready to take out of the package to use, just a matter of doing it. Should I take layers and masks or the sharpening class next? Also, how long do we need to work together with the Deluxe membership on editing photos in ACR?

[Damien Symonds]

5 minutes ago, margaretbonson said:

Yes, here's what I see.

Yep, that's the one, great.

Choose it, then you'll be given those three fields in the options bar.  Following the exact instructions of your site, you'll enter "850px" in the width field, and "1100px" in the height field.  Make sure you include the "px" part, this is very important.  Leave the resolution field blank.

Once you've entered those values, show me another screenshot.

7 minutes ago, margaretbonson said:

Yes, I plan to. I have my calibration system sitting in my office ready to take out of the package to use, just a matter of doing it. Should I take layers and masks or the sharpening class next?

Layers & Masks.  Sharpening won't make a lick of sense if you don't have the basic knowledge that L&M gives you.

7 minutes ago, margaretbonson said:

Also, how long do we need to work together with the Deluxe membership on editing photos in ACR?

Well, that varies for everyone.  For some people it's only a week before they're ready for the Levels Class.  Other people take several weeks, or even months.  It all depends on how much you flood me with photos.

[margaretbonson]

Sounds good, I will get my calibration system working, upgrade to Deluxe and then flood you with photos!

[Damien Symonds]

26 minutes ago, margaretbonson said:

Perfect.  Now move the area around, or grab the corners and drag them inwards to reduce the size of the crop if you wish.  Then press Enter when done, and you'll see the photo shrink to web size.  Easy!

Then zoom in to 100%, and sharpen for web.

[margaretbonson]

So I am going to lose some of the photo? That's just what happens when re-sizing for web?

[Damien Symonds]

It's what happens when your website advises a specific size, yes.

[margaretbonson]

Okay.

 

Does this look too sharp?

[Damien Symonds]

That's entirely up to you.  Web sharpening is WYSIWYG.  Just make sure you only view it at 100%.

By the way, make sure you position your watermark on an area that can't be easily cropped or edited out.

[margaretbonson]

Sounds good.

 

Thanks for your help on this! 

[Damien Symonds]

No problem at all.  Let me know how you go.

If you've got a lot of them to do, consider making this: https://www.damiensymonds.net/act_web.html

[margaretbonson]

Sounds good, thanks.

If you want to me to start a different thread with this question please let me know, otherwise...

I am currently preparing client files by editing only in ACR, can you point me in the right direction on how to save these files for their client galleries I am delivering them? Keep in mind - I have not taken the layers and masks or print sharpening class. 

Can I save as from ACR? I am attaching a screen shot of settings that appear when I click save as in ACR.

Thank you!

[Damien Symonds]

You can do it that way, but it's less than ideal for a number of reasons.

To clarify ...

9 hours ago, margaretbonson said:

save these files for their client galleries I am delivering them?

... are you talking about low-res web proofs for your clients to browse, then order their favourites?  Or are you talking about high-res files for the clients to keep and print their own?

[margaretbonson]

High res files for clients to keep and print their own 

[Damien Symonds]

Have you read this?  It's REALLY important.

Then this.

[margaretbonson]

I did read before, now I read again and watched the video - - seems to make more sense.

At this point I am in the process of setting up printing services, but have not yet. Therefore, my workflow for preparing high res images for my clients in an online gallery should be this:

1. Edit photos in ACR

2. Use the save as button and save JPEG files

3. Upload those JPEG files into photoshop and follow the Video: Batch Saving digital files (Photoshop)

4. Upload those files to my online gallery website (Zenfolio)

5. Encourage and educate clients on how/where to print