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!
Contents
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:
- Use explicit width and height on image elements
- 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)
