0

Is there any best practice being applied in a global dropdown placeholder,

let's say the label is: "Select Fee Option"

I see common placeholders that says: 1. "Select..." 2. "Select any" 3. "--Select--" 4. "Please Choose"


What do you guys think is the most standard and good UX?

2

In general I recommend dual labelling for pickers, with a fixed, permanent category prefix outside the form itself - in your example, that would be 'Fee Option' - and a dynamic status label inside the form to indicate its current status. Think of this as a call-and-response or question-and-answer scheme; "Fee option?" - "Monthly | Annual | Lump Sum"(or whatever choice your application offers). Only omit the unnecessary question mark. Punctuation in input labelling is generally not recommended.

That call-response labelling scheme gives your user an instantaneous overview over the completion status of a series of input fields - be those dropdown pickers, date pickers, or text entry forms / combo boxes. Avoid duplication, though: Don't use identical prefix and placeholder text. Make sure the labelling semantics follow the scheme [category prefix] - [editable current-state] consistently.

Once you've established that labelling scheme, with meaningful prefix titles, devise a consistent indicator for indeterminate states of your selectors.

For dropdown or date pickers - anything with a constrained, finite choice - see how your overall UI looks when an indeterminate state on all input fields says "Select"; this should generally be understandable as a selection has not yet been made. If the input is required, use more assertive affordances. Google Material will have suggestions that combine visual and verbal cues to indicate when a selection is critical; in addition, block your user from proceeding or completing the setup routine (which seems to be what you're describing).

To get back to your example, the input field's landing state would be...

Fee option [Select]

...where the square-bracketed text resembles labelling on the form itself and the text before the category label. Don't use duplicate prefixing like "Select fee option" - "[Fee option]". You see what I mean by call-and-response? Indeterminate states are marked by a noun as category prefix and followed by a verb as call-to-action (CTA) label on the input field itself. Use the same for date or time pickers; "Start date" - "Select".

One your user makes a selection, the input field converts to its completed state...

Fee option [Monthly payment]

...or something of that nature. If the selection is critical, remove all markers of that criticality such as red-framing the field, added asterisks to the category label, explicit 'Required' labelling - and unblock completion (e.g. 'Submit').

With text entry or combo boxes, i.e. input fields with theoretically infinite choices for entry like user name or address, use exemplary hint text inside the form...

Address [e.g. 123 Hamilton Street]

...rather than repeating 'Address' as hint text, which serves no informative purpose. Hope that helps!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.