Stop Using “Dropdown”

Avatar of Chris Coyier
Chris Coyier on

Find and fix web accessibility issues with ease using axe DevTools Pro. Try for free!

Adrian Roselli notes that it might actually mean:

  • A <select> menu
  • An ARIA Listbox, Combobox, Menu, or Disclosure Widget
  • An input with a <datalist>
  • An input with autocomplete
  • A <details><summary> block
  • An accordion
  • Flyout navigation

In my own usage, I tend to mean “A UI pattern where you click/tap a small thing and a big thing opens.” An aria-expanded situation, like, say, the user avatar on CodePen that you click to expand user-specific actions and navigation. “Menu” feels right to me, although I’m not sure that’s much of an improvement.

I take the point. Dropdown doesn’t actually mean anything and that ambiguity may hurt conversation and understanding.

Direct Link →