Optimize Images

Why Optimize Images?

Web images need to be optimized for two main reasons;

1. Site Speed – larger images cause your site pages to load slowly.
2. Server Storage – your server storage will fill up with larger images and result in higher costs over time.

How to Optimize Images

Here are some options to help you optimize images for web use BEFORE you upload them to your website media library.

Option 1: Photoshop (Best Option!)

Photoshop is the best tool for image editing and optimization. This is a paid software and unfortunately some clients do not have access to this software. If you have photoshop you can use the steps outlined here. (MIGHTYminnow is always available to help optimize your images for you in bulk.)

One option in Photoshop is to use the Save for Web option;

1. Open your file and click File > Export > Save for Web.
2. You can also specify a compression level from Low, Medium or High, or enter a specific value between 0-100 in the Quality box.
3. Select Save.

Another option in Photoshop is to use the Image Processor to bulk optimize an entire folder of images;

1. In Photoshop Choose File > Scripts > Image Processor
2. Select the image folder to process > Select Folder (this is your folder with images to be optimized)
3. Select the destination “Save in Same Location“
4. File Type > Save as JPG and Resize to fit > 1200px (this assumes the source files are larger than 1200 pixels)
5. Click Run
6. Your optimized files will be in a folder called “JPEG” inside the source folder of images you selected

Option 2: Preview and Tiny PNG (Mac)

If you have a Mac computer you can use the native photo editing tool called Preview to edit the size of your image and then optimize it using a free web tool called Tiny PNG. This assumes you are working with image files that are of a large source dimension (such as over 1200 pixels) and want to reduce the dimension as a first step to file size reduction.

1. Open the Preview app and then open your image file
2. Tools > Adjust Size, select “Resample image” and “scale proportionally“
3. Enter the smaller image size (such as 1200 pixels) into the resolution field (assuming your image is larger than 1200 originally)
4. Click OK.
5. Go to TinyPNG https://tinypng.com/
6. Use the “drop your image here” tool box to upload your image
7. Download the optimized file (should be reduced by about 50%)
8. Upload your optimized file.

Option 3: Microsoft Photos and Tiny PNG (PC)

If you have a PC computer you can use the native photo editing tool called Photos to edit the size of your image and then optimize it using a free web tool called Tiny PNG. This assumes you are working with image files that are of a large source dimension (such as over 1200 pixels) and want to reduce the dimension as a first step to file size reduction.

1. Open Photos and then open the image file
2. Click the three dots in the top-right corner
3. Select Resize
4. Choose a preset size or click Define custom dimensions > set the new dimensions
5. Click Save resized copy
6. Go to TinyPNG https://tinypng.com/
7. Use the “drop your image here” tool box to upload your image
8. Download the optimized file (should be reduced by about 50%)
9. Upload your optimized file.