11 Best Practices to Optimize Product Pages in WooCommerce (With Examples)
Running an online store involves taking care of so many different aspects. It is by no means an easy task. It’s not only about selling good products, you need to consider your logistics, stock, pricing, store design, checkout process, product pages, traffic sources and so much more.
One of the aspects of running a successful eCommerce store that is often ignored is the product page (sometimes called product landing page). You need to make sure your product page is optimized to boost conversions, why and how?
Simply because the product page plays the most important role in any online business, as it is the stage at which you have to convince the customers on why they should buy your product and not others they have seen on other sites.
A good online store product page should “at least” have the following features:
Beautiful and attractive: This catches the customers’ attention and makes them want to know more about the product. With the combination of a good description, high-quality photos, and videos, the customer will be more likely to buy.
Simple and clear: Yes, you want to include everything about the product to convince the user to buy it, but this will be more harmful than useful. The product page should be easy for the customer to navigate. You need to make sure the customers can know more about the product within the shortest time possible. Also, make it easy for them to take action by using a clear call to action button.
Detailed: It should communicate well about the product and answer some of the questions that the customers may be having. A detailed product page should have a good product description, reasons why the customers should buy from you, the benefits of the product, and additional offers that come with the product if available e.g. discount, delivery, etc. This gives the customers a better idea of what they should expect from the product.
Fast loading speed: Apart from your website, customers may also have seen a similar product on other websites or are busy searching. Therefore, if your product page takes long to load, the customers will just navigate away, and this decreases conversion. So make sure the product page loads fast. You can read more on optimizing WooCommerce performance here.
Besides having a well-built website that loads fast, you need to pay attention to page size, because with modern cameras. It’s very common to have product images that are +10 MB in size, imagine uploading 5 or 6 of these to your product page! How will the experience be like for the user?
You think your product will sell regardless of how well-organized your product page looks like? Then let’s take a look at the extra perks you will get by maintaining nice & stylish WooCommerce product pages.
Why You Should Optimize Your WooCommerce Product Page?
More sales: A well-optimized product page is likely to attract more sales as compared to a poorly optimized one. This is because customers buy according to the way they feel about the product. With a good product page, they feel convinced that the product is a good deal for their cash, solves their problems, and they are more likely to purchase from you.
On the other hand, a poorly optimized product page turns off the customers as they are not satisfied enough to want to buy it.
Organic traffic: The product page can be a good source of free traffic from Google and other search engines when properly optimized in terms of SEO best practices.
Some of these practices are having a good title, description, images (with alt text), good user experience, and so on, working on these factors will send your page more visits from the search engine.
With more traffic, you can enjoy more sales of the products and maybe other services you may be promoting. This can grow your business faster without spending much.
Now that you have seen the benefits of your product pages being optimized, you may be wondering, how can I make my product page attractive for more conversions?
The following is a list of 11 best practices you can apply on your product page to make it stunning, more convincing, and have a better conversion rate to get more sales.
Best Practices for WooCommerce Product Pages
1. Clean & High-Quality Product Images
Images communicate a lot about the product you are promoting. Even with a convincing description and call to action, if your images are poor, the customers won’t buy. You need to make sure the product photos are amazing or else, your sales will suffer.
Even if it means hiring a photographer to get you quality images, it’s worth it and you should consider this as an investment rather than a cost. Your product images should have the following features:
- Plain and consistent background for uniformity and to reflect professionalism.
- Good lighting so that they can be seen well.
- Proper zooming so that the customer can view the finest details that may matter to them, e.g. stitching.
- The images should be taken at various angles so that the customers can have proper visualization of the product.
- Uniform sizes to save space and maintain presentability across different screen sizes.
- A good resolution that captures attention and is easy to view. Low-quality and blurred product images turn the customers off as they paint how cheap and unprofessional the product/website is.
You can add a large image that displays the product in scale to help the customers get a clear picture of the product. Make sure the crucial parts of the image are shown so that customers can’t have any doubts.
Also, consider showing the images of the products in action, for example, a vacuum cleaner cleaning a house. This helps them understand the product more. Since high-resolution images may make your page load slowly, make sure to optimize them for fast loading speed.
2. Detailed & Good Product Description
A great product description helps in convincing the customer and increases the probability of purchasing the product. It should contain a good product explanation, reason why the customer should buy the product, benefits of using it, any special offers that come with the product, what the product is NOT, etc.
Product description should NOT be listing everything about your product, keep it organized, use bullet points if needed, and make it short, yet, informative.
For example, this product page (on manitobah.ca) can tell you in less than 5 seconds the details of the product in nice & short way:
However, it is good to understand your audience and use a tone that is relevant to them. For example, if you are dealing with electronics, then you may have to use technical language since your audience will be looking for those tiny technical details.
Also, consider using catchy phrases like glamorous, unique, valuable, etc. as they trigger the customer’s feelings and contribute to more sales. But make sure to be natural and not overuse them.
3. Search Engine Optimization
SEO is the process of setting up your product page in such a way that it is easily discoverable by search engines like Google, Bing, Yandex, etc, and gives these search engines enough signals about your product page to rank well on search results as well.
Booking a good spot on the search results enables your products to be visible for a lot of potential customers and brings new visits for your product pages every day from search engines, for free!
The higher the traffic to your product pages, the more the sales, provided the page is optimized well for high conversion. The search engine optimization of the product page is not rocket science, you can make good use of plugins here (like Yoast WooCommerce SEO), they will help you highlight what you need to fix on your product pages.
A rule of thumb is to that your product pages must have 1) a great title and 2) a catchy description for the search engines, so that it makes the users want to click your result.
It’s also recommended to use keywords in the title and description that the customers are mostly searching for. This increases the chances of your product appearing on the first page of the search engine results. But be careful not to spam the product page with a lot of keywords.
Apart from that, the product images should be optimized for fast loading speed as this is also a confirmed ranking factor for search engines (at least, Google confirmed this). The alt attributes of the images should be set as well. All these factors will contribute to the SEO of your product page.
4. Catchy Product Videos
A large percentage of WooCommerce stores still do not utilize videos on the product page. Videos have always been a better conversion booster than images. Videos help the customers have a clear picture of the product and boost the probability of buying the product.
A nice relevant video can as well increase the time spent by a customer on the product page, hence increasing the probability to buy. In some cases, using a video might help boost your rankings on Google as well, which leads to more traffic of potential customers to your product page.
Consider doing a video of the product in action, for example, a lawnmower cutting grass, it doesn’t have to be super high quality (which costs a lot of course), just a nice short video that “tells the story” of the product to the user.
You can also do a tutorial on how to use the product. In the case of products like clothing, you may do a video showing how the clothing is comfortable & flexible, or how it looks when worn by different people.
5. Product Upgrades (a.k.a Upsells)
You probably have seen this a lot of times before, when you visit any eCommerce store, you will notice that you are given some product recommendations related to the product added to the cart, you bought or are viewing. This is a very effective marketing tool when properly used.
Apart from increasing the average cart value, it also helps the customers find the products they are looking for and makes them come back to your store.
You can recommend products to customers based on what they have seen, previous purchases, what they have added to the cart, popularity, category, etc. There are various WordPress upsell plugins that can help you achieve this ease. Just search for WooCommerce upsell plugins and will find various options to choose from.
It’s important to highlight that upsell here you are offering a premium version or more expensive model compared to the product that the user is browsing, or added to their cart, shortly we will see how this is different from cross-selling.
6. Build Trust on Product Pages
Every day, people come across various products. What makes them want to buy from a certain website and not others? This is where trust comes in.
Customers are more likely to buy from sites they trust, rather than sites they are not sure about or didn’t use before, this is a huge problem for stores when they want to attract new customers, how these users will trust that site and buy from it?
Social Proof!
People love to see what other people are saying about this product, the community Q&A section (as it tells a lot about the product), awards, and more, we will go over these shortly.
Also, they are very likely to buy a product they believe will be the best deal for their cash or maybe help them in solving their problems.
Fortunately, it is not a difficult task to do. There are various ways you can boost your customers’ trust as shown below:
1) Reviews: With the incidences of online scamming, customers are skeptical to purchase online. Reviews help creating social proof and assure the customers that the product is genuine since others have bought it.
Humans tend to do what other people do. For example, if you see a crowd on a street, you are likely going to want to know why the crowd is gathered. Reviews help build a similar situation on your WooCommerce store. They show that a crowd has gathered for.
In short, a product with customers’ reviews is more likely to get more sales than the one without, let’s look at an example:
You were searching for a plugin that allows you to control minimum & maximum quantities of products on WooCommerce, you found many solutions, and one of them was this plugin on our marketplace, you were hesitant to buy since you don’t know the author or even the store itself, but when you checked the reviews section, you found tens of positive reviews from real people about this product.
This will help you in making a decision to buy that plugin, compared to a plugin with 2-3 reviews, or even without a reviews section at all.
Fortunately, there are many WordPress plugins that enable your customers to submit their reviews. Just search and pick what is good for you.
2) Awards: In case you have won some awards, then it might be a good idea to feature them as well. This makes the visitors see you as professional and worthy to be trusted, also if your product was recommended or featured somewhere, you can mention that (think of books, how they feature a phrase by a well-known author recommending that book).
3) Recent purchases: With the use of a plugin, you can display recent purchases on the product page. Whenever a product is purchased, you can display the purchase say as a popup. This makes the customers feel free to buy the product as others have also bought it. It also helps create the fear of missing out.
4) Warranty: In case you really believe in your product, you can offer a warranty. This makes the customers know that you believe in your product and they do not get a loss in case anything happens. This boosts trust and thus sales.
5) Showcase the products in action: While this might not fit all types of products, but you can show images/videos of your products while being used by your customers.
For example, if they bought a machine and sent you a nice photo or video to thank you for the great product, then you can show these images, if clothing, list images that show how users are feeling happy with it.
These are real images and very different from “professional” images you add to the product itself, they show how products look like in real life, and this makes your product page visitor believe it is a real product and other people are happy with it, hence boosting their trust.
7. Product Cross-Selling
What is a better moment for a store owner than users who have already filled their cart, ready to checkout, to give them recommendations for other products that they might be interested in?
Cross-selling can increase the number of orders on the website and hence sales, how it happen?
Cross-selling is the process of recommending products to customers that complement or supplement the purchases they have already made. For example, when a customer buys a phone from your website, you can suggest a phone case, screen protector, headphones, etc.
Product pages are “moment of glory” for store owners, people are checking this product right now! And if they are interested on it, they are very likely to get a related product that extends the experience of the original product! Make the best use of this.
8. Nice & Organized Page Layout
The product page should be organized and not cluttered so that the customer does not have to struggle to find the product information. Any web page (not only product pages) is basically made up of two sections:
Above the fold: This is the section that is visible when a web page first loads. This section always gets more attention.
Below the fold: It is the section of a web page that is visible after scrolling down and gets less attention as compared to the above the fold.
Why this is important on product pages?
That’s because you need to grab the visitor’s attention the second they land on your product page, they will first check what is “above the fold”, and if it isn’t much of interest to them, they will just leave!
You need to make sure the most important product details are placed above the fold, for example, the product image, title, description, attributes e.g. color, material, quantity and shape, price, and call to action button e.g. add to cart button. The hardest part in all might be that you have to keep all these details organized and easy to find & read.
These are the details that matter for sales and should be given maximum attention. On the other hand, you can place other content below the fold. This section is good for content that helps add value to the product page e.g. related products, social proof, etc.
9. Questions & Answers Section
We all have been in this situation. You are actively searching for a certain product, and you visit some online stores hoping to find it.
But because of doubt whether the product will satisfy our needs, we do not buy it, no matter how much did we like it. This is why you need to add questions and answers section on your product page. This will help address some of the doubts that customers may have.
You can as well allow customers questions and you answer them (remember, this is a social proof as well). This will settle their fears and increase conversions. Make sure the questions and answers are relevant to the product.
There are many plugins out there that can help you add a Q&A section, maybe your theme already supports that, a quick search will get you all possible options to use.
10. The Open Graph Protocol
It can take a lot of time and resources to make your product page look nice. But how does the product look like when shared across social media platforms?
How many times you’ve shared a link on social media and it generated a thumbnail with wrong image, cropped title, or no description?
What if that link was for a product? Our guess is that a poorly cropped image or just a link probably will not convince the customers to check it out. That is where Open Graph Protocol comes in!
What is Open Graph Protocol?
It is a technology that was initially created by Facebook in 2010 that determines how your website content appears when shared across the social media platform. When you integrate meta tags on your product content, you can choose elements that appear when someone shares your page on social media.
Why do I need it?
Social media is growing at a very fast rate and almost everyone these days is on social media. To grow your business, you need to take advantage of social media platforms as they are a great source of traffic.
To achieve this, you need to make sure your product’s content looks great when shared across social media platforms. A product with properly set Open Graph information gets more attention and hence more clicks and makes your brand appear professional.
On the other hand, when the product has no set Open Graph information when shared, it appears as a grey box or just a random banner that hardly gets any attention and the brand looks cheap and unprofessional.
Getting Started with Open Graph
There are various Open Graph tags that can be tweaked to dictate how your product content appears on social media. Some of these tags are common on various social media platforms while others vary. Each social media platform provides instructions on how you can implement them on your website.
It might look a bit difficult, but it makes sense, images for links that are shared on Facebook look different than those on Twitter for example, in terms of dimensions, the title as well, some platforms give more characters for the title or description while others crop it a bit early.
The following are some of the Open Graph tags that can help you get started:
og:title
This is the content title. If you do not set this, your page title will be used by default. You can add the product title here. Make it catchy and self-explanatory.
Example
<meta property="og:title" content="Fitting t-shirts for men" />
og:image
This represents the link to the image to be used on social media. Your product image can go here. Make sure it stands out and demands attention.
Example
<meta property="og:image" content="https://www.yourdomain.com/images/image-name.jpg" />
og:type
This is the type of page or object that you are sharing e.g. article, blog, video, food, movie, city, company, restaurant, etc. According to Facebook, for a product, the type should be og:product. If you do not define it, it will be a website by default.
Example
<meta property="og:type" content="og:product" />
og:description
This is where you describe your content. This description appears below the title when shared. The character count is not limited but it is good to keep it around 200 characters.
Example
<meta property="og:description" content="The award-winning business book everyone should read for a successful business" />
og:url
This is the URL of the page or object that you are sharing. This should be the unique URL of your product.
Example
<meta property="og:url" content="https://www.yourdomain.com" />
Advanced Open Graph Tags
Apart from these tags above, there are other tags you can play with:
og:locale – The language used. By default, is American English.
og:video – The video of the object shared. If you have a product video, it can go here.
og:audio – The audio of the object shared.
fb:app_id – Useful if you want to link the object with the Facebook application.
og:site_name – The name of your website. It appears under the title.
How to Add Open Graph Tags to Your Product Page?
Using HTML code
If you don’t use a CMS (Content Management System), you can add Open Graph tags via an HTML editor. Just like any other tags, they should be placed on the head section of the page.
For WooCommerce Stores
If your website is built on a CMS like WordPress, you can use a plugin like the Yoast SEO plugin to manage these tags.
11. Use of Variation Swatches
The use of image and color variation swatches helps you to display the product attributes such as available colors, styles, etc. beautifully and professionally.
The visual representation of the product attributes is way more interesting and professional than the ordinary dropdown buttons. So having the variation swatches is a great way to boost your customers’ experience that you have to consider.
Fortunately, it is very easy to implement this. There are various plugins that can help you do it effortlessly e.g. Variation Swatches for WooCommerce.
12. Plugins
Autoscroll is a distinguishable and user-friendly plugin that allows users to scroll the page automatically without even clicking on the keyboard of their computers. It is extremely easy to use and no coding skills are required.
Thanks to its user-friendly interface you don’t even need to navigate back and forth to read the material.
Moreover, users have the opportunity to decide the scrolling speed. It is possible to make it faster and slower. Pause and resume buttons are also available.
The plugin is absolutely free to install.
Conclusion: Take Your Product Pages to a New Level!
Since not all stores apply all these tips for their product pages, it’s an opportunity that you should not miss! Try applying most -if not all these product page tips to maximize your product visibility on search engines, and to increase sales as well.
It’s worth mentioning that these tips are not exclusive to WooCommerce, you can apply them to WooCommerce or other eCommerce stores (Shopify, Magento, BigCommerce, etc.).
That’s all for our list of best practices on WooCommerce product pages. We hope you are able to implement these tips and boost conversions on your WooCommerce store. Let us know in the comments section if you have any questions or if we missed an important recommendation.