Product Page Design
What’s the most important page of your website? Depends on what you’re trying to do. If your main objective is to increase branding, advertise your retail store, or drive traffic to affiliate sites, the home page should probably be your main point of focus. But if you’re like a vast majority of product-related sites, your fundamental goal is to sell, sell, and sell some more — and that can’t happen without a product page that does what it’s supposed to do.
The home page, category pages, and even your paid search placements can be considered online appetizers—they should look good, be easily digestible, and whet appetites for the more substantive stuff to come. It’s the product page that’s the real meat and potatoes of your site — it’s the place where the most important of all consumer decisions is made, the place where your product or service really needs to shine. Once the shopper clicks that crucial “Add to Cart” button, the odds of them ultimately converting the sale dramatically increase.
As a frequent online shopper, there are certain things I need to see on the product page before I commit to a purchase: the aforementioned meat and potatoes, if you will. And after sitting in on countless usability sessions and reading dozens of survey results, I’ve found corroboration among other web shoppers. With the occasional exception, the same few things surface again and again as must-haves. Everything else, as they say, is just gravy.
A TITLE WORTH ITS WEIGHT IN WORDS
This is a biggie, both for good usability and for making nice with search engines. The product name should be long enough to include high-quality keyword phrases and convey the essence of the product to the consumer, but not so long that it’s overwhelming and sends the customer scurrying for more simplistic alternatives.
When you’re browsing in a brick and mortar store, shopping is a sensory-rich experience: you’re sniffing cologne samples, measuring the heft of a vase in your hand, feeling the softness of a sweater’s fabric between your thumb and forefinger, listening to the gurgle of a desktop fountain. Online, you’re somewhat limited — although some forward-thinking sites are implementing some pretty cool interactive features, you’re more or less limited to eyeballing your merchandise, which is why images are so important on the web.
I think Gap.com has nailed it. Their product page uses a larger-than-average image as the focal point of the page, and they don’t stop there. Picking up on the consumer’s instinctive move to hover over an image before deciding what to do with it, they’ve included a built-in pan that lets you zoom way in on an area of interest without committing to a single click. To see more, just click to launch a traditional zoom window with a much larger image, complete with alternate views along the left-hand side. Their additional images aren’t just fluff, either—they add real value by presenting the product at different angles and in different modes of use.
SHOWING PRICE MAKES SENSE
There’s perhaps nothing more irritating than a product page without a price. Knowing that value is one of the online shopper’s primary motivators, not posting a product’s price is a virtual shot in the foot. It immediately raises a consumer’s hackles, making them suspect you must be hiding the price for one reason and one reason only: it’s way too high.
Don’t assume shoppers will hunt around for the price. Requiring them to click “Add to Cart” in order to see the amount doesn’t make sense, either — and it’s a surefire way to raise cart abandonment rates. eCommerce etiquette calls for displaying the price in a prominent area of the page, and including as many associated fees as possible.
Ideally, you should try to lump in any applicable shipping and tax charges to represent the reality of the full amount of the item. Nowadays, many sites are including fields prompting the customer to plug in their pin code, and then performing real-time calculations right there on the product page.
On the list of questions every online shopper needs answered, “When can I get it?” is a biggie, second only to “How much will it cost me?” For web transactions, where there’s always that little scrap of skepticism about when or if the product will actually arrive, a clear presentation of the product’s availability is a must on the product page.
If something’s in stock, say so. Many sites make the mistake of saying nothing if an item is ready to ship, assuming the lack of backorder date is enough. It’s not. Some positive message conveying the item’s status — “In Stock,” “Ships Today,” and “Available” are some good examples — can do wonders to restore a customer’s confidence in the purchase and compel them to make that fateful click into the cart.
If something’s not available, be honest about it. As early in the process as possible, indicate the date the product will be ready to ship. You can use strategic verbiage to make it sound as positive and exclusive as possible (i.e. “Reserve yours now…” or “More arriving on…”), but never try to obscure the fact that the item is not yet available for shipment. Hiding that fact will only anger customers and drive them to buy from someone who’s more upfront with them.
The product page is your selling page, and the copy here is more important than any other area of the site. It’s easy to use too much or too little. Strive to achieve just the right amount of words, enough to convey the important features of the product but not so much to risk overwhelming the customer.
In the event that a large amount of value-adding content is available, make use of layering, where the extra copy is accessible via expandable sections or links to pop-ups. Avoid including jargon or industry-specific lingo that may risk alienating some customers.
GIVE ME CHOICES
If the product page shows a picture of a red shirt that also comes in black, white, and green, give me the option to view and/or purchase the other colors from that same page. You don’t want to compel customers to hunt around for the other available options — they may have the best of intentions, but you have no control over what happens after they leave that product page, or whether they’ll return.
REINFORCE THE BRAND
For many product lines, such as clothing, footwear, and electronics, brand is a biggie. Customers that have long-standing allegiances to certain brands can be easily swayed by the simple inclusion of a company’s logo or name on the product page.
There are some bells and whistles that, while perhaps not critical to the sale, could have the power to nudge a buyer to the converting side of the fence. These include things like guarantees, product warranties, and price protection. As Amazon.com has proven thousandfold, customer reviews can serve as another boon on the product page (assuming they’re positive for the most part and, if not, that you have the depth of product to support an alternate purchasing path).
A CLEAR PATH
If a customer has trouble finding his way to the Holy Grail that is the checkout process, you’ve got a need for some serious product page re-design. The “Add to Cart” button should be in a prominent place, above the fold, displayed in an attention-getting graphic. Because, after all, even the snazziest product page is just a pretty face if it doesn’t make it easy for the customer to buy.
Is your site missing any of these? Spend a little time tweaking your product page to ensure they’re all included, and I’d bet you’ll see a marked increase in conversions. Remember, the product page is the lifeblood of your site—give it the attention it deserves, and it’ll breathe new life into your bottom line.