How to use HTML to create forms that are easy to use

These notes look at how to create forms that look good on the page, are easily used by everyone (including disabled people), and also give users a chance to confirm or change their input.

About Forms

Forms enable you to obtain information from your visitors. That information will be more reliable if the form is designed in a logical format and includes a feedback process that checks the input data and allows the user to confirm or change the inputs before final submission.

PROCESS OF FORM COMPLETION AND SUBMISSION

The flow chart below shows a typical sequence for checking that a form has been completed satisfactorily prior to submission.

Flow chart of form submision process
Flow chart showing steps required for reliable form submission

The form sends the collected data to your server where it can be checked for completeness. Using an application such as PHP, CFM or ASP.NET your server can process the data and work out if the form has been completed reasonably well. If so then the server returns a page that allows the user to confirm the details before final submission. If the application suspects a fault in the data entered then it should return a page that identifies the fields that might need attention with some appropriate tips to help the user complete the form correctly. We shall look at how to provide these tips on page 2. The essential thing is that you allow the user to check and confirm the data being submitted before it is finally sent to your database.