How To Setup EWWW Image Optimizer (Compress Upto 80%)

Ewww image optimizer plugin is an awesome tool to speed up your slow website. I’ve been using this plugin for quite a while now, and last night I thought why not publish a post in which I’ll show how to set it up properly for the most solid results.

In this post, we will also discuss some negatives about this plugin and plugins that are better. So, let’s begin!

Installation Process

(If you’ve already installed the plugin, then skip this step)

  • Search “Ewww” in the search box of the plugin section

EWWW image optimizer plugin is available in the plugin section of WordPress. Or, you can directly download the zip file from WordPress.org

  • Click on the install button

Once the plugin is installed, click on Activate to activate the plugin.

Congrats! the installation process is now completed, let’s move on to the settings. Click on the settings option to reach the plugins setting zone.

Ewww Recommendation (Skip It)

Ewww plugin will ask you to select your speed goals. Just skip it because we can set it up later or it isn’t that important.

Ewww Image Optimizer Settings

Now, let’s begin settings up the plugin.

At first, you’ll only see three sections, basic, support, and contribute. But when you’ll click on “Enable Ludicrous Mode” you’ll see some more options like Local, Advanced, Resize, Convert, and Overrides.

After clicking on Enable Ludicrous mode, the plugin menu should look like this ????

Basic Settings

  • Modes

Here, Ewww tries to sell its premium version to you. It’s a really good plugin, works well for free, and paid both the users. If you’re interested you can become their premium customer.

The cheapest plan starts with 7$ per month, and the most expensive one will cost you 25$ monthly (they also offer a yearly plan).

Here are the features you’ll get in the premium version:

If you’re a beginner, I would say, stick to the free version because your main goal should be saving as much money as you can at the initial stages of blogging.

Once your blog begins to generate traffic, you can consider upgrading the plan.

  • Remove Meta Data

Enable

Image metadata is specific information embedded in pictures. It gives information about the picture, camera, etc. According to research, 16% of the total file size of images online is metadata.

But, the fun fact is, most people do not even know they are sharing image metadata, and users/visitors usually don’t know they’re downloading it.

Obviously, most of this information is worthless to site visitors and isn’t needed by browsers to render images anyway. Except you’re a photographer or work for a media outlet or some other company that requires data to be retained for copyright or other reasons, there’s really no need to preserve image metadata.

To learn more about Image Metadata – read this really good article by Wp-Rocket.me

  • Resize Images

Ideal Size: 1200 x 630

The most ideal WordPress featured image size is 1200 x 628 pixels and these dimensions usually satisfy most WP blog themes.

Different blogs (and more particularly, different themes) may have featured images of various sizes. In WordPress, you can change and customize your image settings so different image types will be sized respectively.

  • Add Missing Dimension

Enable

When a browser is loading a web page, it loads the HTML first and holdbacks for the images to be downloaded. If the width and height values are ready, browsers can use that data to reserve the space required for the images on the page.

When space for an image is not saved, the browser will move content around to help the image once the image is downloaded. This layout shift gives a poor experience to the user. 

This feature helps to address the following advice from GTmetrix and PageSpeed: 

  1. Use explicit width and height on image elements
  2. And, Cumulative layout shift

Lazy Load

Lazy loading is the method of delaying load or initialization of resources or objects until they are truly needed to improve performance and maintain system resources.

For example, if a web page has a picture that the user has to scroll down to view, you can display a placeholder and lazy load the full picture only when the user comes to its location.

  • Improves actual and perceived loading time as images will be loaded only as they enter (or are about to enter) the viewport.

Enable

It can improve page loading time drastically. Enable it if you write long-form content. Keep it disabled if you’re not a fan of heavy lazy loading.

  • Automatic Scaling

Enable

Quality feature. Turn it on!

It can help you fix the image scaling issues. The AI of Ewww will detect the screen dimension of the user’s device and automatically detect the dimension of the image according to the device’s dimension.

  • SVG Placeholders

Enable

I recommend enabling it as it reduces HTTP requests which can certainly help in boosting pagespeed. However, make sure to check and find if any error occurs or not because this feature only works with selected themes.

turn it off if you find any error!

  • LQIP

Disable

LQIP feature loads low-quality versions of your images as placeholders using Easy IO, but compare to blank placeholders, it’s slower. Keep it disabled

  • External Background Images

Here you can Specify class or id values of elements with CSS background images. Background images direct-attached by inline style attributes will be lazy-loaded by default.

Leave it as is unless you know what you’re doing.

  • Exclusion

Here you can exclude the images you don’t want to lazy load. Leave it, if it isn’t so important.

WebP Conversion

According to Kinsta, WebP concentrates on delivering the same image file, simply with smaller file sizes. By lessening the size of your image files, you can still give an identical experience to your website’s visitors, but your site will load faster.

