Analyze and Optimize Images with Jetpack Boost

The Jetpack Boost image size analyzer identifies and helps optimize improperly sized images on your site, improving load speeds and boosting user satisfaction and search rankings.

This functionality is only accessible via Jetpack Boost’s paid version or as part of the Jetpack Complete plan.

Using the Image Size Analyzer

If you have a paid Boost plan, you can use the image size analyzer by following the steps:

1. Install and activate Jetpack Boost plugin. 

2. Navigate to Jetpack → Boost, scroll down until you find Image Size Analysis, and click the Start image analysis button.

After you’ve initiated the process, you can either opt to view a preliminary report by clicking on the Open partial report option, or you can wait for the full analysis to complete. 

Upon completion, Jetpack will autonomously generate a comprehensive report for you. To view this detailed report, simply click the See Full Report button.

Re-analyzing Images

If you frequently add new content to your site, it’s important to routinely ensure images are optimally sized. You can conveniently reanalyze your site’s image sizes by following the steps:

1. Log in to WP-admin and navigate to Jetpack → Boost. 

2. Scroll the page until you see the Image Size Analyzer section.

3. Click on the Analyze again button and allow Jetpack some time to re-scan your entire site.

Once started, you can preview an initial report by clicking the Open partial report button, or wait for the full analysis. Jetpack will create a complete report when finished, accessible through the See full report button.

Checking the Image Analysis Report

Once the image analysis is complete, a summary report, including scanned areas (Homepage, Posts, Pages), will be displayed. It will enumerate any oversized or non-optimized images and their respective locations on your site. To delve into specifics, click on the related section or the See full report button.

A detailed report will appear when you click on either the problematic image’s location or the See full report button.

The report page contains valuable insights as follows:

• The generation date of the report
• The count of images identified for optimization
• Tabs indicating the locations of the scanned images on the site
• Details about problematic images found. This section includes, for each image, the following:
  • The name of the image
  • The location where it’s uploaded on the site
  • The potential size savings if the image is optimized

Optimizing images

There are a few different ways to optimize the images and make sure they are using the best size for the place they are uploaded on your site. 

Enabling Image CDN

Start image optimization by turning on the Image CDN feature. This feature of Jetpack Boost can auto-adjust many images to their optimal size. To activate, go to Jetpack → Boost, find the Image CDN section by scrolling, and switch it on.

Replacing an image in my post with a resized version

1. On the Image Size Analyzer report, use the drop-down arrow from the right side to see more details about the image. In the Image Details section, you will see the expected dimensions of the image if it was resized.

2. As you have already enabled Image CDN, we can use that to deliver a resized image automatically to your visitors. Note the “Size on screen” dimensions. Click on the Edit Page button, which will bring you to the post editor.

3. Click on the image you want to edit, and the block settings will show. Click on Replace.

4. Click on the pencil icon next to the image URL.

5. A small text box will appear containing the URL. It’s probably easier to copy that URL into a text editor for editing.
6. Update the image URL so it loads from the Image CDN, adding the correct width and height dimensions:
   • Remove the “https://” from the start and replace it with https://i0.wp.com/
   • At the end of the URL, you’ll add the dimensions like this where X is the width, and Y is the height: ?resize=X.Y. An example looks like this:
     • Original: https://example.com/logo.jpg
     • Fixed: https://i0.wp.com/example.com/logo.jpg?resize=640,480
7. Paste the new URL into the text box and click on the Return icon.

Optimizing the thumbnails in a gallery block

You can set the image size in the block sidebar settings from Large to Medium or Thumbnail:

1. Click on the image you want to edit.
2. Click on Fix on page button, and the post or page editor with the image will open.
3. Select the gallery that you want to fix.
4. On the Block settings sidebar, under the Image Size section, select Medium or Thumbnail:

Note: The solution explained above isn’t working for Tiled Gallery block. If the images are not sized well using this specific block, you can convert it into a regular Gallery block. To do this, click on the icon on the top left of the gallery settings. A dropdown menu will appear with several choices. Choose the standard Gallery from these options.

That’s it! With Jetpack Boost’s image size analyzer at your fingertips, it’s easier than ever to ensure your site’s images are optimized for speed and performance. Keep your website running in top gear by regularly analyzing and optimizing your images.