What do customers want to see on a product detail page (PDP). A drop-down selection or blocks with all available sizes?

A clear overview of available sizes is extremely important for customers. How can you give customers the most clarity about sizes, so that they actually put that garment in their online basket and pay for it? We tested it and came up with several clear learnings.

Our insights

User tests showed that 25% of users clicked on the size drop-down menu on the Product Detail Page (PDP).  That means, logically, that 75% do not click on this. A big problem for this page for two reasons:

• So many users completely overlook this menu. The size is not filled in, so you cannot continue on the PDP. The size must first be selected before you can add the product to your basket.
• Moreover, customers were often surprised or disappointed about (the lack of) available sizes. That disappointment was only magnified because many users only found out after the drop-down menu was used. This reinforced the feeling that their time was wasted.

Time for a change:

• Users should be able to see the available sizes right away.
• But also the functionality to select your size should not be overlooked. After all, not selecting your size resulted in an error message.

Based on Baymard research (an interesting site with many UX cases and examples), user tests and Contentsquare data, we designed a solution.

Instead of a drop down, clear and robust blocks were designed for selecting the size on the PDP. In this way, users immediately see the functionality clearly and whether the desired size is available.

This greatly reduces time waste and friction, so that visitors do not give up.

Learnings and results

Of course, we tested our hypothesis via an A/B test. Where previously a part of the users left the page, we now saw the opposite in the variant. With each “block” representing a size, users can see all available options immediately. The amount of effort and interaction required to understand this basic information is greatly reduced.

The results of the A/B test also showed this. The chance that someone makes an online purchase increased by 3.1% in the variant. For the customer where this was tested, this resulted in a substantial extra turnover every year. In addition, we even saw an increase in the Average Order Value of 1.8%.

Not only easy for the user, but also for you

Adjusting the size selection not only makes selecting a size very easy for the user, but it is also an adjustment that is easy to do for any company. Meanwhile, the use of size blocks is the standard in the market.

This experiment is not very complex in terms of research and design. Nevertheless, there are small issues on every website that are relatively easy to solve. Just test, because then you know for sure whether your assumption is in fact correct.

Continuation

This experiment shows that users want to see all the information at once. We are not done with that yet. Can we make it even clearer for users?  Can we reduce the cognitive load (the amount of information a user can process) by not showing unavailable sizes? Or does this upset the user again?

We continue with our research and will come back to you quickly with new insights 🙂