How to resize an image in Photoshop

This is my simple, safe process showing you how to resize images in Photoshop. It’s a no-nonsense guide for marketers, or anyone who just needs to get the job done without any fuss.

I’ll show you my trick for protecting your original file, how to get the resolution right (72dpi), and how to save it out as a high-quality, small file that’s perfect for your website.

Here’s a quick video that walks you through the whole thing, with the step-by-step guide written out just below.

How to resize an image in Photoshop

Step by step guide to resize an image

Here’s the simple, non-destructive process I follow to get a large image ready for the web.

1. Protect Your Original File

The most important step first: never work on your original image.

• Open your high-resolution image in Photoshop.
• Select everything by pressing Ctrl+A (or Cmd+A on a Mac).
• Copy the image by pressing Ctrl+C (or Cmd+C).

2. Create a New Web-Ready File

• Go to File > New.... Photoshop will automatically set the dimensions of your new file to match the image you just copied to your clipboard.
• Click Create.
• Paste your copied image into this new file by pressing Ctrl+V (or Cmd+V).
• In the Layers panel, you can delete the blank “Background” layer so you just have your image.

3. Resize for the Web (Resolution & Dimensions)

Now we can safely edit this new file.

• Go to Image > Image Size....
• First, change the Resolution from 300 down to 72 (the standard for web).
• Next, set your Width (making sure ‘pixels’ is selected). A good, common width for a large website image is 1920 pixels. Make sure the ‘Constrain Proportions’ link icon is on, so the height changes automatically.
• Click OK.

4. Crop to Your Final Dimensions (Optional)

If you need an exact size, like 1920 x 1080, the crop tool is the easiest way.

• Select the Crop Tool from the toolbar.
• If your rulers aren’t visible, press Ctrl+R (or Cmd+R).
• Click and drag guides from the top and side rulers to mark your 1920px width and 1080px height.
• Drag the crop box handles to snap to the guides you just created.
• Press Enter to apply the crop.

5. Export for Web (Save as a Small File)

This is the final step to get a small, fast-loading file.

• Go to File > Export > Save for Web (Legacy)....
• In the preset menu, choose JPEG.
• Set the Quality to around 30. This is usually the sweet spot between file size and image quality.
• Check the final file size at the bottom-left of the window (my aim is usually under 200kb).
• Click Save..., give your new file a name, and you’re all done.