Forms are an essential part of our site. The users provide data in a form, we collect that data and we can do various things. Therefore we can say that forms are the user’s gateway into our back end.
For this reason forms need to be very simple, clear and we need to do them right. This is due the fact that we not only want the correct data to be collected but we also want the users to have a nice experience while submitting their data so as not to lose them.
So it is important to specify the proper types of inputs for each possible data item. There are many possible ways to collect a piece of data, however there is only one way that is easiest for the user and eliminates the chances the user inputting erroneous data.
- The importance of forms in a site.
- How to construct a basic form.
- HTML form attributes (action, method etc…)
- How to specify which path the form gets submitted to.
- When we submit using
- HTML Form Elements.
- When we use checkboxes instead of radio buttons.
- When we use combobox/dropdown instead of a text field.
- How to make a very large text field.
- How to link elements with their labels.
- How to link element selections together (e.g. check boxes).
- What other options we have of our "submit" button to say instead of "submit".
- What is client-side form validation.
- validation attributes on form elements
Study Shay Howe on Forms
Browse through Form Basics from MDN to see if you’ve missed anything.
Go through this interactive screencast by Scrimba: HTML Forms and Input
- Read the What is accessibility? section from Google’s page on Accessiblity which contains important notes about form accessibility.
- Carefully study and bookmark this Forms Accessiblity Checklist and always ensure that your forms are created with these rules in mind
In this section you can find a lot of helpful links to other content. This is a supplemental material for you if you want to dive deeper into some concepts.
Introduction to Forms validation
HTML form validation is really important and this tutorial covers pretty much everything you need to know.