Skip to content
UX Atlas
Plate PAT·002 · PatternGrid E2 · Rev. 2026-09-14

Search

The escape hatch from navigation, and often the primary path for users who know what they want.

PatternCraft conventionIntermediate

Definition

Search lets users express intent directly rather than traversing a structure. A complete search experience covers the input, suggestions, results, refinement, empty results and the zero-state before any query.

Craft convention. True because the industry converged on it. Breaking it costs familiarity, not correctness.

On this plate
  1. 1Definition
  2. 2The parts teams forget
  3. 3The parts of a search experience
  4. 4Working through a month of queries
  5. 5Six parts, and the four usually missing
  6. 6In practice
  7. 7Commonly confused with
  8. 8Local chart
  9. 9Continue from here

Reach for this when

  • Any product with more content than fits in navigation.
  • Users know what they want but not where it lives.
  • Reviewing findability.

Common mistakes

  • Exact-match-only matching.
  • No zero state.
  • Filters that reset the query.
  • Unhelpful empty results.
  • Treating the search log as an engineering metric rather than as a record of what people expected to find.

The parts teams forget

  • Zero state: what appears before typing. Recent searches, popular queries and categories all beat an empty box.
  • Suggestions: fast, keyboard navigable, and distinguishing query completions from direct results.
  • Query persistence: the query stays visible and editable in the results view.
  • Result context: why this result matched, usually with the matching text highlighted.
  • Refinement: filters and sorting that do not lose the query.
  • No results: acknowledge the query, suggest corrections, offer a way forward. Never just say nothing found.
  • Synonyms and misspellings: a search that only matches exact strings will fail most real queries.

Do

  • Search across titles, descriptions, tags, aliases and body content.
  • Support fuzzy matching so near-misses and typos still return results.
  • Show result type and category so people can judge relevance at a glance.
  • Announce result counts to assistive technology when results update in place.

Do not

  • Clear the query on the results page.
  • Require exact matches.
  • Show a bare 'no results' with no next step.
  • Hide search behind an icon on a content-heavy site.

The parts of a search experience

Most teams build the input and the results and leave the rest to chance, which is where search is actually judged.

PartUsually missingWhat good looks like
The empty inputOftenRecent searches, and suggestions worth clicking
Suggestions while typingSometimesKeyboard reachable, with the matched text marked
ResultsRarelyRanked, with why each matched visible
RefinementOftenFilters that reflect what is in the result set
Zero resultsAlmost alwaysA reason, a correction, and a route onwards
Error and timeoutAlmost alwaysA retry, and the query preserved

Working through a month of queries

The log is already collected. Turning it into decisions takes an afternoon and is the cheapest research in the product.

  1. 1

    Rank by volume, then by zero results

    Two lists. The first says what the product is for, the second says where it fails.

  2. 2

    Classify each zero-result query

    Vocabulary mismatch, spelling, missing content, or a feature request in disguise. The four need completely different fixes.

  3. 3

    Ship synonyms the same week

    Vocabulary mismatches are fixed by adding aliases, not by writing new content. This alone usually removes most zero-result traffic.

  4. 4

    Route the rest

    Missing content goes to the content backlog, feature requests to the product one, with the query counts attached as evidence.

  5. 5

    Re-measure next month

    Zero-result rate is a single number that tells you whether findability is improving. Track it like any other product metric.

Six parts, and the four usually missing

Empty inputrecent and popularSuggestionskeyboard reachableResultswhy each matchedRefinementfilters that keep the queryZero resultsa reason and a route onErrorretry, query preservedThe dashed four are where search is actually judged, and they are the ones most often left out.
Teams build the input and the results because those are the parts that demo well. Readers meet the other four on the days search fails them.

In practice

  1. i.

    Zero-state suggestions

    Site search

    Showing recent and popular queries when the field is focused turns an empty box into a starting point, and it teaches the vocabulary the search understands.

  2. ii.

    The typo that ended the session

    Zero results

    A misspelled product name returned nothing, with no suggestion and no correction. The reader had the intent, the money and the wrong spelling, and search is the only part of the product that could have rescued it.

Commonly confused with

Close neighbours that get substituted for each other. The difference is stated first, then the condition that picks one over the other.

vs.

Command Palette

Pattern

A keyboard-invoked list of actions and destinations, executed on selection.

Key difference

Search finds content. A command palette finds actions and places, and runs them. They look alike because both are a text box over a list, and they answer different questions.

Use Search when

  • The reader is looking for an item, a document or a record.
  • The result is something to look at rather than to run.
  • It should work for someone who has never used the product.

Use Command Palette when

  • The reader wants to do something, not find something.
  • The action is buried in a menu that is slow to reach.
  • There is a keyboard-driven audience to teach shortcuts to.

Learn about Command Palette

vs.

Filtering

Pattern

Constraints on known attributes that narrow a set already on screen.

Key difference

Search starts from nothing and asks the reader to express intent in words. Filtering starts from everything and removes what does not match a stated attribute. One finds a needle, the other shrinks a haystack.

Use Search when

  • The reader knows what they want and can name it.
  • The set is too large or too varied to browse.
  • The vocabulary is the reader's, not a fixed set of attributes.

Use Filtering when

  • The reader is browsing and does not have a name in mind.
  • The attributes are known, finite and worth exposing.
  • The result should still be a set, not a single answer.

Learn about Filtering

Local chart

PAT·002 · Region III · Grid E2

This entry and the entries it is stated to connect with. Each line is labelled with what the connection means.

Recognition Over RecallHEUR·006 · PRINCIPLES BEHIND THISStatus Messages and Live RegionsA11Y·009 · DEPENDS ONEmpty StatesPAT·010 · DEPENDS ONAccordionCMP·017 · OFTEN USED WITHPaginationCMP·021 · OFTEN USED WITHAutocomplete and TypeaheadPAT·003 · OFTEN USED WITHInfinite Scroll and PaginationPAT·021 · OFTEN USED WITHNavigationPAT·001 · OFTEN USED WITHSettings and PreferencesPAT·025 · OFTEN USED WITHSortingPAT·005 · OFTEN USED WITHCommand PalettePAT·018 · COMMONLY CONFUSED WITHFilteringPAT·004 · COMMONLY CONFUSED WITH

Continue from here

Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.

Applies when you are designing

A Search ExperienceAn Ecommerce ExperienceNavigationSettings

Principles behind this

The reasoning this solution is an application of.

Depends on

Get these right first, or this one will not hold.

Often used with

These usually appear in the same screen or the same decision.

Practical example

A worked decision where this was the deciding factor.

Short definition

The one-paragraph version, for when that is all you need.

Related concept

Connected closely enough to change how you apply this.