Site Login

Lost your password? (close)
LOGIN

inside out project

continuously falling forward...

Understand that product page design is heavily impacted by product options and how they are displayed and interacted with on the product page.

Brian Savage

The Components of Great Product Page Design

Before diving into the details of how to optimize each aspect of your product page, let’s look at a great product page design example to understand how each of the components fit in and why they are important.

Uniqlo Australia has an excellent example of a product page that is designed with the user in mind. Here is a screenshot of one of their typical product pages with the key components highlighted:

Immediately, you will notice that >90% of the page is dedicated to providing more information to the customer about the product they are viewing and almost no space is wasted above the fold. To break down each section even further:

  1. The product title and overview are easy to locate. In the same way buildings and signs act as points of reference when you’re visiting a new city, good titles help customers navigate a new site.
  2. A gallery of images showcasing the product from various angles, with a model, and up close.
  3. The product image is front and center. A clear photo on a white background showcases the product in the best light. Images are what the customer looks for so it pays to make them prominent.
  4. A unique, detailed description of the product that describes what it is, the thought behind its design and how it solves the buyer’s problem.
  5. Sincere customer reviews that help build confidence in your product and brand.
  6. Customers know what they want, but they might not know how to find it. Showing recently viewed or related products helps them narrow down their options faster and gives you an opportunity to showcase products you think they might prefer.
  7. Plenty of options and variants on the one page means a customer does not have to navigate through multiple products.
  8. Right after the customer finishes selecting their options, the “Add to Cart” button is waiting for them.
  9. Not ready to commit? Links to extra information such as your shipping and returns policy help answer any lingering questions.

I always find it helpful to look at how other stores have designed their product pages. You don’t necessarily have to look at stores within the same industry either. Consider looking at what strategies popular websites in other industries are doing that customers love but aren’t being utilized by your competitors.

On most successful product pages, you will find a variation of these same components:

Jacobs, Rachel. “Product Page Design: How to Design the Perfect Product Page.” A Better Lemonade Stand, 11 May 2018, www.abetterlemonadestand.com/product-page-design/.