What is Optimole?
Optimole is an image optimization and image CDN service that helps to speed up a WordPress website (and any other website). It is one of the most advanced image optimization services that take out the burden of fine-tuned control settings that are often intimidating to rookies. The service doesn’t have its own CDN, but it uses CloudFront CDN’s 200+ locations to deliver optimized and scaled images, thereby significantly speeding up any WordPress website.
The Review Verdict: Use It!
Optimole is pricey, but it is geared towards those who want to bypass the burden of fine-tuning a service to match a website’s requirements. It is more like a plug-and-play service.
All you need to do is to plug it, run it, and forget it. Serving webp images using the visitor’s viewport and browser, Optimole fastens the website using lazy loading and CloudFront CDN.
Looking at the pricing structure, Optimole is one of the priciest options in the market. Websites with small SEO budgets cannot use the service. One may argue that there is a free version available, but the limitations set in the free version are simply not ideal.
For those who have a significant SEO budget, Optimole is a must-have service! It does the heavy lifting, and releases the website hosting server from the burden of processing and serving images.
What Compression Technique Does Optimole Use?
On average, Optimole achieves greater than 80% compression. The compression technique the Optimole uses is Lossy Compression, which strips unnecessary data from the images.
Once the image is decompressed, all those stripped data will never come back. Lossy compression is great for blogs! Lossless compression is perfect for photography websites. So, if you are looking for Lossless compression, Optimole might not be a great option.
When you set up Optimole, you will have the option of choosing from different levels of compression. There are three levels – low, medium, and high.
If you are already using pre-processed images (like I do), I will say that the medium compression level works perfectly fine. However, if you are not using pre-processed images (that is, you are using heavy and large image files), set the compression level to high.
Setting Up Optimole on Your WordPress Site (And Features)
Setting up Optimole is a fairly simple business. You need to connect your WordPress website or any website that you want to Optimole.
I was thinking of dealing with other custom integrations because I do not use anything other than WordPress to build my websites or blogs. But, for the sake of helping, I will behave like a Samaritan, and tell you the steps necessary. What I cannot tell you, however, is how to use the API key on those websites. Why? Because I don’t know!
Coming back to the topic, before you can start using Optimole on your website (even if you are going for the free plan), you will have to register with Optimole and get their API Key.
The registration process is fairly simple. Visit their website, select a plan, purchase it! Once you have completed the payment, you will see a dashboard where you can find the API Key under the dashboard tab.
This is what it will look like:
Once you get the API Key, go back to your WordPress blog dashboard, and install the Optimole plugin from WordPress plugin repository.
Once you install the plugin and activate it, the setup page will automatically show up. However, if that doesn’t happen for some reason, you can find the Optimole option under the Media menu on your WordPress dashboard.
This is where you will find it:
Click on that option to open the Optimole settings page.
This is what you will see:
Click on the “I already have an API key” button. On the next screen that you see, enter the API Key that you find on your Optimole website dashboard.
This is what it will look like:
Once you click on the green button which reads “Connect to Optimole Service,” you will see this screen:
Once the connection is established, you will see this:
The dashboard shows a few interesting things, which include the following:
- Monthly usage
- Monthly quota as per your plan.
- Percentage of the total quota used.
This dashboard is the basic one. You get the full dashboard with more information when you log into your account Optimole website. I will go there later.
Before that – the Optimole dashboard also shows the last optimized images and the level of optimization achieved. Here is what it looks like:
While on the dashboard, you can also see a separate tab by the name ‘Settings.’ This tab gives you some flexibility in choosing what to optimize and how to optimize.
Let me walk you through the Settings tab you see on the dashboard. Here is what you see on the Settings tab:
You will notice that there are two options under the Settings tab – General and Advance.
The General Tab
In the general tab, you can see these:
I have marked the images with four numerals. Allow me to explain each one of them to you.
1. Enable Image Replacement:
If you want, you can make the Optimole serve the images on your website using your website URL. This may be great if you want to submit an image sitemap to Google, and you want your blog to rank even for the images.
Doing so, however, will increase the load on your website’s server. If you don’t want to submit an image sitemap to Google, you can always make Optimole serve images using the URL from the CDN server URLs. This speeds up your website.
I don’t want my blog to rank for images. So, I always keep this option enabled. The image URL looks ugly though because the image domain the Optimole uses looks something like this: ml1vo9irnobr.i.optimole.com
That’s damn ugly, and no one can remember it! But who cares? People actually remember the URL to your website. The images are only a visual aid that keeps them glued to your site (apart from the content). They are never interested in remembering your image URLs.
2. Scale Images & Lazy Load:
This option allows for the lazy loading of images. They, however, use the pixelation technique. What’s that?
They will show the image placeholder where the images will be but in a pixelated format. If you scroll through the web page fast enough, you will see that placeholder with a blurred image. It will be so blurred that you cannot understand what is behind the blurred mask.
You may feel that it is a nuisance, but think again!
Some plugins will allow lazy loading, but they will use a technique in which the image placeholder will not be there. When you start scrolling, the placeholder shows up, pushing the content below.
That’s not good.
Recently Google has started using a metric called CLS in its PageSpeed Insights. CLS stands for the cumulative layout shift. It measures how much the layout of a webpage changes during load.
Have you ever encountered a condition when you wanted to click on something, and the content suddenly shifts, making you click on something else?
This is not a good experience for users, and Google will penalize you for this.
So, it is better to show a pixelated placeholder rather than using a lazy load technique, which leads to CLS.
What about scaling?
Scaling simply means that Optimole will scale the optimized images according to the viewport of the end-user of your website. The word viewport means the screen size. If images are scaled properly, they fit nicely on screen size.
You must have heard of this technique already while designing your blog or website. It is called ‘responsive’ design.
I will suggest that you keep this option enabled.
3. Enable Error Diagnosis Tool
You can leave this enabled. I don’t.
It is especially helpful if you see something broken on your website or blog. That can happen because of a plugin conflict. WordPress is infamous for plugin conflicts. That’s not the problem with WordPress itself. The problem comes with different plugins that different developers make.
It is the usual thing! Even Optimole has conflicts with other plugins (though I have never faced any such conflict with any plugin that I use). Some people have reported that Optimole has conflicts with Google Maps service.
If such a situation occurs, enabling this option will allow Optimole developers to drill down on the problem, and fix it, if possible.
4. Clear Cached Resources
Remember that Optimole uses CloudFront CDN to serve images. There are times when even though you update your website (update an old post or publish a new post), Optimole may continue to serve old cached images.
This happens because there is always a set time for cache expiry when the old cached files will be removed, and new cached files will be created.
If a situation like that is happening, it is better that you clear the cached files manually, and force Optimole to create new cached files.
Usually, site administrators and editors do not see cached copies of images. You should test this out by accessing your website from either an incognito browser window or from behind a VPN.
The Advanced Tab
The Advanced tab has multiple sub-tabs. What are they? Let’s find out.
Compression Sub-Tab:
The Compression sub-tab gives you the following four options:
- Network-Based Optimization: Enabling this will allow Optimole to serve low-quality images if it detects a slow network. I will suggest that you keep this enabled.
- Serve CSS & JS via Optimole: Enabling this option will allow you to server optimized CSS and JS files if they contain images. Some CSS and JS files may have images depending on the theme that you are using. So, it is better that you keep this option enabled.
- GIF to Video Conversion: Animated GIF files can be very heavy. They take a lot of time to load. So, it is better that you turn on this option. Optimole will then convert them into videos and serve them as webm videos. Webm videos are lightweight, and they load faster.
- Image Quality Selection: You can select the compression level using the slider. I will suggest you keep it to medium if you are using already optimized images. If you are using large non-optimized images, I will suggest you go for a high level of compression.
Resize Sub-Tab:
There are various image resizing options here. Here is what the tab options look like:
The three options available here are:
- Smart Cropping: This option will allow Optimole to identify the most interesting section of the image, and it will consider as the center of the image. It will crop your image. I don’t like that feature. Cropping an image in that fashion can just make it unbearably awful. I leave it disabled. What you want to do is up to you.
- Retina Images: If you enable this option, Optimole will serve images that are ready for retina screens. Rest assured that retina images will not show on non-retina screens. I leave this enabled for those users who use Mac computers or iOS devices. You should enable this option.
- Resize Large Images: There are already some preset values there. Leave them as-is. If the image that you are using is larger than that, Optimole will automatically crop and resize it. I usually use images that are cropped to specific dimensions and are always smaller than the default settings here. I don’t like any program auto-cropping my images. It doesn’t know what I want. So, I do it myself.
Lazyload Sub-Tab:
Heads up! This segment can get a bit complex. So, I will suggest that you use all settings that are default. Here is what the segment looks like:
Here are the options that you find in this sub-tab:
- Generic Lazyload Placeholder: Leaving this enabled will give pixelated Lazyload placeholders. Some say that it is not good from the user-experience perspective. I disagree. Seeing a pixelated placeholder for a fraction of a second isn’t that bad compared to a slow loading website. If you disable this, the page weight will increase, and so will the total number of browser requests. This will slow down your website, leading to a horrible user experience. Keep this on!
- Native Lazyload: Never turn this on! Some modern browsers have Lazyload option. Enabling this will kill the generic Lazyload option. Apart from that, it will also kill the auto-scaling of images based on users’ viewports.
- Scale Images: Leave this enabled because it will scale the images depending on the screen size.
- Lazyload Videos and Embedded iFrames: Lazyload for images is a good idea, and so it is for videos and embedded iFrames. This will ensure that your content (text) loads first so that the readers can start reading. They will need time to scroll up all the way to a video. By then, the video will load!
- Lazyload Background Images for Selectors: If you are using background images that you call using CSS, you can add them in the box. However, this is technical, and if you are not comfortable with coding, leave it blank just like I did.
Exclusions Sub-Tab:
The name is self-explanatory. You can exclude the images that you do not want Optimole to optimize. I will not suggest such selective non-optimization. However, you can always go ahead and do that. Many people do not like optimizing their logos. There are two types of exclusions, and they are:
- Prevent an image from optimization.
- Prevent an image from Lazyloading.
Here is what it looks like:
You can add as many images as you want to this list. Optimole will never touch them.
Setting Up Optimole On a Non-WordPress Site
If you are not using WordPress, you can still go ahead and use Optimole. If you are comfortable doing this on your own, it is fine, or you can ask some coder to do this for you.
You need to insert two scripts in the <head> tag of your site’s HTML. The scripts are:
<!– Add both scripts inside the <head> tag. –>
<!– You can change the quality parameter to any value between 1 and 100 –>
<script type=”text/javascript”>
(function(w, d){
var b = d.getElementsByTagName(‘head’)[0];
var s = d.createElement(“script”);
var v = (“IntersectionObserver” in w) ? “_no_poly” : “”;
s.async = true; // This includes the script as async.
s.src = “https://d5jmkjjpb7yfg.cloudfront.net/v2/latest/optimole_lib” + v + “.min.js”;
w.optimoleData = {
key: “ml1vo9irnobr”,
quality: “85”,
};
b.appendChild(s);
}(window, document));
</script>
And…
<!– Use the `data-opt-src` image property instead of `src`, add the image `width` and `height` attribute. –>
<img data-opt-src=”http://example_domain.com/img/opt_test_4.jpg” width=”800″ height=”600″ />
The segments in red are instructions. You don’t need to add them. The segments in blue are the scripts that you need to use.
I don’t know how Optimole service connects to non-WordPress sites. You have to figure that out.
Also remember, for these scripts to work, you have to whitelist the domains where you are using the scripts. You can do that from the Whitelist Domains tab on the Optimole account dashboard.
This is how it will look like:
Though I added two domains, it was not necessary because both of them have WordPress. I will anyway remove them as I did that for the purpose of this example.
The Optimole Account Dashboard
Coming to the account dashboard of Optimole, there is nothing important except for two sub-tabs under the Settings tab. You can see two options – Whitelist Domains and Custom Domains.
Whitelisting simply means that you have to add domains that do not use WordPress but use the Optimole service. You have to set them up using the codes I mentioned above.
The Custom Domains feature is quite interesting. It is available only and only if you are opting for a Business plan or anything above that.
With this option, you can quickly set up a custom domain from where you can serve your images.
This is particularly helpful if you want to server images from your domain, but still want the AWS CloudFront CDN to work for you.
An example custom domain can be cdn.yourdomain.com. You may alternately use something like images.yourdomain.com.
Setting this feature will require technical knowledge. If you don’t have that knowledge, you can ask for tech support from Optimole. They will help you to set this up.
The remaining options in the account dashboard will give you the option of changing your password, deleting your account, see your payment history, the number of visits, the bandwidth used, and the account overview dashboard.
Here is what the dashboard looks like:
It shows a lot of data as cards. The dashboard here shows the average compression achieved by Optimole is 81.17%. That’s a lot! It also shows how many websites are connected. The number of images optimized, and the CDN viewing bandwidth you have used is also shown here.
You can also see how many visitors have visited this month (out of how many allowed per month), and how many visitors your site had in the last 24 hours.
Here is a screenshot of the bandwidth used in the last 30 days:
You can also see the number of visits to your website from the Visits tab. Here is what it looks like:
In this image, you can see the number of visitors to your website for a specified date range. You can change the date range to see how your website has been performing.
You can also see the old image size and the optimized size for a list of last images that Optimole optimized.
The dashboard is fairly simple and straightforward. There are no big surprises or complex stuff for you to deal with except the option of a custom domain.
How Does Optimole Work?
One interesting thing happens when you use Optimole. It will not touch the images that you are uploading on your server. Instead, it will upload the images to CloudFront servers across the world and optimize them.
They will serve the optimized images from the CloudFront servers. So, the service doesn’t optimize the image on your server, leading to less server load.
Yet another beauty of this type of off-site processing is that if someday you want to part ways with Optimole, you can quickly uninstall the plugin (or remove the scripts) while keeping your original images intact.
They use Lossy compression (that I know for sure). Some say that Optimole even has a Lossless compression option. Unfortunately, I did not come across that option neither in WordPress dashboard and nor in the Optimole account dashboard.
Most likely, Optimole had the option several years ago, but they have removed it. Lossless compression retains redundant data in images. They increase the image weight. So, even if you find the option (which I am sure you won’t), I will suggest not to use it unless you are a photographer.
Pricing Plans of Optimole
Okay, this may come as a shocker for you! Many services offer these services at a fraction of the cost of what Optimole offers.
Here is a quick table that will summarize the pricing for you:
Plan Name | Features | Yearly Pricing | Monthly Pricing |
Free |
| Free | Free |
Starter |
| € 19.08 per month | € 22.9 per month |
Business |
| € 39.08 per month | € 47 per month |
Business 2 |
| € 69.08 per month | € 83 per month |
Business 3 |
| € 149 per month | € 179 per month |
Business 4 |
| € 239 per month | € 289 per month |
Business 5 |
| € 359 per month | € 429 per month |
Custom |
| Flexible | Flexible |
Some say that they charge high because of the CDN they offer. Unfortunately, there several competing services like EWWW Image Optimizer and WP Smush that also offer CDN. In fact, EWWW Image Optimizer has almost every feature except Lazyload, and yet it is very cheap.
I never found an answer to this question. Let me know if you find an answer.
Pros and Cons of Optimole
Optimole has its fair share of strengths and weaknesses. Here is a quick list of what you need to know:
Optimole Advantages:
- The service makes copies of the original image on CDN servers and then optimizes them. Off-site optimization prevents server load.
- It does auto-processing the moment you upload any image.
- It allows bulk processing (it is the default mode, and there is no option to change).
- It allows excluding images from optimization (a great feature if you want to avoid logo optimization).
- It uses Lossy compression and removes metadata.
- Includes the Lazyload feature.
- Provide CloudFlare CDN (from Amazon Web Services).
- It allows setting the image optimization level.
- Auto scales images depending on users’ browsers and viewport.
- Offers a native WordPress plugin for easy integration.
- Works with other non-WordPress websites.
- Serves both webp and webm images (next-gen image formats introduced by Google).
- Allows adding a custom domain.
- Offers detailed analytics data.
- There is a forever-free plan available for new websites.
- It is compatible with almost all plugins, various famous page builders like Beaver Builder, Elementor, and Gutenberg block editor that WordPress introduced with version 5.0.
- The processing happens in real-time but in the background. Your readers will almost immediately get the optimized images to their browsers even if they are visiting your website right when you post something.
- There was watermark support earlier, but Optimole removed it! Good riddance! Watermark works if an image is your intellectual property. Buying stock photos and using them on your website or blog doesn’t make them your property. So, watermarking may land you in trouble.
- The setup process is extremely easy, and you can have it up and running within 5 minutes.
The Optimole Disadvantages:
- It doesn’t allow scheduled optimization.
- It doesn’t allow individual image optimization.
- It doesn’t allow optimization based on image formats.
- It doesn’t allow filtering out folders from the optimization process.
- It doesn’t allow skipping optimization based on image size.
- It doesn’t allow to disable automatic optimization.
- The free version is useless for small to medium websites.
- The premium versions are very expensive, and they are not suitable for websites with a small SEO budget.
Conclusion
I found Optimole to be a great image optimization tool. People do complain about the lack of certain features, but I feel that it is a blessing in disguise. Too many options during the setup process can confuse people (especially rookies).
The only big problem with this plug-and-play or run-it-forget-it image optimization tool is the pricing structure. It is too expensive. You can find similar alternatives for a very low price, but with many more features that allow fine-tuning your image optimization goals.
So, should you use Optimole? Yes, you should, but if you have a budget for the service. Honestly, its cost often repels potential buyers, who eventually settle for cheaper options like the EWWW Image Optimizer.