Product Page UX

If you’ve done our Basic SEO training, you already realize that product page SEO isn’t just about optimizing your title and headings. Product page SEO is about making that product page as user-friendly as possible, making sure bounce rate is as low as possible and the page looks awesome in Google. It’s about product page UX (user experience) and technical optimization. This article is about the first part: product page UX. I will explain more about the technical bit in my next post.

In this post, I will show you a couple of great product pages. These pages have most if not all elements to make it a killer product page. Besides that, I’ll show you a number of more technical improvements that are absolutely necessary if you’re serious about product page UX.

Coolblue’s product page UX

SEO isn’t all about optimizing your meta description, although that seriously helps. In most cases, leaving a meta description blank will make sure Google creates the best automatic meta description it can make. For your product pages, you’d want to convince the visitor to click your link. Coolblue, one of the largest online retailers of the Netherlands, exploiting a huge number of specialized webshops, adds some triggers to every meta description:

Bestel de Philips 233V5LHAB bij Monitorstore.nl. Voor 23.59u? Morgen gratis bezorgd. Ook op zondag! Coolblue: alles voor een glimlach.

The description’s template is roughly this: “Order the ‘product name’ at ‘webshop name’. Ordered before 11.59PM? Delivered for free tomorrow. Even on Sundays! Coolblue: we’ll do everything to make you smile.”

When I buy something online, I’d like it to be delivered a.s.a.p.. Makes sense to focus on that. Most of the competition in the Netherlands can’t match the USP of fast delivery like that.

Let’s look at an actual product page:

coolblue

I added a couple of numbers here that I wanted to elaborate on:

  1. Ordered before 11.59PM, delivered for free the next day (translated). I want it and I want it now, or at least as fast as possible.
  2. 5 actual stores (translated). This is clearly a trust factor. I can go to a store in case of issues, which makes it easier to spend a higher amount of money.
  3. Ratings and reviews. We did an article on testimonials; these are like that.
  4. In stock (translated). So small, yet so valuable. It’s available right now. Add that to item #1 in this list and you know you want to buy from this webshop.
  5. Primary and secondary call-to-action. Very important. Add a main call-to-action and an alternative.(In this case Buy now, or Buy with subscription). You’ll find this on most online shops for a reason.
  6. All kinds of trust indicators like ‘free return option for 60 days’, ‘customer service available until 11.59PM’ and so on.
  7. Alternative views. To give the visitor a shop-like experience, you’d want the visitor to be able to ‘hold’ the product and look at it from multiple angles.
  8. Product bundles. Everybody is looking for a bargain or a nice deal, right? That’s not just something we Dutch people do ;)

All these user-focused elements will make the user like the webshop and this will make Google like the website as well. As mentioned, Product page UX isn’t just about adding the right meta description or headings. Coolblue does an awesome job on product page UX, IMHO.

Amazon’s Product Page UX

Coolblue’s product page is actually a bit like Amazon‘s. Here it is:

amazon (1)

There are certainly similarities, as you can see. Let’s go over the numbers:

  1. Free two day delivery. OK, for this specific product, I’d order at Coolblue, but given the fact that Amazon ships abroad, makes that two-day delivery pretty awesome.
  2. Alternatives. I like this. It allows me to order at the supplier I have a great experience with, instead of just going for the cheapest that is usually displayed first.
  3. Ratings and reviews. Huge numbers of these, what makes me trust these ratings and reviews even more.
  4. In stock. Like at Coolblue’s.
  5. Call-to-action and alternatives. Amazon actually offers an option to sell your own Apple iPhone 6 for a Gift Card as a third option.
  6. X answered questions. It’s comforting to know that the actual seller takes the time to help you out if needed.
  7. Alternative views. See Coolblue’s.
  8. Product bundles. As at Coolblue’s.

Besides these elements, Amazon has a huge advantage on other online resellers: an awesome, well-known brand. And that most certainly helps a lot too.

Last but not least, I’d like to show you a slightly different shop, named ThinkGeek.

ThinkGeek’s Product Page UX

Both the above shops, Coolblue and Amazon, show how most product pages should be set up. But there are also a lot of online retailers that don’t offer all the options mentioned before, like stock, delivery advantages and reviews. Some shops sell niche products, and don’t need these ‘extra’ triggers. ThinkGeek is one of these shops.

thinkgeek__1_

This last page looks much cleaner and more focused. It lacks a number of elements that Amazon and Coolblue did add to their product pages, but I am sure loads of people will prefer the clean and focused appearance of ThinkGeek’s product page. Product page UX is also about focusing on what’s most important. ThinkGeek does add a number of extra elements I’d like to mention:

  1. Free shipping on orders over $75. Or whatever amount seems reasonable for your business. Just the other day, I ordered 12 plectrums I just did not need per se to match the $50 that would get me free shipping. It seems nice, but actually is also just another trigger to make you want to buy more.
  2. Customer action shots. Showing actual people using your products, makes that people see themselves using you product. It’s a nice addition!
  3. Social proof. Only works with a certain number of shares, obviously. It’s like reviews and ratings, but without the reviews and ratings.
  4. In stock. There it is again.
  5. Call-to-action and an alternative. I like the way ThinkGeek designed this. The main orange button and the smaller, secondary black button work really well together.
  6. People also bought these products. That’s the bundle without a discount. Might be obvious, but showing related products could lead to extra sales per visit.
  7. Alternative views. No matter how cheap the product, provide alternative views on the product.
  8. Last but not least, ThinkGeek added a pretty large product description to accompany this quite simple, dull product. It shows that ThinkGeek takes their optimization very seriously and realizes that content and content SEO is just as important as creating a nicely looking page for their products (judging by this page).

What about your own product page?

I trust this article’s got you thinking about your own page. If you are an online retailer, I’d love to know what you did to optimize your page. Did you add that in stock option? Did you add urgency by listing only 3 items left? Drop me a line in the comments. I’m looking forward to it.

Even better SEO with Yoast SEO Premium!

  • Optimize your site for the right keywords for your users
  • Avoid dead links in your site
  • Get previews for sharing on Twitter and Facebook
  • Content quality and link suggestions as you write
More info

4 Responses to Product Page UX

  1. Dan
    Dan  • 3 years ago

    Thank you great brief on the most important features to implement especially adding trust(ability) . What about the actual descriptions that go on the page, something we have been placing too much importance on till now.( Just like post content)

    • Michiel Heijmans

      I think you should, Dan. Descriptions is what makes the page better for Google, and what provides the user with the details needed to make a buying decision. I actually have an article coming up on product page SEO, that will take this one step further as well (technically). Be sure to read that.

  2. Tim
    Tim  • 3 years ago

    First, great post!

    I’m currently designing a complete overhaul of our home page and UX is something that really troubles me.

    In my industry we have two audiences and it makes it difficult to have only one CTA.

    Rules to live by tho… If the guys to do it (Amazon) it’s probably right. haha
    Thanks!

  3. AGTES Kozijnen
    AGTES Kozijnen  • 3 years ago

    Great article Michiel. Haven’t been able to read the new eBook yet but this article already gives me a lot to think about and I will certainly add some of these helpful tips.

    Thanks!


Check out our must read articles about User eXperience (UX)