When we design a Text field Which one is most suited to the form ?
For text label positioning, we typically use three options: top, left, and right-aligned. The ideal style for us will be determined by the primary goals and sizes of the form, component library, and platform for which we are designing.
For text label positioning, we typically use three options: top, left, and right-aligned.
The ideal style for us will be determined by the primary goals and sizes of the form, component library, and platform for which we are designing.
Top-aligned Text fields
The quickest completion time and overall best choice for the majority of situations. They work well on mobile since they don’t take up a lot of horizontal space.
Advantage : Capture all inputs and labels in single eye and fastest completion of forms.
Disadvantage : Use more space of the page as vertical.
Left-aligned Text fields
When the data requested is unfamiliar to people, this is a suitable option.
Advantage : Labels that are easily scalable and make excellent use of vertical space
Disadvantage : Excessive and variable distances between labels and related inputs increase completion of forms.
Right-aligned Text fields
Advantage : The amount of eye movements is limited, resulting in a quick completion time; because the text field labels and input are near together.
Disadvantage : It is more difficult to fast scan the form and understand what information is necessary.
Mobile and Web UI (User Interface) Designer | UX (User Experience) Designer | Mobile application Developer (iOS & android) | Freelancer 📖️ University of Westminster - London 👩🎓2022 (undergraduate) 👩💻 Android and iOS developer 👩💻 UI / UX designer