Screen Shot 2020-04-14 at 10.00.23 PM

Saving Images for Web Using Photoshop: 2 Methods

Method 1: Save for Web

Using Photoshop’s “Save for Web” feature, you can easily save your images without ruining the quality like many other image compressors do.

This method works best if you only need to save one image, or maybe up to five or so. Otherwise, you will want to use Method 2.

Step 1.

Go to File > Export > Save for Web (or Option+Shift+Command+S if you’re feeling fancy)

Step 2.

Adjust the image dimensions and quality until you reach a happy medium. The goal is to keep all images under 500KB.

Start by adjusting the dimensions first. 2000px is the absolute max width I would ever use, and I really only do that for full width backgrounds or parallax images. Otherwise, just shoot for 1800px at the longest edge (depending on portrait or landscape orientation) and it will be plenty big enough.

Once that is set, check the file size (bottom left). If that is under 500KB, you’re good to go! If not, adjust the quality using the dropdown in the top right. Start at Maximum, and keep lowering it until the file size goes down to under 500KB. Then you’re done!


Method 2: Image Processor

This method works well for automating the process. If you need to save a whole folder’s worth of images for web, this is the way to do it.

Step 1.

Navigate to File > Scripts > Image Processor.

Step 2.

  1. Select the folder with images that need to be resized.
  2. Then, make a new folder for the new resized images to go into.
  3. I usually leave the quality set to 10, and go back and adjust later if I need to.
  4. Set the max dimensions to 1800px on either edge.
  5. Run! (…not literally. This will make your life so much easier and you will love it.)
I create a folder named “S4W” (short for Saved for Web) within my main images folder so I can โ™ช keep them separated. โ™ช

Step 3.

Go to your Finder and relish in the glory of your freshly saved-for-web images!

Hope this helps save you some time!

๐Ÿ’œย Rachel

Share this post:

Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on email

Did this article help you?
Let me know below in the comments!
โ˜บ

Leave a Reply

Related posts