Note: Ewww plugin’s free version can’t convert Gifs to WebP. If you use Gifs on your post often, consider purchasing their premium version.

  • Convert your images to the next generation form for supported browsers, while maintaining originals for other browsers.

Enable

Once enabled, every image that you’ll upload will automatically get converted into WebP files. For existing uploads, use Bulk Optimizer.

WebP Delivery Method

  • JS WebP Rewriting

Disable

  • WebP Rewriting

Disable

There is no need to turn them on as they might not work well.

  • Force WebP

Enable

WebP Quality Level

Here you can enter a number between 50 – 100. By doing that, you can let the plugin know how much quality you want in your WebP. The default is 75 which is absolutely perfect. Leave it as is.

Local

In this section, you can select the level of optimization. You’ll get 2 options if you’re using the free version and 5 if you’re, are paid customer.

A free version is enough here. So, let’s check these settings and make your blog even faster.

  • JPG Optimization Level

Pixel Perfect

  • PNG Optimization Level

Pixel Perfect

  • GIF Optimization Level

Pixel Perfect

  • PDF Optimization Level

No Compression

  • SVG Optimization Level

Here you will have to install an extra plugin. Just click on install and within a few seconds installation will complete.

Select Default.

  • Backup Originals

Really good feature, however, it only comes with the premium version.

Read More!

12 Plugins To Make Your WordPress Site Faster Than Yesterday

How To Clean WordPress Database In Less Than 2 Minutes

Advanced

The name says it all, this section is really filled up with advanced settings. Sadly none of the settings here I find important. So, I haven’t enabled anything here.

  • Parallel Optimization

Parallel optimization is actually a good feature but it could increase server load which won’t be good for your site. So, keep it disabled.

  • Scheduled Optimization

No need to enable. Use bulk optimization for existing images.

  • Include Media Folders

Not important.

  • Include Originals 

Not important.

  • Folders to Optimize

Use this if you wanna optimize any other folder. (Leave it if you’re a beginner)

  • Folders to Ignore

Here you can enter the path of the folder which you don’t want to be optimized.

Resize

According to the developer, The resize settings let you save tremendous amounts of disk space. These settings aren’t necessarily meant to speed up your site otherwise.

You can read more about it here. Btw, here are the settings that I’m using currently:

Most of the settings aren’t really important.

  • Resize Detection

Disable

This feature is useful to find out the images on the site that are more than 150% of the dimensions that are being displayed within the page.

A good tool but can increase server load and slow down your WordPress Admin Panel.

If you have a slow WordPress admin panel – read this post in which I’ve discussed the most perfect ways to speed up the WordPress dashboard/admin panel.

  • Resize Existing Images

Enable

With this feature, you can resize the existing images. Once enabled, the bulk optimizer will resize all the existing images.

  • Resize Other Images

Disable

With this feature, you can optimize/resize the images that aren’t present or visible in your site’s “official” Media Library.

You can enable it if you’re not using shared hosting.

  • Disable Resizes

Do not select anything here. Let the plugin optimize every pic.

Read More!

How To Set Up Hummingbird Plugin Step By Step: Quick Tutorial

Autoptimize Plugin Ideal Settings – Step By Step (CDN Tutorial)

Convert

None of the features is important here. Leave everything disabled.

  • Hide Conversion Links

Disable

  • Delete Originals

Disable

I feel it’s not okay to delete your original images. However, deleting original images can save you space which could be beneficial.

  • JPG to PNG Conversion

Disable

Could increase the loading time.

  • PNG to JPG Conversion

Disable

Images could lose quality. Better to keep it disabled.

  • GIF to PNG Conversion

Disable

Good feature, but the Gif could lose its animation.

Overrides

Here you can read the guide or process of how to override any setting. Skip it!

Support

In the support section, you can debug the problem. You’ll see a panic button that you can use in case your site breaks after implementing all the settings shown above.

Contribute

If you want to help with the plugin, you can Allow Usage Tracking. This feature will let the developer which kind of changes they can make to make the plugin work even better. Keep it disabled because it could increase server load.

Now, everything has been covered up. Do let me know if you’re having any issues.

Here is a video tutorial for you to understand the settings even better.

Final Thoughts!

This plugin is pretty good at optimizing images, that’s why I am using it on most of my sites. It is easy to set up and effective in increasing site speed.

Thanks for reading!

Check out my other works!

How To Serve Scaled Images (Properly Sized Images) In WordPress

WP Super Cache Ideal Settings With Screenshots (Updated Version)

Sumit
Sumit

Sumit is a regular contributor to Hostinggrow.com. He has 6 years of experience in blogging, and he loves football, his favorite player is - Lionel Messi (GOAT), but he has no hate for Ronaldo.

Articles: 54

Leave a Reply

Your email address will not be published. Required fields are marked *