WooCommerce is a popular e-commerce platform for WordPress. It offers great functionality but also has its challenges. Our team found a problem with WooCommerce’s performance, and we created a ‘power tweak’ feature that fixes it. This feature is one of two power tweaks available in our plugin. It makes your website more efficient by optimizing a WooCommerce database query.
What is the issue with WooCommerce?
We’ve found that WooCommerce has a critical performance issue related to one of its database queries. The query lies within a function called ‘get_total_spent’, used to calculate the total amount of money spent by a customer. The query makes a calculation using several double left-joins on the post and post meta tables for lookups. This process is inefficient, as MySQL must scan a large number of rows with each new order. On a typical site, this could involve scanning over 80% of the rows in the post meta table. In one case study, MySQL had to scan over 13,000,000 rows, significantly impacting performance and user experience.
Our solution
As developers, we’ve learned that finding our own solution is often the best way to get things done. So, we engineered this feature to confront the WooCommerce query dilemma head-on. We suggested that WooCommerce use two simpler SQL queries instead of that one complicated query. However, in the absence of changes from WooCommerce, we’ve taken the initiative.
WP-Optimize has a feature called ‘power tweak’. It replaces the problematic double left-join query in WooCommerce with two shorter, more efficient queries. This enhancement is crucial for sites with high volumes of orders.
To learn more and stay updated, check out our Github thread where our lead developer and founder, David Anderson, discusses this issue.
The free version of WP-Optimize significantly enhances your site’s performance. It simplifies complex tasks like image compression, database cleanup, and caching, making them accessible – even to those who aren’t tech-savvy. This ensures that your e-commerce site runs smoothly, providing a better experience for your visitors.
Our power tweak features are just two of the many features of premium. Other benefits include: even faster page loading speeds, tools to clean up your media library by removing unused images and image sizes, premium support, and so much more.
The latest version of WP-Optimize is now compatible with even more of your favorite plugins. For both the free and premium versions of WP-Optimize we’ve improved compatibility with:
All In One SEO We’ve added compatibility with WP-Optimize’s minify feature. This feature helps save space by reducing the size of your HTML, CSS and Javascript files.
Custom Permalinks is now compatible with our cache feature. With caching, users who visit your site are served local, static copies of your site’s files leading to huge improvements in page loading times for a faster, more efficient website.
The following improvements apply to WP-Optimize Premium:
WP-Optimize Premium now correctly detects banner images within Elementor and is able to optimize them effectively.
YITH Point of Sales is now also compatible with WP-Optimize Premium. Plugin point-of-sales pages are able to function correctly.
Lazy Loading can now be enabled with Smart Slider 3 without disrupting how images are displayed.
Finally, we’ve made a number of fixes that apply to both the free and premium versions of WP-Optimize:
Users were previously seeing a PHP warning or non-fatal error when converting to WebP where race conditions occurred. This was caused by the same script being executed twice, and has now been resolved.
Database responsiveness has been improved; exceptionally large databases can now be processed more effectively.
If WP Optimize is uninstalled, files and settings created by the plugin are automatically removed or reverted.
For a full list of tweaks and fixes, please see below:
Changelog
* FIX: HTML minify should not remove title tag added by AIOSEO
* FIX: Premium – Fetching unused images data is incorrect when previous task queue is not properly unlocked
* TWEAK: Premium – Prevent conflicts between the minify feature and the YITH Point of Sale for WooCommerce plugin
* TWEAK: Premium – Compatibility issue with Smart Slider 3
Fast, efficient website optimization
WP-Optimize helps you to boost the performance of your WordPress website. It will shrink your database size, compress large images, clean up spam and unapproved comments, report on database tables with overhead and wasted space, and cache your site. The result is a leaner, faster, more organized website. Our Premium version includes enhanced functionality such as multisite support, sophisticated scheduling options, and is compatible with campaign tracking queries like UTM tags. If you think WP-Optimize could be the right solution for your website, you can learn more
In February and March 2023, we released various features, fixes and tweaks, the most significant of which offers even more optimization opportunities for existing and new customers alike.
Compress image sizes by up to 34%
WP-Optimize 3.2.13 brought new features to users, specifically the ability to convert images in the media library to the WebP format.
This feature was first introduced in 2022 however only new or uncompressed images could previously be converted. Release 3.2.13 means already compressed images can be further compressed with the WebP image format.
It helps speed up your site by cleaning the database, compressing images and caching your site. Optimized websites means higher rankings in Google, a better user experience and therefore improved engagement with your website or business.
For added optimization you may wish to consider an upgrade to WP-Optimize Premium.
You can get a 10% discount for doing so right now, and up until 5 April so it’s a good time to consider giving your WordPress website a turbo boost.
Premium is loaded with added features like Lazy Load where images and videos load gradually as they become visible to the user. This allows a page to load much faster compared to the simultaneous loading of all web parts, without affecting the user experience.
Load webpages faster, identify orphaned images and get premium support.
Get more advanced options too, like the ability to optimize your site using the WP-CLI. Premium is compatible with WordPress multisite, WooCommerce and various other add-ons, including multilingual and multi-currency WordPress plugins.
Get 10% off Premium until 5 April with code ‘turboboost23’ at checkout.
In February and March we also brought you
Improved compatibility with WP Hide. WP Hide literally hides your WordPress plugins and themes so the code can’t be seen or exploited by malicious users (3.2.11 – Premium only).
A fix was applied to ensure nonces are checked correctly. The fix avoids any risk of attackers tricking admin users into changing the configuration of WP-Optimize (3.2.12)
A security issue encountered in SimpleHTMLDOM, a third-party library was resolved (3.2.13)
Improved compatibility with the Advanced Custom Fields (ACF) WordPress plugin (3.2.13)
WebP images used in posts or pages were incorrectly being marked as unused which was corrected. WP-Optimize also now recognises where images are used in Yoast SEO, marking these as used (3.2.13)
Compatibility with WordPress 6.2 affecting some customers with PHP 8.x was resolved (3.2.14)
On Friday 26 August, Gilo Varghese, founder of Flying Proxy, a CDN, tweeted the following allegation about WP Optimize: https://twitter.com/GijoVarghese_/status/1563097754322501632 . We were not contacted directly but learned of it a few days later when we were asked by a WordPress news site to comment.
In short, the allegation is that WP-Optimize are deliberately deceiving its users by appearing to use page speed tools like GTMetrix to be faster than sites actually are, and are doing this secretly for the purpose of making WP-Optimize look better.
Varghese then proceeded to respond to users who responded to his Tweet to ‘plug’ his company, Flying Press, which is a competitor to WP-Optimize, with a competing plugin product:
The tweet was widely circulated, and resulted in a WP Tavern article yesterday on the allegations. This was a UK public holiday, when many of our team were away and we didn’t have time to fully investigate the allegations. We were given a few hours before publication to respond, but at that time our main WP Optimize developer was already, in his time zone, asleep.
The team at UpdraftPlus (owners of WP-Optimize) investigated today and found the allegations to be completely false. The truth is actually the reverse – it is the allegations which have been presented deceptively, missing out obvious and key facts.
The most fundamental is that feature used to construct the claim clearly says in the user interface “…if you would like to exclude scripts from page speed tests”. The allegation by contrast implies this is hidden only in the code.
Secondly, the advanced setting used in the allegation is a valid feature, useful to find out whether the essential JS/CSS files are actually slowing down the web page or not. i.e. It has a proper use. This feature is by default, turned ‘off’ and only enabled by advanced users who know what they’re doing.
Joe Miles, a manager at UpdraftPlus said “the claim is the plugin is being deceptive, but it’s actually an explained setting in advanced settings which a site owner would have to decide to use, which have been used to falsely claim that WP-Optimize is manipulating things. The setting is a valid tool for testing. So UpdraftPlus will not be removing it and we’ve asked for the false accusations to be deleted.”
Peter Wilkinson from Divi Engine who developed Divi Nitro, (a speed performance plugin which is not affiliated with WP-Optimize, but actually a competitor), investigated the claims and said “Initially I was shocked at the news and as a competitor, thought it was bad practice to be deceiving customers.”
“Upon further investigation, I found out that it was actually far from the truth. In reality (from my research) WP-Optimize do not “cheat” pagespeed tools when you install or minify your Javascript.
“To “cheat” the tools, you need to manually add the JS files you want to asynchronous load to a setting that clearly has the label “Use this if you have a completely independent script or would like to exclude scripts from page speed tests (PageSpeed Insights, GTMetrix…)”
Wilkinson made this very clear video to show how the untrue allegations have been unfairly presented in a way that misleads people:
“It just goes to show that you should not believe everything you read or hear. Test everything to make sure it is the truth.” Wilkinson added.
“In my view, Gijo Varghese has used deception to promote Flying Pages and Flying Press.”
Adam Lowe, President of PeakPerformanceDigital.com who was initially quoted in WP-Tavern as asking UpdraftPlus “how are we supposed to continue trusting your company with my clients’ backups when you use these deceptive and fraudulent practices?” replied today in support of WP-Optimize. He said:
Meanwhile, Andrew Palmer of WP Plugins Plus, tweeted that he believed the original claims to be false:
Summary: Gijo achieved the result that he did by using a clearly labelled expert feature with explained possible use cases to do something else. He then presented this as the normal but dishonestly hidden result of using WP-Optimize. This should never have been made a news story. We do not encourage anyone to try to “game” PageSpeed scores, and Gijo’s allegations that this is our secret intention that people would do so is unworthy, and we hope he will do the honourable thing and retract it. If any other users are puzzled by anything else in WP-Optimize, we hope that instead of stirring outrage on Twitter, they will ask us about it in a support channel.
Having engaging, clear and fast loading images on your WordPress site is one of the most effective ways to draw a user/customer in. There is a reason that car dealerships spend so much time making sure that the new models are spotless and sparkling. The visual impact of a product can often be the make or break decision between success and failure. Online showrooms are no different, plus there is the added complication of how an image can impact your loading speed. It is a well used and famous metric, that a user will leave a website if it takes more than 3 seconds to load. If a website does take more than 3 seconds to load, then there is a good chance that the images you have on your site are part of that reason.
So as a WordPress site owner, what can you do to ensure that the images you have on your site are both appealing to users and allow your site to load quickly. Your initial instinct might just be to shrink the image down from a 1800×1400 size image to 300×200 size image. This would be the wrong course of action to take, as while your image file size might now be a lot smaller, the quality of the image and user experience has suffered as a result. If you have a car showroom sales website for example, customers will want to get a really good look at the car and be able to see all the features and detail. By making the image so much smaller, any detailed inspection of the car is now impossible – leaving the potential customer frustrated and looking elsewhere.
So what are your options? Thankfully, there are dozens of different image file options you can choose from, ranging from the high quality, but large file size BMP, the tried and tested JPEG, to the new and widely unknown WebP format. Along with choosing the right format, it is important to remember that regardless of what format you choose, you can additionally reduce the image file size by employing a process via WP-Optimize known as “compression”.
Site speed is one of the top 10 most important factors Google bots crawling your website observe when they are ranking your site in the search results. Having poor loading speed can badly impact on the ranking of your site and can easily take your site from the first page, to failing to be indexed by Google. Google is very strict on how they rank sites in their search algorithm and if they find that the site offers a poor user experience due to slow loading times, they might not even go through the trouble of even crawling it and making it discoverable via Google search.
Which image format should you choose?
As high quality images are so important for any modern WordPress website, you need to know which format to use, how they affect the performance of your site and how to get the best out of your file selection.
The two most popular image file formats for websites are PNG and JPEG/JPG. According to w3techs, more than 70% of all websites use these file types. Around 30% of sites use SVG and 22% use GIF.
This is where image file types would come into play as the type of file you use to upload your images play an important role. As there are so many different file types, we will go through the most popular ones and their pros and cons down below:
Before we jump into the type of file we need to understand some concepts before, like what a raster and a bitmap image are? What is compression? What is the difference between a lossy and lossless compression?
Compression – Lossy Vs Lossless
Both of the compression types are aimed at reducing the file size, but it’s what they remove that really matters. In Lossy compression; important data that is relevant to the quality of the image is removed. This can be reflected in the image being pixelated in some cases as your computer can have trouble reconstructing the image.
In lossless compression, irrelevant data that is present in the image (such as metadata) is reduced, which helps reduce the file size. The image quality is not affected at all in this process.
Raster Vs Vector
The most commonly used image file types are typically raster-based. This means that they have a fixed RGB color value associated with every pixel and all of those pixels are combined and used to create a whole image.
Examples of such file formats include jpg, png, and gif.
Alternatively, a vector image is created using shapes and lines that can be scaled infinitely without them ever being pixelated. The vectors are created using mathematical formulas that allow users to change the values, while not affecting the quality of the image.
Now that we have gone over the basics of the images, we can now look at the details of the different file types.
JPEG:
This is a digital image format that contains compressed image data. With a 10:1 compression ratio, JPEG images are used as they are very compact. JPEG format contains important image details and is the most popular image format for sharing photos and other images on the internet. The small file size of JPEG images can also let users store thousands of images (for example on an art site) without the need for extra storage space on your site.
JPEG is a lossy compression file type that works well for photos, but it is recommended that you use another format when working graphics, such as PNG.
A JPEG image file example. You can see that the detail and quality has been maintained when uploading.
PNG:
PNG is a popular bitmap image format and is short for “Portable Graphics Format”. This format was created as an alternative to Graphics Interchange Format (GIF). PNG has some great features like containing 24-bit RGB color palettes, greyscale images and displaying transparent backgrounds. A lossless data compression method is also used in PNG images when working on high quality images or graphics. PNG images are also frequently used in Image editing as they can give the user more control and options on the image over traditional JPEG format.
PNG also uses a lossless compression algorithm, which means this format can retain more data than JPG. When using a PNG image file, users can also save these images with a transparent background. By using this format, users have the option of working with layered images that can show a clear background (for example – just the flowers in the image below and not the background wall), enabling users to add the image to other images without the need to cut it out and remove the existing background – as you would have to with a JPEG image. This is one of the main reasons why it is the preferred choice for graphics like diagrams and illustrations. PNGs are known to be more popular for users working with graphics, rather than uploading standard photos.
A PNG image maintains high quality, while also allowing you to have more control over the image
GIF:
You probably know the term “GIF” best from the countless short clips you are sent on messaging apps. GIF stands for “Graphics Interchange Format” and is mostly used to support animation without audio
Unlike JPEG and PNG, GIFs are used in a more niche case and are not typically used for static images (although this is possible). If you use a GIF on your WordPress site, it is most likely in order to show you visitors a simple animation or process. GIFs have a limited color range and are best used for simple graphics. They use lossless compression and tend to be smaller than JPGs. It is generally recommended that you only use GIFs sparingly in your site, as they can increase loading times (given the file size) and are limited to 256 colours.
An example of a GIF image. The quality of the original image has been greatly reduced in order to produce the animation.
SVG:
Scalable Vector Graphics (SVG) is a web-friendly vector file format. As opposed to pixel-based raster image files like JPEGs, vector files store images via mathematical formulas based on points and lines on a grid. This means that vector files like SVG can be significantly resized without losing any of their quality, which makes them ideal for logos and complex online graphics.
Vectors are best only for simple graphics, shapes, and illustrations. SVGs are a good choice for logos, especially if you need your logo to be responsive and are supported by most browsers including Chrome, Firefox, Edge and Opera.
An example of the sunflowers in a SVG format that you would use for a logo.
BMP:
BITMAP is now considered an outdated image format. BMP loads the images in a lossless image format which can result in huge file sizes due to the lack of compression. Considering the importance of loading speed and how site creators want to keep the image sizes to a minimum (not to mention the popularity of SVG and JPEG formats), this format has become largely unused for online images.
The original quality of the image is maintained when uploading in the BMP format, but the file size will badly slow down your site and is not recommended.
WebP:
This image format was created by Google in 2010 and is starting to prove popular with people who upload lots of images to their site as it has several advantages over JPEG and PNG, such as having better lossy and lossless compression performance.
WebP also typically uploads in smaller file sizes than JPEG or PNG formats given its improved compression performance and will take up less space on your site – allowing it to load faster. While it isn’t supported by all browsers, it is supported by all the most popular browsers – including Chrome, Firefox, Edge and Opera.
Though not as well known as JPEG and PNG, WebP could prove to be the image format of choice in the future.
Conclusion:
There are many types of image formats that can be used on your WordPress site, but it is important to evaluate the purpose of the image. If your site is for a wedding photographer for example, you will want to maintain high quality images that still load quickly and are user friendly (JPEG). However, if you are selling images in an online poster store, then you will want to maintain as much detail and image information as possible (PNG).
As a general rule of thumb, if you are just uploading standard images for your online store, blog, portfolio, social media or social media site – then it is recommended that you upload you images in a standard JPEG format and then use WP-Optimize to further compress your images
However, should you wish to future-proof your images and improve your loading speed as much as possible, then WebP can offer superior lossy and lossless compression, while still maintaining high levels of details. Whatever you decide, remember to always compress your images using WP-Optimize for the market leading compression.
Now that you have contributed so much of your time and money to your shiny new WordPress website and have showcased your talents to the world, it is important to ask the questions; “Did you pay close attention to perfecting the WordPress user experience?”
Today’s tech-literate consumers have high expectations, which is why a website that feels clunky and awkward, just isn’t good enough. Providing the best user experience for your WordPress site should be paramount. No matter how professional or high quality your products or services are, if your site showcase doesn’t give a high standard of customer user experience, you will be doomed to failure.
In this blog, we have put together a guide on how to greatly improve user experience in your WordPress site with 7 strategies to succeed.
Why is the user experience so important?
In a world filled with so many digital options and distractions, providing a good user experience can be one of the main keys to success. Take Uber for example. Uber revolutionized the taxi industry with a new way to order and track cabs by using an intuitive and simple-to-use app on your mobile phone. Uber is now a world-wide multibillion-dollar company with services in most cities – largely thanks to its innovation and consideration of the end-user.
The same theory applies when creating your WordPress site. Whether it’s a blog, an online store, a marketing hub, or a portfolio for your services; your chances of success are intrinsically tied to the positive level of user experience you provide.
Here are some of the most obvious and measurable benefits of a good user experience:
Set a good first impression of your brand
Setting a good first impression is important for showing potential customers you’re the real deal. It doesn’t matter how good your products, services, or content are, if your WordPress website isn’t aesthetically coherent and functional, no one will want to use it. Users must be able to navigate your pages with ease so that they get an immediate sense of direction and understanding on how your site operates.
Increased sales
Any website that makes the purchasing process straightforward and easy to follow iis more likely to see an increase in sales and revenue. To put it simply, the easier it is to browse and take action, the quicker users will be able to act on impulse and purchase products and services from you. Simple features like search filters and recommendations can enhance the user experience by giving them multiple options to begin the buying journey.
It’s a win-win. A positive experience for the customer and more sales for your business.
Increase user retention rates
Offering the best user experience keeps customers coming back for more. Satisfied customers will not feel the need to look elsewhere if you’re meeting their expectations. Existing customers are also likely to recommend your site to others and become brand advocates if you offer a professional and friendly UX.
Improve search engine optimization (SEO)
Take a look at the top-ranked sites on a search engine like Google and you’ll find they all have a professional high end user experience design. The days of cramming as many keywords as possible into your content to rank via SEO are long gone. Google has expanded how it ranks websites and how it views SEO requirements by including such elements as UX design. It is important to remember this when it comes to setting and designing your site using WordPress.
How to improve user experience in your WordPress site: 7 strategies to succeed
Creating a popular and (potentially) profitable website means putting the user experience first. Try putting yourself in the shoes of a new customer, and design your site around their experience, rather than how ‘amazing’ your product is. The user experience goes hand-in-hand with usability and functionality.
It is important to remember that sometimes less, really is more. Don’t sacrifice functionality for an overly pretty and complex design. Ask yourself, ‘Would I find this website easy to follow if I came here for the first time?’ Users value usability and useful features over crowded visuals. For example, always put buttons where you would expect to find a button. Make your potential customers’ life as easy as possible, as they will quickly abandon your site if they struggle to perform a simple task or have to go looking for the ‘buy button’.
A conventional blog format is suitable in many instances, that is, a header, followed by the main body and a sidebar, completed with a footer. From here, you can make subtle tweaks to enhance the overall design. Be sure to give it a quick mobile friendly test to ensure it’s appearing correctly on mobile devices.
It’s all about getting that balance between form and function.
A navigation bar (this is a must-have) Naming key pages for your navigation bar is simple with WordPress. Simply click (Appearance > Menus) in your sidebar to customize your menu’s order and page names.
A list of categories in your sidebar Having an easily viewable list of categories will allow users to quickly navigate to their general area of interest. For example, if they are in the market for a new TV, they can browse all TVs available on your site, without having to also view Laptops.
A search tool Imagine a customer has come to you specifically for a bluetooth headset, give them a search bar to find them fast. WordPress has several search bar plugins for you to try. Some are free while others are paid for.
An archives page For an Archive page, let users search previous content by date, category, and keyword. This will help users find content fast while also helping your WordPress SEO strategy
Breadcrumbs Breadcrumbs are the navigational links found at the top of a page to tell you where you are on the site. For example, (Home > Blog > January 2022 > How to nail your WordPress website.)
Utilizing these common design features on your WordPress page is a great way to create a familiar experience for users.
3. Make sure your homepage is useful and informative
Your homepage is almost certainly going to be the most viewed page on your website. Think of it as your personal shop window for what goods and services you have to offer. Feature boxes can be a useful addition to the homepage. A feature box pops up on the homepage and can include content of your choice. A popular strategy is to use an ‘Opt-in’ box to introduce yourselves and encourage users to sign up for deals, information and discounts.
The best alternatives out there for your favorite tools.
The best tools for collecting and analyzing key data…’, etc.
A well-placed feature box involves the visitor right away and tells them what to expect and how to get more from your site. This can add to a better user experience. However, it is important to make sure your feature box contains legitimate and valuable information and doesn’t just present as an ad attempting to get the visitors email address.
4. Is your content easy-on-the-eye?
Content that looks visually appealing is more likely to attract visitors and keep them engaged. Remember to take inspiration and design cues from other popular websites in your niche area to get an idea of how their visual layout enhances the user experience.
When designing your site, also be sure to pay attention to design elements, typography choices and formatting. Have a look at other popular websites to see what they look like and what choices they made. Once you’ve found inspiration, you can use a pre-existing layout template to start from, or design your own layout from scratch.
In terms of formatting, consider the following:
Keep sentences and paragraphs short and sweet.
Use sub-headers to break sections up and make navigation easier.
Use bold to highlight keywords and phrases.
Italics are useful for emphasis and speech.
Images are useful for adding variety and color to a piece.
Other visual elements such as tables, lists and quotes help break up the site and provide extra information.
Creating a good user experience means nailing a design that’s easy-on-the-eye, while also being practical.
Today’s website users expect fast page speeds and sites that load in a second or two at most. In fact, having a slow loading site is the top reason visitors will leave.
Ways to increase page speed include:
Using only necessary plugins Running multiple plugins is one of the leading sources of slowing your site down.
Watch your image sizes Image compression plugins like WP-Optimize reduce the file size of images to boost loading speeds.
Use a Content Delivery Network service (CDN) This adds a level of protection against WordPress security issues too.
Enable caching Saves user data to reduce future loading times. WP-Optimize is also one of the leading caching plugins available for WordPress
6. Include plenty of negative space
Also known as white space, negative space refers to the parts of your page that have no content.
Somewhat ironically, negative space usually leads to a positive experience. Utilizing negative space lets users focus on the important aspects of your content without being distracted. 84.6% of web designers believe crowded web design is the most common mistake by small businesses.
Today’s consumers visit dozens of web pages a day. It’s likely they’re going to scan through your website anyway. A clever use of negative space lets them do this at their leisure without becoming bored.
7. Have a clear call-to-action
What use is your website if you don’t tell users what to do next? Far too often, visitors will leave a website without taking action simply because there was no clear CTA. A well-placed and well-worded CTA is key for boosting your WordPress conversion rates. Modern users want fast results, so placing your call-to-action button immediately after or halfway through your written content is a good way to go.
Effectively, you want to make it easy for the user to take the desired action without them having to search around for what’s next. WordPress has some useful plugins for managing CTA’s, have a look and see what works for you.
Final thoughts
Now that you have reviewed all the potential ways you can help improve the user experience for your WordPress site, these tips have got you thinking about the ways you can employ them to help boost your performance and SEO score.
The strategies above are commonly used across successful business websites all over the world on both WordPress and non-WordPress sites. Failing to have your own strategy could see you fall behind the rest and struggle to gain a foothold in your particular niche.
Start building your next WordPress website today, and remember to keep the user experience in mind in everything that you do.
Recent Comments