Submitting a Form

The primary action button allowing users to submit information should always be in sight. The most intuitive placement is below the form fields or in the upper right corner. On mobile, if the form is long and users need to scroll, fix the button position so it won't disappear.

The button's label should be straightforward and on-point. Users should immediately understand what happens after they press it. You can change the copy to fit the form, e.g., the button can say "Subscribe" if someone is providing their email address to receive emails.

The loading state helps users see the form is in the process of being submitted. According to the first of Jakob Nielsen's 10 Heuristics, visibility of system status is crucial — the system should always keep users informed about what is happening right now and provide clear and on-time feedback. This makes users feel in control of the system, so they know how to act to reach their goal. Showing the button's state also increases user trust in the brand.^[1]

Once the form is submitted, communicate that back to users with a clear success message. First, showing a success message follows Nielsen's Heuristics about the visibility of the system status. Second, it increases user satisfaction when they achieve one of their goals.

Sometimes, things don't work out. If the form can't be submitted due to invalid information or another error, let users know about it.

When users see that something went wrong, they may feel disappointed, irritated, and stressed. A formal, ambiguous, robotic message is the last thing they need to see. Good error messages should be polite, clear, and informative. Clearly explain to users what happened and provide advice on what they should do next.^[2]

However, providing specific error details (e.g., whether the username or password is incorrect) can be a security risk. Display error messages like "Invalid username or password" to prevent revealing information that could aid attackers.

As humans, we all make mistakes, and sometimes, users provide incorrect data that doesn't meet input criteria, preventing the system from submitting the form. To value users' time, it is important to inform them about these errors promptly, instead of waiting until they hit the Submit button. Therefore, it is recommended to validate each input after users fill in the information and move the focus away from the input.

To provide effective feedback, the error message should be concise yet precise, clearly indicating what went wrong and how users can fix the problem to continue with their task.