While that’s great for the general industry, it means a rise in competition for those of us already in ecommerce. When competition increases, potential customers have a lot more options to choose from. In ecommerce, sales are no longer just about finding the best price and the shortest delivery time.
This is where user experience matters more than you might think — 42% of users will leave a website because of poor functionality. If you take the time to test a new product page before you publish it, you’ll be saving nearly half of your potential customers.
In this post, I’ll cover why you should be mindful of QA testing if you run an online store, and three tests you should conduct on every page on your site to ensure a seamless user experience.
Why test a page before launching it?
Web development for ecommerce websites can be time-consuming, especially if you have a lot of products to list. It’s understandable if you’ve thought about skipping the testing part and just hitting publish to save time.
After all, you’ve seen the website, right? The pages load and the photos look great. What could go wrong?
Well, a lot of things:
- The page loading speed can differ between user locations, devices, and internet connections.
- Security testing is critical since you handle payment transactions — never cut corners here!
- New bugs can appear even on websites that have been tested and published long ago when you add a new page. This is why testing every page is important.
- If you use extensions or plugins (like with WordPress/WooCommerce), integrations have to be tested regularly. For instance, if you use the HubSpot WordPress Plugin to track conversions, you want to make sure it works on all your pages.
- Catalog inconsistencies are very frequent when you publish new pages.
There are dozens of tests you can (and should) perform when you launch a brand new entire ecommerce website. On the other hand, when you’re simply adding a new product page, things become much simpler.
While I’d encourage anyone to test as many things as possible, as often as possible, I know that you can’t spend weeks on every page you have to publish. So, here are the top three tests that cover the most common UX issues your potential customers may experience.
3 Tests to Perform Before You Publish a New Page
Ecommerce pages consist of many different elements — product descriptions, customization options and filters, product images and videos, reviews, and review videos, just to name a handful.
1. Are your videos uploaded correctly?
92% of shoppers say that visuals of any kind will influence them and a whopping 64% say they are likely to make a purchase after watching a product video.
Video reviews have an even better reputation, with 84% of viewers willing to buy after watching them.
Of course, a probable 64%-84% increase in conversions can happen only if the video is displayed correctly. So here’s what to check when you publish a video:
- Did you export it in the right format? If not, it won’t be viewable to people who are not logged in as website administrators.
- Does the page still work if multiple people are watching the video at the same time? I recommend installing a caching tool or plugin. A caching tool shows users a cached version of the HTML page instead of loading it completely new every time.
- Is the compression rate correct? If the video looks like it’s poor quality or if it slows down your page, you may need to adjust your video’s compression rate.
- If your product page displays a video that’s hosted on YouTube, make sure that the privacy settings on YouTube are correct. If the video is set to private, it won’t be accessible.
2. How does changing your branding or fonts impact an ecommerce page?
Tweaking your website’s appearance regularly is common. In fact, it’s recommended that you keep trying new ways to engage and convert visitors.
But, keep in mind that every time you change a design component on the page — even something as innocuous as a font — things can break. For instance:
- Unexpected layout shifts: This means that elements on the page move around without any user interaction. This is highly detrimental to your UX since it can disorient users and cause them to click the wrong thing by accident. You can fix this issue with a single line of CSS: font-display: optional. This little line tells the browser to use a fallback system font if the new one is unavailable when the text needs to be rendered.
- Cumulative layout shifts happen when a page’s structure changes unexpectedly. For example, when a user clicks on a link or a button, the page is expected to change. If the change occurs for no reason, it’s typically because dynamically loaded fonts have changed the rendering behavior.
- Some fonts can simply be displayed incorrectly. If the fonts aren’t properly loaded, certain blocks will default to a “regular” font like Times New Roman. Before you publish a new page, make sure there is font consistency.
- Different browsers behave differently when a font is not ready for use. Chrome and Firefox will hide the text for up to 3 seconds, then display a system font, while Safari will keep hiding the text until the font is ready. Make sure to check your page on several browsers.
- Some fonts can harm your loading speed. Test your page speed before and after changing the fonts.
3. What can break when you add product reviews?
Nine out of 10 customers read reviews before making a purchase. 83% of them say that the reviews have to be relevant and recent in order to be trustworthy.
Thus, you have a lot of reasons to add reviews to each product page and to keep adding them regularly so you always have recent ones. But, adding reviews isn’t always seamless:
- Adding reviews manually may cause them to be displayed improperly. A reviews plugin usually solves this problem. Plus, it’s easier to add them this way than to write code manually.
- If you want to post reviews from third-party platforms like Yelp or TrustPilot, check to see if they are displayed properly. In some cases, an ad blocker can prevent them from displaying on the live website, although they look just fine in preview.
- Redirects can affect the display of your reviews. For instance, the reviews may look fine on domain.com. But if you have a redirect to domain.com/en, some plugin-powered reviews may not be displayed. If this happens, make sure that your redirects are added manually.
How do you test when your ecommerce store grows?
As your online store grows, manual testing becomes impossible. You’re probably publishing tens of new pages every week (or even every day), so you’ve definitely outgrown the manual testing phase.
Luckily, you don’t have to hire an entire web development department just to squint at all your videos and photos. Visual testing can be automated.
With automated visual testing solutions, you can test hundreds of pages per day. This means you can scale up as much as you want as fast as you want. More importantly, this growth will be sustainable and it will never be hampered by bad UX.
Avoid UX problems with proper testing.
When you add new pages, a lot of things can go wrong. And even if you leave your website as is for a year, things can still break. Plugins need to be updated and integrations need to be checked periodically.
If you don’t want your users to be deterred by a poor UX experience, testing is the key. Yes, it adds some time to your go-to-market strategy, but this is preferable to launching a glitchy page and losing nearly half of your users.
The good news is that the more you test, the easier the process gets — especially when you automate your tests.