From the course: HTML & CSS: Creating Forms

Unlock the full course today

Join today to access over 22,400 courses taught by industry experts or purchase this course individually.

Form labels

Form labels - HTML Tutorial

From the course: HTML & CSS: Creating Forms

Start my 1-month free trial

Form labels

- [Instructor] Labels on each of your form fields are key to making sure the user fills out the form properly. The way you lay out the labels on the page can make a big difference. For example, the label placement will often depend on the width of the screen. At the narrow screen width you see here, on a responsive website, it makes sense to have the labels above each form field, so that the input elements can be as wide as possible. On a wider screen you have more options. Many forms have the labels on the left, like this, including the check-box labels at the bottom. For long-form, this is usually the best option, because users can easily skim the labels on the left side of the screen. If there is a lot of different inputs to fill out, the user likes to skim through them ahead of time to make sure that they have all the information they need. The layout starts to have problems when the labels vary in length. Here, we have some very long labels, like Best Number to Reach you, and…

Contents