7 Tips For Using Charts & Tables On Product Pages


Designing a high-converting product page is always a challenge. After all, there are just so many of them out there, how can you hope to make yours better than the rest?

And while there are all kinds of tips and tricks we could be talking about, in this post, we’re going to cover a topic that’s not often talked about, yet that is very easy to implement and also very effective: charts and tables.

How often do you come across a product you wish you’d known would fit you? Or a product that may or may not be the right size for your home? But there is simply no way to know, because there is no size chart to go by.

To prevent your customers from finding themselves in that same situation, here are our seven tips for using tables and charts on your product pages.

Make Sure your Data is Correct

This might seem like a very obvious tip, but do hear us out.

Let’s say you copy the figures into your chart from another website that sells the same item. Or from a review. Or even from the manufacturer’s own website. But what if that number is wrong? What is someone had mistyped it?

When adding your figures and other data to your charts and tables, make sure you check with at least two sources if they are correct, and preferably check on the actual product as well.

Don’t Use a Chart Where No Chart is Needed

These elements certainly look good on a page, but if you don’t need to add them, don’t.

For example, a page selling shoes would benefit from a chart about sizing. However, a page selling a painting might not. After all, there is a better way of displaying the measurements of said painting that does not involve a chart or a table.

Only use these elements when they serve to make the user experience better and to offer actual useful information, not as a design element.

Make it Easy to Understand

Your charts also need to be very straightforward and thought up in a way that leaves no room for questions or misinterpretation. If the user needs to spend a minute figuring out how one product compares to another or what size something actually is, you’ll already have lost them.

Here is an example from this page showcasing various empty pill capsules. At a glance, you can tell which capsule size is suitable for what kind of use, and there is no room for any confusion.

Think about your Customer’s Preferences

When adding figures and other data to your charts and tables, make sure you consider what the user will want to see.

For example, look at this page for a coffee machine on Amazon – their charts have data that is actually useful, like power, color, and so on.

Don’t add data that does not help someone make a decision – and focus on relevance and differentiation above all else.

Also, make sure to consider the location and other specifics of your customers. Are they using the metric system? What currency are they used to? Do they measure things in pounds or kilograms? Would they prefer if they were told something in grams or cups?

If you have audiences from different locations and with different preferences, make sure you offer information to all of them equally, as opposed to making them do their own conversions from one system to another.

Think about Competitor Specifics

If you need to highlight the specifics of a product, think about the most popular product in that specific niche. What does it need to stack up against?

For example, beauty bloggers often list the shades of the foundation they usually use as a reference, so customers could know how they compare to their own skin tone.

Can you do something similar for your products?

Also, make sure you consider product-specific standards as well. For example, if you label your shirts as Small, Medium, and Large, but they don’t match the standard measurements for these sizes, make sure you list the actual measurement of each product.

This will boost your conversions as well as your customer satisfaction rates. You can also cross-reference different product sizes across your pages. For example, if you’ve purchased product A in size X (your most popular product, let’s say), you will need a size Y in product B.

Make Sure they are Mobile-Friendly

Don’t forget that your charts and tables need to show up on all kinds of mobile devices as well and that most of them won’t be optimized on their own, without your intervention. And there is nothing worse for the user experience than a chart that does not fit a mobile screen properly.

Think about the best way to translate your charts to smaller screens (both in portrait and in landscape). Do you need to go for a different layout altogether? Can the same chart be made to fit smaller screens? Does the orientation need to be changed? Do you even need the chart on mobile?

Finally, test your re-optimized charts and tables on different devices to make sure they are syncing well.

Don’t Let the Chart be More Prominent than the Data

Charts and tables are certainly elements of page design and need to look good, but don’t forget that their main purpose is to convey information.

Don’t make them too flashy, too garish, or too out there. Make them visually appealing, yes, but not at the expense of the data they need to showcase.

If your charts and tables are too distracting from the other elements of the page or the data they’re housing, this will not exactly be a pleasant user experience, so do bear that in mind when trying to amp them up.

Final Thoughts

Charts and tables are an incredible way to add extra data to your product pages and to make them more appealing to visitors, thus inspiring more conversions. Keep these seven tips in mind when planning and creating them, and they should prove very useful indeed.

Contact us at Grizzly to learn how we can help you with your website.

Got a project in mind?

Let’s talk