G2.05.2current-item highlight as minimum wayfindingdesignresearch

Highlighting the current item is the minimum location cue

Aliases: selected nav state · you-are-here highlight · current item

What it is

In a row or column of destinations, one item must look like “this is here.” Highlighting the current item is the minimum location cue: it does not name ancestors or depth; it only marks the current node among its peers. Without it, navigation looks identical on every page, and people have to reverse-engineer “which one I clicked” from the content title. The nav itself stops doing wayfinding.

Minimum means: with it, shallow sites usually have enough location; without it, any more elaborate path control is decoration on a blank map.

Why it happens

Peers form a choice set. A highlight marks one element as selected, and contrast (weight, fill, underline, icon treatment) lets a single scan answer “which one is me.” If that contrast shares a visual channel with hover, focus, or a notification badge, the highlight is no longer read as location—it is read as clickable or unread.

With no highlight, navigation repeats the same unselected state on every page, and spatial memory cannot pin “this slot is the one I chose.” People rerun a full search to check they are still on target, or they click the current item again by mistake. Tab bars, sidebars, and segmented controls all lean on this same minimum. It is cheap, so it is often dropped—especially on landing pages, campaign pages, and post-login interstitials where the nav is still there but no item is marked current.

Studying it

Run a location task with the body masked and only the nav visible; compare current-item highlight on versus off.

  • Paradigms: the same nav screenshot with and without a selected state, asking “which item are you on?”; on a live site, disable selected styles and watch for repeat clicks on the current item or a hunt for the title.
  • Independent variables: highlight present or absent, whether highlight shares a visual with hover/focus, whether the current item sits outside overflow.
  • Dependent variables: accuracy of reading location from the nav, repeat clicks on the current item, time spent confirming location.
  • Methodological note: a color-only highlight fails in color-blind and high-contrast modes; include a no-color variant (weight, icon, underline). If the current item lives in a hamburger, a closed menu equals no highlight; test the closed state on mobile separately.

Where it stops holding

A single page with no nav items to highlight is outside this minimum; location moves to the title. When the current page belongs to no nav item (search results, a 404, a subflow in a modal), forcing a highlight on the least-bad neighbor lies. Leave the nav unselected and say where this is in the title. A highlight cannot express “somewhere under this item”; that is the path’s job. Print styles and reading modes that strip nav are expected to lose the highlight.

Applying it

  • Give every nav item that can be current a selected state separable from default, hover, and focus—not a color shift alone.
  • When the page matches no item, leave all unselected; do not light up a neighbor.
  • For a current item inside a hamburger or overflow, keep a minimum mark in the visible chrome after close (top-bar title, selected tab).
  • Verify by screenshotting the nav, masking the page title and body, and asking “where are you now?” A wrong point or “can’t tell” means the highlight is still below the minimum. Repeat in grayscale or forced high contrast.

Related

  • Within the group: G2.05.1 People need to know their place in the structure at every moment · G2.05.3 Deep pages need a path, not only the current item
  • Adjacent: E5.02 Bottom tab bars · E5.11 Tabs · E5.03 Sidebar navigation
  • Search terms: current item highlight · selected nav state · you-are-here

Cards in the same group

Quick Actions

Share

Share this page

ios_share

https://hci.top/en/handbook/G2.05.2