Hypothesis
Skip navigation

Back

0 A UX Designers Guide To Using Form Elements

A UX Designers Guide To Using Form Elements

Text Entry Fields

Advantages
Very flexible and familiar to users. Occupies little screen space.
Disadvantages
The user must recall the text to enter rather than simply recognise the correct entry.

There is scope for data-entry errors such as misspelling. The space inside the box belongs to the user. Some users think placeholder text should be in an input field because it disappears when the user starts answering a question, it’s hard to check answers after the labels are gone. Sometimes the placeholder text needs to be deleted by the user.

Check Boxes

Advantages
Easy access to options Easy comparison of alternative options.
Disadvantages
Consumes screen space. Only effective for a limited number of choices that are fixed and small (between 2 and 8). Single check boxes are difficult to align with other screen controls as they often possess long descriptions.

Radio Buttons

Advantages
Provides easy access to and comparison of choices.
Allows a textual description to be added to each choice item.
Disadvantages
Only effective for a limited number of choices that are fixed and small (between 2 and 8).

Spin Box / Stepper

Advantages
Consumes relatively little screen space.
Flexible, and permits either selection or typed entry.
Disadvantages
Difficult to compare choices.
Can be awkward to use/operate.

Drop-Down / Pop-up List Box

Advantages
Unlimited number of choices Reminds user of available options Conserves screen space.
Disadvantages
Requires an additional action to display the option list. May require scrolling in order to access all the list items. The list may be ordered in an unpredictable way, making it hard to find items.

Luke Wroblewski - “Dropdowns should be the last resort.”

Overall Hits: 1361