How to Design an Effective Sales Page

I recently reviewed the link checking tool Inspyder InSite.

As I was checking my facts I was struck by how well designed the product page was from the standpoint of effectively selling a product online.

Let's break the page down into its component parts:

'Inspyder InSite product box

1. Main Heading

Inspyder InSite

Okay, it's the name of the product. Nothing to report here.

2. Tag line

Find spelling mistakes and broken links before your customers do.

Look at how concisely this sentence explains what the product does while still including a sales element — providing you with the ability to find these problems before your customers do.

Of course, a meaningful tag line is a good idea for almost any site. Given the speed with which people surf the web and their short attention, you can never be too clear about what it is that your site does.

3. Overview

InSite is a site-wide spell checking and link validation tool. It's easy to use, yet powerful enough to handle complex sites. InSite is affordable, feature rich and can check your entire site in seconds.

A great overview which sums up the key attributes and selling points of the product. It's also written in clear, simple English and makes use of short, to-the-point sentences.

I wonder how many iterations this paragraph went through to get to this point, where every word serves a purpose.

4. Free Trial

Look — you can download a free trial. It says so, in really big text with a download icon next to it to hammer the point home.

Providing a free trial is a critical component to selling any software on the web and is one of the first things potential customers will be looking for. It's a big help to the user to make it easily available from the home page.

The only addition I would make here is to indicate if the trial software is limited in any way — for example, if some features are disabled or it is time-limited.

In fact, the differences between the free and full versions are provided further down the page, but it would be a good idea to indicate here that this information is available.

5. Features and Benefits

Just look at them all. Nicely laid out in a scannable list.

I'd be tempted to use a numbered list and change the heading to "7 Reasons to Buy Inspyder InSite" — this feels like a stronger statement to me.

Of course, the key is to continually tweak and test sections like this in order to find out what does work best. Rest assured, you won't get it right the first time.

6. Buy Now ($49.95)

Appropriately placed. You've learned enough about the product in steps 2-5 to be ready to make a buying decision. Big text is used again and the price is clearly stated.

This is another good e-commerce rule: don't make it hard for the user to buy your product and don't give them a reason not to (i.e. they don't know how much it costs).

7. How-to Guides and Screenshot

There's no need to put this content too high up the page, but it's a good idea to present it upfront, especially the screenshot.

In fact, I would move the screenshot up the page and replace the fake product box which doesn't serve a useful purpose for a product that is sold digitally.

I would also add some more screenshots — if I'm going to buy, or even try out, a product I like to have a good idea of what it looks like.

8. More Benefits

It's not a bad idea to separate these, mostly secondary features of the product from the main ones presented higher up the page.

Presenting all these features and benefits in one single section would run the risk of overwhelming the reader with information and potentially hiding the most important ones.

9. Version Comparison

Clearly shows what you get with the free and paid versions of the product. I'd put a download and buy now link under each to make it easy for potential customers to take that critical next step.

10. Minimum Requirements

Great idea to make this information readily accessible. Too often you have to root around for it. After all, you're not going to buy something that won't run on your computer.

What's Missing?

Not much. I'd add some extra screenshots, as I mentioned above and would include a couple of customer testimonials to add some authenticity to the sales messages (i.e. "don't just take our word for it").

I'd also move the "Resources" box from the top right, where it is obscured by the fake product graphic, to the bottom of the page where more people are likely to see it as they read through the page.

It's perfect 'read more' content for people who still haven't made up their minds.

Oh, and I'd probably make the headings bigger and change their color to something that stands out more.

However, overall, this is a great example of a product page built to sell effectively.

Posted on: August 25, 2007 | 3 Comments

Recent Entries in "Web Design"

3 Comments Posted

It's pretty good as far as content goes, but from a purely visual perspective, I think that it needs some layout help. The way things don't align creates a tension and slightly jarring feeling as you scan down the page. I believe I'd like to see more impactful headings (like you mentioned) and more things aligning to an invisible grid... :) I think the feeling of order would be increased.

Some ideas would be to left-align the Free Trial and Buy Now buttons, making them equal width; and equalize the size differences between the screenshot and the product box shot and define the column that they live in a bit better.

Ian, I agree with you regarding the visuals and your suggestions; however I would see this as being of secondary importance compared with getting the content right.

Also, the larger point I was alluding too is that you don't need to be a kick-ass designer to create an effective sales page. If you don't have the design chops, keep the visuals straight forward and focus on the content — that's where the ROI is.

Yes the content is important which is supplied but the looks is just as important and I personally would not buy this feature not just because of the looks but it did not help me want to buy it (if that makes sense)..

It just looks too bland imo

The one thing I disagree with in your analysis is your opinion about the inclusion of "#8 More Benefits."

The problem with TWO lists of benefits is that I, as a user, get confused about which list is the right, more complete one - I start comparing/contrasting and get lost - and I don't know why there's two lists, as the label of the second list, "the [product] advantage," tells me nothing concrete - only that I'm being marketed to.

Keep the one list of benefits - succinct, clear, to the point - don't junk up the page with a random second list (did the marketing team win this real estate in a coffee-break debate?).

As for the layout, I think it's interesting enough - I didn't like the icons for 'buy now' and 'download free trial' not lining up - layout is more than just being 'pretty,' it's about visual communication -

Other than that, a clear, direct site.

Those are good points. The first things I always check before looking at any online software are the limitations of the trials and the screenshots (you can tell a lot from a screenshot).

I agree with Chris here. When considering buying software, the design does not have nearly as much importance as the information I want to know. I'm buying the software, not the site. Having said that, a poorly designed website will make me think the software is equally as poorly designed.

The one thing I'm not too keen on is the fake image of the box. For some reason I just think those are always a waste and they could have put a nice close-up of a section of the interface.

Hey ! Thanks. works great for me and saved me a lot of time :)

Getting the message to your future customers is not an easy task. However, that site shows a way forward on how to use words to express the product.




Subscribe to my RSS FeedSubscribe to my Web Design Blog RSS Feed

Proud member of 9rules network