Add best practices for form validation

docs/advanced-reading/ui-recommendations.md

@@ -14,3 +14,10 @@
 
 More information: [http://ux.stackexchange.com/a/768](http://ux.stackexchange.com/a/768)
 
+## Form validation
+
+- Only validate input after leaving the field (or after the user stopped typing for some time)
+- The user shouldn't be able to submit the form if there are errors
+- However, disabling the submit button in case there are errors is also not optimal. Instead, clicking the submit button should highlight the errors.
+- Empty required files shouldn't be marked as invalid until the user a) tries to submit the form or b) focused the field, deleted it contents and then left the field (see https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_required)
+- Ideally, the error message should be shown below the text field and not as a tooltip (so that users quickly understand what's the problem). For example as here https://mdbootstrap.com/docs/jquery/forms/validation/?#custom-styles