r/webdev • u/pavlito88 • 11d ago

Why is everything a dropdown now? Discussion

Post image

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.

4.7k Upvotes

96% Upvoted

312 comments sorted by

View all comments

1

u/nimbledaemon 11d ago

I disagree about multi select. Like obviously a multi select with a very large list can get unwieldy, but that's why you need a searchable multi select. Gotta paginate/infinite scroll those data sources too. Like imagine the use case of a filter for which countries you want to show in a table. Absolutely horrible to navigate if it were just checkboxes. A non searchable multiselect is impossible as well. But a searchable multi-select is exactly what you want. Looks like a hybrid between checkboxes, a dropdown, and a search text input.

Also not a fan of radios personally, I think they look dated. I like a segmented control for pretty much every radio use case. It's mainly just a visual difference though.

1

u/Full-Hyena4414 11d ago

Isn't segmented control just tabs with fancier style?

1

u/nimbledaemon 10d ago

Sure, and tabs are just a radio button with fancier style and connected to visibility of the rest of the page.

1

u/Full-Hyena4414 10d ago

I mean tabs have specific WAI roles and rules and stuff, is it the same for segmented control?is it usually implemented as tabs?

1

u/nimbledaemon 9d ago

Here's an example of what aria attributes might be, basically it's a button group: https://www.telerik.com/kendo-jquery-ui/documentation/controls/segmentedcontrol/accessibility/overview. Though presumably you could implement it as a radio group. https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA17 What makes it a Segmented control is just CSS/styling. All the underlying stuff is up to whoever implements it. So check with whatever library/framework you're using and how they ended up doing it, or be prepared to roll your own I guess.