Pricing Page Design – Factors to Take Into Consideration

Web Design & Dev
MotoCMS Editorial 23 October, 2014

What is the 2nd most important page for a SAAS website after Contact us page? Of course, it is the Pricing page. It is the Pricing page that eventually makes or breaks the deal. It is the page that decides whether a visitor becomes a customer or not. From the usability and design stand point, price page with its multiple pricing tables always throws up multiple challenges to the designer. It needs to have a simple structure and at the same time, it should have a proper structure.

Pricing Page Design – Factors to Take Into Consideration

The purpose of this kind of pages is to facilitate the process of conversion or to make it easier for the users to pick the right plan. A small mistake and your website might witness an exodus of potential customers. You certainly can’t let this happen. Here we are going to take a look at some factors that can help you create a stunning and conversion-friendly pricing page design.

1. Focus on Differences

If you have multiple plans available for your customers, your pricing page should focus on the differences between them and not on the similarities. This will make it easier for visitors to take a quick decision. It makes sense to group dissimilar features at the top of your pricing table and then show similar ones at the bottom. You can use the cross sign to show unavailable items and the tick sign – those that are available.

Pricing Page Design – KajabiApp

The KajabiApp Pricing page has made it easier for visitors to take the right action by adding multiple design tweaks. It uses bold letters for the most prominent features of each plan. There are also tick and cross signs grouped together. That’s a great way to grab the attention.

2. Use Visuals To Show the Differences

The use of visual elements in pricing page designs is a common practice among web designers. This allows to present the difference between plans in an interesting way. Say for example, for the best plan that has the finest set of features, you use a large illustration whereas for other plans, you use similar illustrations but smaller in size. This will have a dramatic impact on decision making process of visitors. Since the best plan has the biggest illustration, it will capture the attention of audience easily. It will also help people make the right decision about a purchase.

Pricing Page Design – MailChimp

MailChimp has done a great job by adding three different illustrations to represent three different types of business. These illustrations, apart from making the page visually attractive, help seize the attention of site visitors and also help them make the right choice.

3. Keep It Short and Sweet

The purpose of the pricing page is to make it easy for the targeted audience to figure out the differences between plans or packages. Therefore, it is important that you are making the tables and the features look less complicated and less intimidating. Some designers tend to believe that they need to highlight all the features of all the plans. However, you need to do exactly just the opposite. It is never a good idea to overwhelm the audience with too much information.

You need to strike a perfect balance between offering too much and too little information. You need to understand what the audience is looking for and then add only those features.

Website Template with Pricing Page Design

In the above hosting website template, the pricing tables contain only the required information. There is no attempt at all to overload the page with too much info. The page only contains the Price, CTA button, some features and that is all.

4. Keep the Focus on Price

Why do people visit pricing pages after all? Well, no prize for guessing. People visit them because they want to know the price! But strangely, there are some pricing pages where you will literally have to struggle to find out the price of different packages. But this should not be the case with pricing pages at all. You should be trying your level best to show the cost of individual plans prominently. This can be achieved easily by increasing the font size, changing the font color or by using different font types for the Price section. An appropriate weight should be given to the price, so that people can easily find it.

Website Template with Pricing Pages

The current template with pricing table has managed to keep the focus on price by using different color combinations and by making changes in the font type and the font size. It offers a distraction free browsing experience as well.

5. Gain Trust of the Audience

It is a fact that people hesitate a lot when they have to loosen their purse string. And we simply can’t blame them because there are so many cases of scam associated with online transactions. There is no way you are going to win their 100% trust, however, you can eliminate the frictions like doubts, uncertainties and others by making some small changes in the pricing page design.

To alleviate the fears of the visitors, you need to mention in no uncertain terms that you are offering – ’30 Days Money Back Guarantee’ or alternatively you can show testimonials of clients. Add a link to a Case Study section of your website, so that people can read and get an idea of how to get benefited by your product or service.

Pricing Page Design - SproutSocial

SproutSocial pricing page includes logos of companies past and present customers and since they are big brands, it helps instill faith on the customers on the service. It also includes an option for getting free demo/free trial that further encourages visitors to opt for the service.

6. Simplify Things

People come to зricing pages to compare plans. Often people visit this page, once they have decided to opt for the service. Therefore, if you can manage to present information in a simple and intuitive way, you will be able to convert a large number of targeted audiences. Each plan should justify its price by highlighting the features that it offers. Remember one thing that most people don’t know exactly what they are looking for and therefore, you need to highlight the features/benefits in the pricing tablesб so that people feel encouraged to select a plan. It should help and not hinder the process of conversion and therefore, you need to focus on making the page look simple and straightforward. No need to make things complex by adding too many elements in the page. Keep the page neat and clean as much as possible.

Pricing Page Design- Website Template

The best thing about the pricing website template is that it has no semblance of complexity at all. CTA buttons are prominent and prices get their portion of attention. Overall, this is a great example of a simple pricing page.

7. Do Upsell

The goal of the pricing page is to drive more sales and rack up more money. Therefore, you need to go all out to make people opt for the largest package. You can offer some discount if people choose the bigger amount of services. This is a common tactic applied by almost all web hosting companies. They offer deep discount if people stay with them for a longer period of time.

Pricing Page Design- Optimizely

Some other companies like Optimizely are doing this as well. It offers discounts on packages if people prefer a one or two year prepayment plan.

8. Offer Help

Since you are going to add multiple plans on the pricing page, you need to make it easy for people to make the right choice. There are some cool ways you can make people choose the right plan for them. You can highlight or emphasize the most expensive [or the best maybe] plan by placing it in the middle. Offer a free trial. However, this model may not be applicable for all business types. So, you need to suggest the plan that you feel will be suitable for most visitors. Also you can offer a trial version of what you produce, so that people can have a taste of the quality of your product before making a final decision. These are some psychological triggers that you need to incorporate in a pricing page design to ensure more conversions.

Pricing Page Design - Hosting Website Template

In this hosting web template, the Premium Package grabs the most attention as the designer has made it look like it is placed above all the other plans.

9. Limit Options

It has become a norm among SaaS companies to offer 4 different pricing plans to their audience. Most people don’t even do A/B testing to figure out which version is working best for them. Maybe 3 pricing plans are more than enough or maybe 4 plans are ideal for your business model. However, unless and until you test, you will never be able to tell which version is better. However, the number of plans should be kept within logical limit. Cramming a page with 10 different plans will only confuse the audience and thus you need to stop doing that.

Pricing Table - Hosting Provider Website Template

In the above hosting website template, the number of plans has been restricted to 3. The packages also contain limited number of features.


Finally, just don’t stop here. You need to do some testing, to add cool call to action buttons, to experiment with the color combination. It will definitely help you capture audience attention.

Author: MotoCMS Editorial
Here are the official MotoCMS news, releases and articles. Find out the latest info about product, sales and updates.

One response to “Pricing Page Design – Factors to Take Into Consideration”

  1. Mark Evans says:

    Great post given many pricing pages are boring and uninspiring. Here are my thoughts –

Leave a Reply

Your email address will not be published. Required fields are marked *