Imagine a user who is ready to sign up for your site. They go to your form and enter their information. The way you align your field labels affects how quick users can fill out your form.
Do you want to give users a quick, easy, and painless experience or do you want to give them a hassle? If you want to make their experience quick and easy use top aligned labels on your form fields.
Top aligned labels are faster and easier to fill out than left and right aligned labels. This is because top aligned labels only need half as many visual fixations. Top aligned labels also allow users to move down the form in one visual direction. Left and right aligned labels require two visual directions to fill out.
The only drawback with top aligned labels is that they can make the form long. But users are scrolling more often so this isn’t a big problem. By reducing the whitespace between fields, you can decrease the form length. You can also break the form up into multiple pages to make the form shorter.
The difference between top and left/right aligned labels is clear. Top aligned labels are easier on the eyes and make forms easier to fill out. Although they can make a form appear longer, when users fill it out they’ll notice a big difference in the time and effort to complete it.
If top aligned labels are able to give users a better experience with forms, it’s worth adopting. Designers should think more about their field label alignment. It can make the difference between a user completing the form or abandoning it.