Image Scaling

When you activate Optimole's Image Scaling, it automatically adjusts your lazy-loaded images as per the screen being used. This happens in real-time, whether your visitors are on a computer, tablet, or smartphone. Optimole makes sure your images look their best, no matter the device, ensuring a smooth and enjoyable user experience.

🔌 Enable the Feature

To enable this feature, navigate to WP  Dashboard > Optimole.

1

Open the Settings tab.

2

Expand the Advanced accordion and open the Lazyload panel.

3

Use the toggle to  enable the Scale Images feature.

🚀 User Site and Image Impact

This particular option allows you to  disable automatic resizing while retaining the lazyload function. In this way, images will load only when you scroll to them (through lazy loading), but they will stay in their original size and won't be adjusted to fit your device's screen (due to disabling image scaling).

This means if an image in your content is very large, like a detailed painting, but it shows up small on your screen, turning off the resize option would make it load in all its detailed glory when you see it on the screen.

One important thing to keep in mind is that this toggle is global, so if you decide to turn it off, the image scaling will be turned off for all lazy-loaded images, and the images will maintain their original size.

🔄 Benefits and Trade-offs

Benefits

• Uniform image quality - autoscaling algorithms preserve images' visual appeal during resizing, guaranteeing clarity and attractiveness across all devices.
• Conserves storage - autoscaling preserves server space by delivering images in optimized sizes, which is especially advantageous for websites with numerous high-resolution pictures.
• Simplified management - autoscaling eliminates the need for manual resizing and uploading various image versions for different devices, making website management more straightforward.

Trade-offs

• Loss of precision - autoscaling algorithms decide resized images, potentially deviating from your artistic intent. For exact control, manual resizing might be necessary. 
• Detail loss on enlargement - upsizing small images through autoscaling can lead to quality loss. Beginning with high-resolution images is vital to preserve quality when enlarging.

🧩 Use Cases

Turning off this  feature can be very advantageous in the following situations:

• Detailed artwork - for detailed images where preserving every detail is important, manual resizing ensures precision without relying on automated algorithms.
• Fixed layouts - website layout demands specific image dimensions, turning off autoscaling allows for precise control over image sizes.
• Performance concerns - on websites with limited server resources or high traffic, turning off autoscaling can reduce server load, ensuring smoother overall performance.

⚙️ Related Settings

• Scale images & Lazy loading - doc

🗂Useful Resources

You may find useful these guides:

• How to Disable the Autoscale Feature for Certain Images?
• Beginner’s Guide to Responsive Images: How to Get Them Right

Still looking for an answer? Contact us!