How to Color, Sharpen, and Save for Web in Photoshop

[embed]https://www.youtube.com/watch?v=lH6TyuZN1yY[/embed]

How to Color Images for Web

In this episode we use a couple of different adjustment layers to color the image before saving it out to the web. We start with a Color Balance adjustment layer and add green and blue into the waves. Then we add another Color Balance layer to bring some red and yellow into our subject and the background, adding a nice contrast to the blue. After getting our color right, it is time to work on the exposure. We use a Curves Adjustment Layer to bring up the shadow level and keep the highlights where they are. then we mask that layer to only be visible over the subject.

How to Sharpen Images for Web

After getting our color perfect, it is time to sharpen your image. It is important to resize your image before you sharpen, so the image will be sharp at the display size. Avoid resizing your original image, it is much better to make a copy and resize the copy. To do this we create a new layer on the top of everything, and go to Image - Apply Image. Use the default settings in the dialog box and you will get an exact copy of your image on the new layer. From there, right click on the layer and select Duplicate Layer, and select a new document.

Once you have a new document, resize it to the output resolution, in this case we use 1200 px wide.

Now it is time to sharpen. Go to Filter - Sharpen - Unsharp Mask. Choose a radius that provides the optimum level of sharpening without going overboard. My recommendation is to go a little too far then back it off to get the right amount.

How to Save Images for Web

Once you have your image colored, resized and sharpened, it is time to Save for Web. Go to File - Export - Save for Web. You want to make sure you have "Convert to sRGB" checked, this is the color space that most internet browsers use, and converting to this color space will ensure your colors look great on the web.

If you want to see a preview of your image online, click on the Preview button on the bottom left of the dialog box, it will open your default internet browser and display your image. This is the best way to see how your image looks online!