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

Sorting

Reordering a set, where the default order is the decision that matters most.

PatternCraft conventionFoundational

Definition

Sorting arranges results by an attribute. Because most users never change it, the default sort is one of the highest-impact defaults in any product.

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

On this plate
  1. 1Definition
  2. 2Getting it right
  3. 3Defaults, and what each one says
  4. 4Order people can trust
  5. 5In practice
  6. 6Commonly confused with
  7. 7Local chart
  8. 8Continue from here

Reach for this when

  • Presenting any ordered list or table.
  • Choosing what users see first.
  • A list is long enough that the order decides what most people ever see.

Common mistakes

  • Default sort chosen by implementation convenience.
  • Ambiguous direction indicators.
  • Unstable ordering.

Getting it right

  • Choose the default that answers the most common question, not the one that is cheapest to compute.
  • Show the current sort explicitly, including direction.
  • Make the direction indicator unambiguous. Arrow conventions vary, so pair the icon with text where space allows.
  • Handle ties deterministically with a secondary key, or the order will shuffle between page loads.
  • In tables, make column headers sortable and announce the sort state with aria-sort.
  • Preserve sort state across pagination and navigation.

Defaults, and what each one says

The default sort is chosen once and experienced by almost everyone, which makes it one of the highest-leverage decisions on a list screen.

DefaultSuitsRisk
RelevanceSearch resultsOpaque, and easy to tune towards commercial interests
Newest firstFeeds, activity, support queuesBuries anything still unresolved but old
AlphabeticalReference lists people scan by nameMeaningless for anything ranked
Price ascendingCataloguesReads as a recommendation of the cheapest
Manual orderCurated setsSomeone has to maintain it, and they will stop

Order people can trust

Do

  • Pick the default that answers the question the screen exists to answer.
  • Pair the direction arrow with words, since arrow conventions genuinely differ between products.
  • Add a stable secondary key so tied rows hold their position between loads.
  • Keep the sort in the URL, so a shared link shows what the sender was looking at.

Do not

  • Sort by an internal field, such as insertion order, and present it as relevance.
  • Reset to the default sort after the reader opens an item and comes back.
  • Offer a sort the data cannot support, such as popularity with no usage data behind it.
  • Sort nulls silently to the top. Decide where missing values go and say so.

In practice

  1. i.

    Unstable sort ordering

    Data tables

    Sorting by a column with many equal values without a tiebreaker makes rows jump between page loads. Users read this as a bug and lose confidence in the data.

  2. ii.

    The tie that moved

    Stable sorting

    Sorting by a column with many equal values reshuffled the tied rows on every page load, so the item a reader was tracking moved between refreshes. A stable secondary key, such as id, removes 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.

Filtering

Pattern

Removing items that fail a stated attribute constraint.

Key difference

Filtering changes which items are in the set. Sorting changes only their order, and nothing ever leaves. Readers reach for sort when they mean filter, and then wonder why the list is still so long.

Use Sorting when

  • Every item is still a candidate.
  • The question is which is best, newest or cheapest.
  • The reader wants a ranking rather than a shorter list.

Use Filtering when

  • There are too many results to work through.
  • Whole categories are irrelevant to this reader.
  • The count afterwards is information worth showing.

Learn about Filtering

Local chart

PAT·005 · Region III · Grid E2

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

Default EffectBIAS·004 · PRINCIPLES BEHIND THISNatural MappingPRIN·008 · PRINCIPLES BEHIND THISChoice OverloadPSY·002 · PRINCIPLES BEHIND THISData TableCMP·025 · OFTEN USED WITHPaginationCMP·021 · OFTEN USED WITHSearchPAT·002 · OFTEN USED 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 DashboardA Data TableA Search ExperienceAn Ecommerce ExperienceAn Enterprise Workflow

Principles behind this

The reasoning this solution is an application of.

Often used with

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