Your homepage — as much as you love it — is basically a glorified street sign. Consumers don't read it so much as glance at it in the hopes that it's clear where they should go. Its job is to get people out of there, into whatever it is they're looking for. And often what they're looking for on your site isn't your categories, deals, and certainly not news releases about you or your awards — it's your products.
And boy, are there references out there about your products. If you're looking to review specific elements, there are plenty of great resources about your calls to action, the information expected in them, and any number of good sample reviews or general usability references.
But what is it that makes a product page successful?
Obviously, focus helps, but how come Amazon.com's product pages — where it's normal to have several hundred links, a ton of clutter and useful features buried several screens below the fold — survive years of tests and tuning? Evidently, putting useful information about the product helps, but how come large companies like Wal-Mart get away with putting so little information about the product?
Hopes, Fears and Your Product Page
B.J. Fogg, author of "Persuasive Technology," might have part of the answer. His research into motivation sheds some light on technology, in this case, the product page. He organizes motivation this way: pleasure and pain, hopes and fears, social acceptance and rejection. Obviously, that's useful for the product page, the last point before the purchase, the point where you convince your visitor to shake on the deal.
Let's start with Amazon. The online giant has tons of usability issues. It's difficult to cite a better example of clutter than over a dozen pages worth of scrolling on one page, especially when research says that about 80 percent of visitors never see anything below the fold.
And yet Amazon delivers just that. For a Nexus 7 page, the site has 17 pages worth of scrolls.
So is it a bad product page? It certainly deprioritizes useful features like "Customers Who Bought This Item Also Bought," for starters. It also looks like it takes the spaghetti-to-the-wall approach to web design.
But let's take a look at the elements above the fold:
The higher price is there so the visitor can see the reward of purchasing. It's available, so there's hope of acquiring the item, but you can clearly see (in prominent text) that there are only eight left, so you better act soon. It has social trust elements, it states the reward and has a prominent, established call to action.
What Amazon is using above the fold is rooted heavily in persuasive design; e-commerce product pages use this to varying degrees of effectiveness.
Rewards, Anchoring and the Use of Free
If you search for a Nexus 7 on HSN or Staples, you'll encounter many of the same elements, although neither one has the entire set.
Anchoring is prescribed for product pages because we have an irrational brain. We perceive the first thing we're shown and we anchor expectations against that. It's a reflex, we hardly think about doing it. That's very useful when showing price points.
Free items like shipping further capitalize on that work on pleasure and delight.
Social Proof
If you have pleasure and pain taken care of, if you have hopes and fears down, that just leaves social acceptance and rejection on the Fogg model for motivation.
If you've ever taken a look at Wal-Mart's product pages and wondered how it can get away with putting so little information about the product off the bat, this partly explains why. For the same product, here's what Walmart has:
Now try and answer these questions: What's the resolution of the product? How much does it weigh? How powerful is the processor?
If you can't answer any of that with a quick glance, that's evidently an issue. But that's the trade-off Wal-Mart is making. The price, call to action and store availability are focused on, and the other elements except for social proof are de-emphasized.
Getting it Right
The examples here, without exception, have serious usability flaws. None of them can answer everything you need about the product at a glance, while working with pleasures and hopes, pain and fears, social acceptance and rejection. But it's a difficult balance to strike.
If you use anchoring, rewards and scarcity while keeping the high-level information available and the call to action clear, you're that much closer to having not just a great, but persuasive, product page.
- Categories:
- Web Design
Tim Ash is the author of the bestselling book Landing Page Optimization, and CEO of SiteTuners. A computer scientist and cognitive scientist by education (his PhD studies were in Neural Networks and Artificial Intelligence), Tim has developed an expertise in user-centered design, persuasion and understanding online behavior, and landing page testing. In the mid-1990s he became one of the early pioneers in the discipline of website conversion rate optimization. Over the past 15 years, Tim has helped a number of major US and international brands to develop successful web-based initiatives. Companies like Google, Expedia, Kodak, eHarmony, Facebook, American Express, Canon, Nestle, Symantec, Intuit, AutoDesk and many others have benefitted from Tim's deep understanding and innovative perspective.
Connect with Tim on Google+