6 ways to improve confirmation pages

Quick summary: Many websites drop the ball when it comes to creating usable and helpful confirmation pages. Here are six ways to ensure that users can complete a process with confidence and clarity.

It’s understandable that a great deal of attention is paid to how users initiate and move through multi-step transactions like shopping carts, bill payment, and the like. But a surprising number of websites drop the ball when addressing user needs once the process is complete. As a result users sometimes complete a transaction without realizing it – then wonder what they should do next. Usability problems that occur after completion of a transaction can be significant barriers to satisfaction and willingness to return, so it’s important for confirmation pages to “get it right”.

The good news is that “getting it right” isn’t complicated.

Here are 6 elements I believe are key to an effective and usable confirmation screen:

1. A clear and bold completion statement
2. A prominent transaction number (though there are exceptions)
3. Clear explanation of next steps
4. Minimal clutter
5. An “escape hatch”
6. Printer-friendly formatting and/or a print option

Let’s examine each in more detail.

1. A clear and bold completion statement

It may seem obvious to point out that the first priority of a confirmation page is to communicate that the transaction is done. Yet I’ve lost count of the number of times in user testing I’ve observed respondents struggle with small, hidden, or missing confirmation messages. I’ve seen intelligent, confident people arrive at a confirmation page, overlook the key confirmation message and then go hunting for a way to “complete” the transaction they’ve just finished. Worse, I’ve seen respondents who then clicked their browser’s Back button because they concluded they must have missed some important information on the previous screen. Mistakes like these can lead to session tracking issues and  other technical problems that are much better avoided in the first place. The ideal solution here is to make it completely and utterly obvious to users when they’ve finished a process. Let’s consider a couple of rough wireframe examples:

Note in the example on the left the small confirmation message and how other parts of the page employ strong eye-catching colors. Are users going to quickly notice the confirmation message? Maybe, but I’ll put my money on them noticing the brighter and bolder parts of the screen first.

In the example on the right we’re employing a confirmation message (“Thank you for placing your order”) that’s not only large and easy to see, but also begins with language that underscores that the process is complete (“Thank you”). The screen layout is purposely kept simple and uncluttered so that users can focus on that key message and other important information (for more on streamlining displays see this article).

2. A prominent transaction number

This may not be applicable for every situation (for example if the user is simply subscribing to a free newsletter there’s probably no need for a transaction number) but it’s beneficial for any transaction with a financial component (e.g. – a purchase, bank transfer, reservation, cancellation, etc). Of course the transaction/order number needs to stand out; it’s unwise to assume that users will “hunt” to find this information. It’s also unwise to assume that if the transaction/order number is sent via email that users will know to look there (see the next suggestion).

3. Clear explanation of next steps – anticipating likely questions and concerns

In many cases users who have just completed a process or transaction will want to know what will happen next. It makes sense to consider the key use cases and anticipate – then address – these needs. In the case of an e-commerce purchase for example users will likely wonder:

• Will I get an email confirmation?
• How long will it take before the item is shipped to me?
• What if something goes wrong with the order? (It’s out of stock, they couldn’t charge my credit card, etc.)
• When will it show up at my door?
• Do I get a tracking number?

Naturally the questions are different depending on the users and the type of transaction they’ve completed. In the case of a scheduled payment (for example a car loan or mortgage) likely questions might include:

• Will I get an email confirmation that I’ve scheduled this payment?
• Will I get a confirmation when this payment is made?
• What if something goes wrong with the transaction – will I be notified?

Conducting user testing with representative users – or other forms of research like surveys and interviews – can tell you exactly which questions will most be on users minds as they complete a transaction.

A related note: if there are next steps on a confirmation page that require users to click a link or graphic, it’s important to ensure that they’re visible “above the fold” (don’t require scrolling to see) for your users’ the most common screen resolutions.

4. Minimal clutter

Another common problem I see is the use of confirmation screens as a sort of catch-all for company marketing and promotional initiatives. It’s common to see a great many “you may also like” or “save on your next order” links and banners when completing an e-commerce transaction. Of course there’s nothing inherently wrong with promotional messages if they’re presented properly. But there’s a question of balance to consider. Remember: the more links, graphics and messages there are on a page the more difficult it becomes for users to focus on the ones most important to them. So as always, a “keep it simple” approach is wise. That’s not to say you can’t or shouldn’t have additional offers or messages on your confirmation pages. You simply need to ensure that the promotions don’t affect users’ ability to notice and read the important stuff.

5. An “escape hatch”

By “escape hatch” I mean guidance for what users should do if they have problems or questions about a transaction. This helps address the common concern “what if something goes wrong – what do I do?” and helps to reassure users. It also helps impart a sense that the website proprietors care about their customers – an important consideration if you want users to become repeat customers. An escape hatch can be as simple as a link to help or FAQs, or a customer support forum or telephone number. Regardless of the exact solution the principle is the same – assume that some users will have questions, and point them in the right direction.

6. Printer-friendly formatting and/or a print option

This is a relatively small but important point. Many websites already employ a printer-friendly format and/or print option on confirmation pages. But quite a few don’t, and users often want the added assurance of a printed confirmation – so it makes sense to facilitate this. This is especially important for transactions with a financial component, as users with money at stake are even more likely to want additional reassurances that their transaction hasn’t disappeared into a black hole.

The Finish Line

Of course there are a lot more than six ways to improve a confirmation page. But I challenge you to examine what you have currently and see how it stacks up to these attributes. If one or more are lacking then consider making some changes. It’s great to ensure that your products are easy to find and buy – but there’s also good value in ensuring that as users cross the finish line they’re satisfied and inclined to repeat the process in the future.

Photo credit: Dru Bloomfield. Creative Commons licensed.

• 

Related posts:

1. Communicate the rules
2. Communicating status
3. Readable type = usable type, part 2

Tagged as: confirmation, error prevention, information displays, messaging, setting expectations, streamlining