Design Perfect Product Page

Design Perfect Product Page For E commerce / Shop Website

Since the first website was launched in August 1991, over a billion websites in the world followed suit according to the Internet Live Stats, and the number is constantly growing. What matters is what are the ingredients of an eCommerce website with great conversion and low bounce rates. The majority of experts agree that the factor distinguishing strong, high-performing eCommerce websites from their weaker competitors is properly designed product pages. Certainly, products and services remain at the core of the business, however, users are increasingly drawn to better product-related experience. Isn’t that the reason Apple went that extra mile and spent billions developing their retail stores to achieve it?

Store owners are typically inclined to invest time and effort into the development of the navigation structure and checkout process, instead paying less attention to the products pages, which often remain far from perfect. Don’t get me wrong, all aspects of website development deserve close attention. However it is in the product page that consumers take the decision to purchase, you have courted them to arrive here, and it would be wrong to lose them at this stage.

As Kissmetrics’ article observes, good product pages should provide the visitor with the information, assurances and motivation needed to become your customer. So what can turn an ordinary product page into a perfect one?

Let’s See How To Design Perfect Product Page

SEO tools

Developers tend to focus on the website’s layout, design, and content and often forget about SEO. Nowadays SEO is more focused on users than search engines, so make sure you do it right:

Your Permalink Structure:

URL’s structure should be simple, URL names clear and meaningful. Make it www.example.com/category/subcategory/product-name or www.example.com/product-name instead of www.example.com/p/!idgownvjna24=92D). This type of permalink structure helps to improve the website’s SEO.

 

Design Perfect Product Page

Select Product Names:

Unique and expository product names and descriptions help search engines retrieve your product according to user requests, and improve website ranking.

Use Different Headers

Descriptive headers (H1, H2, H3, H4, H5 and H6) just like titles, they are supposed to help users’ understanding of the page content b) eye-catching and interesting headers will help you stand out.

Proper product information.

Product description is a huge time saver for your customers as well as your customer service. Your client needs to get all the info immediately in one place, and it is essential that there is no need to request additional information from the customer service or drop out not being sure the product is exactly what is needed. Depending on the type of product, users need different kinds of details. E.g. for clothes you would need to indicate the fabric properties, its warmth, dimensions, style, fit etc.

Make it unique and exciting. Not only will it improve your website’s SEO, but customers are not persuaded by “This is an excellent product” kind of description. Focus on the buyer and explain how this product will benefit this person.

If you need to make your product more exciting, create a mini-story around it, make it emotional and fun to read. Appeal to your client’s imagination.

 

Customer review in shop website

 

Proof your confidence in your product quality with ratings and reviews. Not only does it help understand the properties of the product, it also translates to the shop owner being transparent and honest with the clients, ready to engage in contact and receive honest feedback. On top of all the benefits, reviews help shop owners adjust their assortment to the demand based on reviews they get. E.g. Amazon has made a point of providing user-generated reviews. You are able to rate products, upload videos to your reviews, vote for reviews left by other customers etc.

Visuals

For online shops selling physical goods, images are a must. Over 50% of users think high-quality pictures of a product are more valuable than product description, reviews or ratings. And if you use images, here are the rules to follow.

High-quality pictures: images are there to provide a good understanding of the product details. Small or blurry images just won’t do the job. Is hiring a professional photographer too expensive for you? Then try allocating some time and resources for your team to create great product photography. Uploading higher quality images actually improves your website conversion rates

The more images, the better. Each picture increases your customer’s confidence in the product and helps take the decision to purchase. No need to upload dozens, 6-7 pictures will do.

 

Unique Shop Website Example

 

Images of the product should include those made from a few different angles, some concentrating specifically on special features (like the reflecting stripes on the back side of the running shoes below.

 

Different Product Page

 

Show the product in action. Help boost your customer’s confidence in the product, and videos are the perfect way to achieve that.

Be smart with call-to-action buttons

Call-to-action buttons (aka CTA) assist in shopping and checkout process. They are also a great way to prompt your customer to act and finalize the purchase. But make sure your CTAs are thoroughly-worded, located in all the right places and well-designed:

1. Make them distinctive. Well-designed CTAs help customers shop and make the process clear and convenient.
2. Call-to-action buttons are for actions. For options use check boxes and drop-down menus, CTAs are there to complete a step.
3. If customers stay in the same page after pressing a call-to-action button, it should be changed to a CTA with a different text to avoid confusion. For example, after “Add to cart” button is pressed, it is switched to either “Added” or “Go to cart”, this way your customer is immediately aware that the item has been placed in the cart.

More tips

1. Shoppers tend to be impatient. When they are ready to spend, the last thing they want is waiting for a slow online web page to load. The longer it is, the higher your store’s bounce rate is. Loading time should never exceed 3 seconds. With every additional second, you get a 3.5% decrease in conversion rate. Loading time is also one of the ranking factors in the Google search algorithm.
2. Social share buttons will prompt your customers to promote your web store. We are social beings after all!
3. Add product availability/low stock indication. Your customer should not find an item suddenly unavailable after a long selection process.
4. For online stores selling clothes and shoes, add size guides.
5. Highlight special offers (sale, buy one get one free, etc.)
6. Do cross-sell and up-sell. Not only is this a good selling tool, but online shoppers actually find it handy to be able to compare similar items and buy supplements in the same page as the main item.
7. Display payment options. They are usually placed in the shopping cart page but it’s a good practice to have them displayed in the product page as well, or even in footer section throughout the whole website.
8. Show international shipping options and rates if you ship overseas. E.g. Amazon ships internationally only certain groups of products and has a feature displaying the ability to ship to the customer’s specific location, which is very user-friendly.

 

Amazon Product Page Example

 

Author bio: Oleg Yemchuk is the marketing manager at MavenEcommerce (Magento development company) sharing office space with Magento business experts and software developers. Oleg is marketing expert by day and geek by night. As a geek culture fan, he spends his free time playing video games and reading comics.

Design Perfect Product Page For E commerce / Shop Website
5 (100%) 2 votes

About Author

jemee

It's Jemee, the Wizard of WordPress and SEO. He is the technical writer and takes care clients website in Jewel Theme.

Leave a Comment

Share this

Sharing is Awesome, Do It!

Share this post with your friends
close-link