Preparing your images for web

After spending hours planning and styling a shot, getting the lighting just right and adding the final touches in post production, chances are you’ll want to upload your images online to your portfolio or share them on social media.

In this Photoshop class Karl looks at how to resize images for web and online use using two different methods in Photoshop. He explains important considerations when resizing images and demonstrates each step of different methods. You’ll not only learn how to find a balance between image size and quality, but also how to get the best out of your images, see what colour space is best for web use and how to speed up your workflow.

This Photoshop class covers the following:

  • Resizing images for web use
  • How to resize images without losing quality
  • ‘Export as’ vs ‘Save for web’
  • How to sharpen images for web
  • Colour profiles for web images

If you have any questions about this class, please post in the comment section below.

Key concepts

Resizing images.

Resizing images for online example

Resizing images for online use requires reducing the dimensions of the image as well as the quality.

‘Export as’.

Photoshop Export As

‘Export As’ allows you to change the dimensions and quality of the image before saving.

‘Save for web’.

Photoshop Save for Web

‘Save for Web’ also allows you to change the dimensions and quality of an image, but it does not offer as much control as ‘Export As’.

Sharpening images.

Sharpening images in Photoshop

Often adding additional sharpening to images before resizing them can help enhance their apparent quality.

To learn more about other useful Photoshop tools, please visit our Post Production classes. You’ll also find a range of more in-depth demonstrations on how to use a number of different tools and techniques in our Photoshop for Photographers course.


  1. Hi Karl, Great vid as usual. A question – when you change the image size for the web you just leave it at 300 dpi? Why not change it to 72dpi @ 2500 px


    1. Hi Glenn because it doesn’t make any difference, web browsers only read the pixel dimensions and display the image based on that.

Leave a Comment