Each part of the user experience to consider.

Keep the input in default state

The field should stay in default before entry, and only be checked for validation after information has been entered.


Allow user to enter information

Let the user type without interruptions aka don't validate live. Let them feel they have completed their entry, and then after losing focus...


Signal error after loss of focus

After the input has lost focus, by either changing to another field or clicking a button/link, you may validate.

Clearly explain why the error happened, and what is required to resolve it. Also consider an icon with your error message for colour-blind users.


Change to default upon reattempt

Once the user focuses on the field again, the error message should disappear, as they change their value.



Looks good this time, and we let them continue.