User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
I'm wondering what is the best practice of designing select / drop down lists. In some projects I've worked in the select on a form was filled with first value from the list. In other project we had always "-- select --" option chosen before user selected something else. I can imagine also empty field.
Is there any guideline about it? What is state of art in this matter?
I wouldn't say there are guidelines as such, but most design systems provide an insight on how to use dropdowns. Here are a few examples:
Material Design: Exposed Dropdown Menu
Sidenote, Apple generally doesn't like dropdowns, they take you to a whole other page with selections.
Microsoft Fluent Design Guidelines
Not exactly what you are looking for but worth taking a look.
General Guidelines (from my experience):
Default Dropdowns: Explanation - Dropdowns that have a default state. Examples - A dropdown that allows you to select a font. The default font is always selected. Guideline - Provide a placeholder with the default option selected.
No state Dropdowns: Explanation - A dropdown that has no way of knowing the default state of selection. Examples - A dropdown that is used to select your nationality. Guideline - Use an explanatory placeholder. For the example above, the placeholder would be "Select Nationality" or even "Select" would do.
Field Specific Dropdowns: Explanation - Dropdowns that have a predefined purpose. Examples - Calendars, Time selectors, Username/ Profile selection. Guideline - Use field specific placeholders. If I am designing a calendar input, then the placeholder will specify the day's date. Time selectors will have a similar placeholder displaying the current time. profile selectors for selecting a single profile from a list of profiles will have the current profile being used as a placeholder (see: facebook).
Hope this helps ^_^
There is no "best practice" here, those two options are completely different.
Pre-selected - use if you have a reason to believe one of the options is most likely (this can be based on most popular / probable option, or on data you know about the user) or you know the default or current option (something that you can choose to change, but an option is already in effect), or if you want to push the user for that option.
Blank or "please choose" - use this, if you don't know or if you need to make sure the user makes a conscious choice. Whether to label or leave empty is another choice.
Include instructional text as a dropdown item? No
All fields should have labels and that dropdown label should always be visible, so that should provide enough context for the user that a selection can be made. Instructional dropdown choices will disappear after selection anyway and will add redundant noise compared to what a label already provides.
According to UX Collective - Don’t default to "please select" in drop-downs:
Users don’t need to be told to "please select" if there’s a field that’s empty. Even more importantly though, users scan forms looking for empty fields.
Add default value to form input? Probably Not
According to UX Planet - Drop-Downs in Forms:
You should avoid having a default value unless you believe a large portion of your user’s (maybe 90%) will select that value. Particularly if it’s a required field.
Why? Because you’re likely to introduce errors because people go through forms quickly — don’t assume they will take the time to parse through all the choices and may accidentally miss something that already has a value
See Also:
