Inline validation as users move through form fields, can act as positive reinforcement for them. Especially for less obvious answers, such as picking a unique username or a strong password.
However avoid validating on each keystroke as you often cannot validate until someone has finished typing their answer.
If someone makes a mistake in one field, don’t clear the fields they got right on the first attempt, when you show the validation error messages.
This one is rare nowadays, however some sites still make the mistake.
Don’t just rely on placeholders, include a label as well. As once a field has been filled out, the placeholder is no longer visible.
If you have two fields such as “Your name” and “Partner’s name” next to each other, it could be hard for users to be sure they filled out the correct field, without a label.
Rather than forcing the format of something like a phone number during user input. Use server side code to transform whatever the user entered into the format you want to display or store.
Not all users will want to input a number in the format you require, so why not reduce any potential friction.
Perhaps add in some validation in case what they have entered is way off though.
Try marking the “optional” fields instead of the “required” fields, as some people have found that people fill out more of the fields in this situation.
Of course always A/B test as this might not be the case for your users.
If you want users to fill out a form fast, put your labels above each field. This layout is easier to scan as the eyes move straight down the page.
However if you want your users to read and take notice of each label, put the labels to the left of the fields. This layout is read in a slower down and right (Z shape) motion.
Tell users what your password rules are up front, rather than making them guess and wait for validation errors.
You could also check the rules with JavaScript as they type, then put a tick next to each rule as they are satisfied.
Validate your form fields before submitting the form using JavaScript, so that users don’t have to wait for the server to respond.
Server side validation is still a good idea, for those without JavaScript enabled though.
You certainly do “Submit” the data in your forms, however you can be a bit more inventive or emotive about what the button text says.
If your form is a sign up form, try “Sign up”, “Start now” or “Join” or anything that isn’t boring old “Submit”.
Try to use intelligent defaults for fields, such as the most popular option or using an IP to Geolocation lookup service to auto select the Country.
The reset button almost always causes more problems than it solves, so remove it unless you absolutely have to have it.
Try showing the form with less fields, then showing more once the user has entered data into the first couple.
However don’t over do it, no one likes a three field form that turns into a 20 field interrogation.
When showing validation errors, try to highlight which field is causing the error. Also try to show any error message in a useful context or relevant position.
Forms with fewer fields seem less daunting to users, especially on mobile, where typing lots isn’t always ideal.
Try asking only for a couple of fields to sign up, then ask for additional data later on when it is needed. For example, ask for a postal address when you need to ship or bill something, rather than at sign up.
Save your users having to type in their entire address, implement postcode to address lookup.
