Behavior comparison

Breadcrumbs vs Stepper

Decisive difference

Breadcrumbs show where the page sits in an existing hierarchy; Stepper shows where the user stands in an ordered process.

BreadcrumbsChoose Breadcrumbs if pages have ancestors and the user may go up a level.
StepperChoose Stepper if a linear process has completed, current, and upcoming stages.

See the nine dimensions See the sources

Decision

Family question

Should this locate the page in a hierarchy, move across result pages, or show a process stage?

Nine dimensions

Dimension	BreadcrumbsBreadcrumbs	StepperStepper
Trigger	Following a named ancestor link moves upward in the current hierarchy.	The surrounding workflow advances or returns between meaningful process stages.
Modality	Non-modal navigation; the current page remains fully available.	Non-modal progress context for a multi-step task; it does not block the current step.
Placement	A compact trail before the main heading, ordered from root to current page.	Near the workflow heading, ordered from the first stage to the final stage.
Interactivity	Ancestor items are links; the current page is identified and is usually plain text.	Primarily communicates completed, current, and upcoming stages; a stage is interactive only when navigation is truly allowed.
Focus	Visible focus remains on each ancestor link until navigation; a plain-text current page is not an extra tab stop.	After an in-place stage change, focus the new step heading or use one documented equivalent; never focus a decorative segment.
Dismissal	Breadcrumbs are persistent navigation and are not dismissible.	The indicator is persistent workflow context and is not dismissible.
Accessible role	nav[aria-label] > ol > li > a[aria-current=page]	ol > li[aria-current=true] + heading
Use case	Pages belong to a hierarchy several levels deep	A stable linear process has at least three meaningful sections
Mobile behavior	Preserve the current location and nearest ancestor without making essential hierarchy depend on horizontal scrolling.	Keep a concise “step X of Y” heading and hide secondary labels before compressing the status beyond recognition.

Breadcrumbs vs Stepper

Decisive difference

Breadcrumbs show where the page sits in an existing hierarchy; Stepper shows where the user stands in an ordered process.

BreadcrumbsChoose Breadcrumbs if pages have ancestors and the user may go up a level.
StepperChoose Stepper if a linear process has completed, current, and upcoming stages.

See the nine dimensions See the sources

Nine dimensions

Dimension	BreadcrumbsBreadcrumbs	StepperStepper
Trigger	Following a named ancestor link moves upward in the current hierarchy.	The surrounding workflow advances or returns between meaningful process stages.
Modality	Non-modal navigation; the current page remains fully available.	Non-modal progress context for a multi-step task; it does not block the current step.
Placement	A compact trail before the main heading, ordered from root to current page.	Near the workflow heading, ordered from the first stage to the final stage.
Interactivity	Ancestor items are links; the current page is identified and is usually plain text.	Primarily communicates completed, current, and upcoming stages; a stage is interactive only when navigation is truly allowed.
Focus	Visible focus remains on each ancestor link until navigation; a plain-text current page is not an extra tab stop.	After an in-place stage change, focus the new step heading or use one documented equivalent; never focus a decorative segment.
Dismissal	Breadcrumbs are persistent navigation and are not dismissible.	The indicator is persistent workflow context and is not dismissible.
Accessible role	nav[aria-label] > ol > li > a[aria-current=page]	ol > li[aria-current=true] + heading
Use case	Pages belong to a hierarchy several levels deep	A stable linear process has at least three meaningful sections
Mobile behavior	Preserve the current location and nearest ancestor without making essential hierarchy depend on horizontal scrolling.	Keep a concise “step X of Y” heading and hide secondary labels before compressing the status beyond recognition.