<input type="text" name="firstname">

Notice how we use the <input> element to denote that we want an input on the form, then the type of input we are requesting is defined in the type attribute. This is the same for all the various input types.

Also notice the name attribute. This attribute is essential and required for your input to be submitted by the form. It is fundamentally important that you always include the name attribute on all of your inputs that are to be submitted.

The above code will generate a blank input field for your user to enter their information into. However, there’s currently no label explaining what information is required. For this we can make use of the <label> tag.

Though not required, it’s important for optimal usability to ensure your input fields are labelled for your user. The <label> element can be used in conjunction with your inputs to provide some context and meaning around your input fields. See the below example: