Increase Your Conversion Rate On Responsive Product Pages

So you have built a responsive ecommerce store, linked it with your marketplaces, but haven't seen the results you had hoped for. What is going wrong? When it comes to selling products online, one of the most important factors to consider is the product page itself. An integral part of a good user experience (UX), an awesome product page can make the different between a purchase and someone leaving to shop with a competitor.

The penultimate point in their online shopping journey, product pages turn initial browsers into paying customers. Whilst a responsive design will adapt to the visitor's device by resizing the navigation, images and content, increasing the conversion rate on your product pages will often require a little more work. Consider the placement of headers, product images and a clear call to action; have you made it easy for the user to buy?

Best Practice Layouts For Ecommerce Product Pages

Over 40% of traffic comes from mobile phones and tablets, so it is incredibly important to ensure that your online store is optimised to offer customers the best possible UX. Working from the top down we will look at best practice guidelines to take into consideration when designing responsive product pages.

1. Headers and menus

The header on your website is home to your company name, logo, navigation, search bars and shopping cart links. Depending on your design and market, you may have also included product category navigation - That's a lot to fit onto the small screen of a mobile device.

Desktop Kover It Menu

On a desktop or laptop computer you have a lot more room to play with graphics, navigation and banners. On a mobile device this needs to be slimmed down taking up no more than 15% of the screen. Only keep the elements that are really important for a compact and effective design.

Icons for search and the shopping basket can be included to limit the amount of text required. Similarly, menu icons can be used to allow the user access to the category pages whilst a limited breadcrumb-trail can be shown at the top.

Mobile Kover It Menu

2. Call to action

Once a user lands on your product page you want them to make a purchase. On a desktop or laptop computer the product information, price and call to action sit on the right hand side. On a table or mobile device this is not possible as the image text may appear too crowded and the message lost.

Condense your product information on a need-to-know basis. Include the product name, brief description, size information, a mention of availability to create demand and a clear call to action in the form or a 'buy it now' or 'add to cart' button. If you want to make sure that your business stands out from the crowd use an alternative call to action such as 'want it' or 'get it now'. Set your buttons below or above your product images.

Best Mobile Call To Action

3. Beautiful imagery

In a bricks and mortar store you will see customers picking up items, touching and feeling the quality and suitability of products. In an ecommerce store, they do not have this opportunity. As a result, quality images are one of the most important factors to include on your product pages. Recognised as one of the best ways to improve your conversion rate and sales, let users get a closer look at your products through great images from multiple angles.

Amazon Product Page Images

Want to gives users the complete experience? Include a product video showing how an item works and looks. is one of the best examples of this in action having massively increased their market share since their new website went live.

4. Make it social

Make sure to include social icons on your product pages to enable users to share your products. To encourage users to share, provide incentives such as 'share with friends and earn up X points when they buy'. Pinterest is a great way to increase your visibility without spamming users with sales driven content. Create mood boards or outfit ideas and share them on Pinterest with a link to your products, these can be shared thousands of times over reaching a far wider audience that you may have ever imagined.

Social Product Page

5. Trust and Payment badges

This is the time to blow your own trumpet. Make sure that you shout about payment security and options as a small logo can instantly boost customer confidence resulting in a conversion.

If you offer any other great selling points such as free delivery, student discount or gift wrapping, make sure to clearly display this. Promotions and offers encourage spontaneous buying.

Trust Badges

6. Watch the sales roll-in.

Top Tips for a Successful Responsive Ecommerce Website

Now that you have mastered your product pages, it is time to look at your responsive site as a whole. Recommended by Google, responsive design has the power to open up your website to a whole new audience of visitors if executed correctly.

Interested in increasing conversions and boosting sales? Call netmatter today to discuss a responsive website for your business.

Catherine Durham

Catherine Durham

Marketing Director (Dip DigM)

Catherine Durham has a masters in Digital Marketing and a wealth of experience in optimisation and strategy development for ecommerce retailers. Her specialisms include SEO, paid search, email marketing and conversion rate optimisation.

Comments and feedback

Have something to add? Join the discussion and let us know your thoughts via the comments.

Add a comment