Position of alert message in confirmation page

Question

I have a page that displays a transaction summary where the user can perform a final check before clicking the confirmation button.

I am not sure on where to place this alert message: "Please ensure the details are correct before hitting the confirm button"

Based on my survey, this alert message is placed under the summary and above the confirmation button. But does it make more sense to have it before the summary so the user is reminded to check the details carefully when they read it the first time?

I am also not sure on the italics in the alert message above.

Kindly advise and thank you in advance :)

Answer 1

I would suggest using the top heading to make it clear what this page is and what the user is doing on this step; confirming the information they provided.

I think there is a good argument for both placements of the alert message:

At the top:

The user is immediately made aware that they have to carefully read through the information they provided because by clicking on "continue" they are confirming that the information is, in fact, correct.

If we compare this to a shopping mall where you are reminded at the entrance by a sign that says "Please leave shopping bags/carts here when exiting the store", then visitors are made aware when entering the store that they have to leave their bags/carts here when they are done shopping.

The disadvantage of this, is that I can imagine that if someone is in the store for 30+ minutes it is easy to have forgotten this message and not remember where to leave their bag/cart.

At the bottom:

If the alert is at the bottom, right above the "Continue" button, then it would serve as an extra reminder to make sure the information is correct.

The visitor is then not alerted at the entrance of the store, but at the exit when leaving the store. This is really helpful, because this is exactly the time when they need this reminder.

The disadvantage for this option is that a digital form is not perfectly analogous to a physical store, and for long forms it would add extra frustration to find this reminder all the way at the bottom of a long page. Undoubtedly, some users will feel they have to scroll all the way backup to scroll through the information again to really make sure they didn't miss anything.

Conclusion:

I don't think one option is necessarily better than the other, and it mostly depends on the length of the form. I also think that copy can make a huge difference. If you use good copy at the top, and add a clear reminder at the right time (right before continuing) that would go a long way.

I would also strongly suggest to avoid using italics, because this would reduce legibility for a number of people. Use font-weight and color/contrast to illustrate importance instead.

Here is a quick demo I made to visualize the idea in my head:

Answer 2

Since the purpose of this page is to allow the user to perform a final check, the instructions belong at the top of the page.

"Please ensure the details are correct before hitting the confirm button."

You asked about the use of italics -- I would recommend removing them. It comes across as the system treating the user as if he or she is unfamiliar with confirmation pages, and the tone might be taken as condescending.

You didn't ask about the phrasing, but it might be more standard to say something like: "Ensure details are correct, then click Confirm."

If you are seeing a large amount of user errors because people are ignoring confirming their details and it's extremely important that they get things right, you could add a checkbox with the label of "I confirm that these details are accurate" right before the Confirm button.

Answer 3

Put these instructions after the text field that gathers the important details, and before the submit button.

The user will then encounter these instructions after they've written the details, and it will prompt them to check them again. This separates their "authoring" phase from their "proofreading" phase.

Two passes (one to compose and a second to polish) is more effective at producing a correctly-detailed report than one pass, and placing that message after the field encourages a two-pass approach.

Finally, you could add either a checkbox field, or a checkbox button on the alert message, either of which when clicked activates the previously-disabled submit button. Basically it's a "check here to confirm you grokked this message" mechanism.

Answer 4

Coinbase is doing something similar when users will send funds to their platform. They present you a modal before displaying the deposit details to the user and they are asking for a confirmation from the user too.

I think they are doing this to make sure the user is reading this important information and acknowledges it before even seeing the deposit details.

The information above a button About the action that is going to do is above the button.

Information under the call to action: Is usually secondary actions (register/login) or even a cancel action.

Answer 5

How is the alert being displayed ? I would rather just have the text as a normal paragraph text that guides the user before filling out the form. If you are using the alert as a pre-confirmation then I would associate it with the confirmation button as the task for the step.This would require it to be placed at the bottom as the top would make it seem disjointed.