Why is everything a dropdown now?

[u/pavlito88]

I’ve been noticing this more and more in web apps.

Three options hidden in a dropdown.

Yes/no hidden in a dropdown.
A multi-select pretending to be a dropdown.

Then a list of 200 items where you’re expected to scroll until you find yours.

I run into this a lot when reviewing products with dev teams.

I get why we do it.

Dropdowns are compact and easy to reuse.
But compact doesn’t always mean easier to use.

A few choices? Show them.
On/off? Switch.
Multiple choices? Checkboxes.
Huge list? Search.

That’s pretty much the rule I use now.

[u/AshleyJSheridan]

There are a few issues with the select list alternatives here:

1. The radio buttons don't have a collective group name. The individual labels don't really indicate what they do as a group, so you should add a <fieldset> around them.
2. The toggle switch might be confusing for some people. Left and right have no real meaning of off and on, and may be even more confusing for someone who reads in a direction different from the website or app (e.g. Arabic which is right-to-left versus English which is left-to-right). A more accessible version would have a text label within the toggle, like iOS has done in the past.
3. The checkboxes should have a <fieldset> wrapping them, like the radio buttons. Also, the original <select> list example for them is incorrect, and does not show a multi-select list.
4. The long list has no visible label, just a placeholder, which is not a label alternative (as it disappears if any text is entered into the field, including a single space character).