Using the Auto Image Optimizer in the Classic Builder

Follow

Tired of having to use third-party image optimizers before uploading your image to your landing page? Have we got good news for you! We’ve rolled out our Auto Image Optimizer that can be used directly within the Unbounce Builder!

The Auto Image Optimizer gives you control over your image compression settings, allowing you to specify:

  • The size of your image, ultimately determining the loading speed of your page.
  • The quality of your image, if you want a sharper, more visually appealing picture.

Which Image Types Can Be Optimized Using the Auto Image Optimizer?

The Optimizer can currently be used on PNG and JPG image types.

Using the Auto Image Optimizer on Individual PNG Images

Click on the PNG image that you’d like to optimize in the Unbounce Builder.

On the Properties tab on the right side of the Builder, scroll down to the IMAGE QUALITY section.

The PNG optimizer will convert 24-bit PNG images to 8-bit images to decrease load time. This will also decrease the quality of your image. This feature is selected by default in the Builder.

optimizer_png_checked.png

If you’d like to keep your image at 24-bit PNG, deselect the Apply PNG Compression feature.

You can re-apply the PNG compression to your image by re-selecting the checkbox, and clicking the Relink button.

optimizer_png.png

Note:

The Relink button will apply whichever compression setting that you’ve selected in the PAGE IMAGE QUALITY setting (as below).

Using the Auto Image Optimizer on Individual JPG Images

Click on the JPG image that you’d like to optimize in the Unbounce Builder.

On the Properties tab on the right side of the Builder, scroll down to the IMAGE QUALITY section.

The JPG Image Optimizer is a slider that is set to optimize your image to 60% compression by default.

optimizer_jpg.png

You can increase/decrease the quality of your JPG by increments of 20%. Click and drag the slider to the compression of your choice then click the Relink button.

optimizer_jpg_relink.png

Note:

The Relink button will apply whichever compression setting that you’ve selected in the PAGE IMAGE QUALITY setting (as below).

Using the Auto Image Optimizer on All Images on Your Landing Page

If you’d like to set the optimization of all the images on your page to the same settings at the same time, follow these steps:

Click the Page Properties tab in the top right corner of the Builder. Scroll down to the PAGE IMAGE QUALITY section.

Both the PNG compression checkbox and the JPG Image Quality slider are available in this section and affect all the images on your landing page.

optimizer_all_images.png

The same default settings apply as with the individual images:

  • 8-bit image setting for PNG compression
  • 60% compression for JPG images

The same steps apply for the Page Image Quality usage as the individual usage cases above.

Note:

Page background images will also be affected by your all images compression setting.

Note:

Editing the compression of a single image will take precedence over the settings used in PAGE IMAGE QUALITY.


Do you agree or disagree with this statement: This article helped me find the information I needed quickly and easily.

Select an option and leave us some feedback in the comments:

Strongly DisagreeDisagreeSomewhat DisagreeUndecidedSomewhat AgreeAgreeStrongly Agree

Measuring Customer Effort Score with Nicereply