Accordion patterns have a small set of visual cues to choose from, and NN/g research suggests the choice matters. The bigger findings concern what happens around the icon: split menus, and the habit of wiring a label and an icon to two different actions.

When There Is No Icon

Users treat a menu item without an icon as a direct link to a new page. Custom icons perform poorly for the same reason in reverse: they do not communicate that a tap or click opens an accordion. For most icons, people tap the icon and the text label at roughly equal rates.

Designs often stack carets and arrows on top of one another and change their direction with accordion state. That is usually unnecessary. A link needs no arrow at all: the cheapest, most effective treatment is a plain underline. It is not exciting, but it works without fail.

Directional Arrows and Split Buttons

A right-pointing arrow ▶ does not create an expectation of navigating to a new page, and the same icon rotated downward ▼ does not reliably suggest that an accordion will open.

Split buttons — label opens the page, icon expands the accordion — should therefore be avoided. The more dependable arrangement lets users tap the main category to reveal the menu, with a link to the category page placed inside that menu. Anything else invites mis-taps.

Plus/Minus and Up/Down Arrows

+/− and ↓/↑ are widely used for expanded and collapsed states and generally work. Their weakness is ambiguity. A plus can read as save-for-later, add-to-cart or zoom-in, and it gets especially muddy in multi-level navigation where several levels are open at once. Up and down arrows may suggest scrolling, sliding, jumping to a position in the page, or finding the next match.

Neither family is broken — both are well understood — but each is overloaded with meanings, so results depend on the surrounding design.

The safe choice is a caret/triangle pointing down ▼ in the default state, changing to an upward or sideways caret on interaction. Plus/minus is an acceptable alternative.

  • Do not add further icons or arrows to communicate where links lead.
  • Avoid split menus; they generate more errors than benefits.
  • Give one control one job: a single button or dropdown that reveals options and lets users drill down.
  • For a direct link, attach it to the title and underline it.

In most cases, simpler is better.