When to use breadcrumbs vs back buttons

At some point, users will need to navigate backward through your site. Two common patterns handle this: breadcrumbs and back buttons. Both patterns help users retrace their steps, but they work fundamentally differently, and choosing the wrong one can create confusion, especially for screen reader users who can’t see the visual hierarchy at a glance.

How they’re different

Back buttons follow browser history. They take you to whatever page you were just on, regardless of site hierarchy. If you landed on a product page from Google, the back button takes you to Google, not to the product category page.

Breadcrumbs show hierarchical location within the site structure (e.g., Home > Products > Shoes > Running Shoes). They always reflect where the page sits in the site’s information architecture, not how you got there.

When breadcrumbs work better

Breadcrumbs work best on deep hierarchical sites where users need to understand their location within the structure. This would include e-commerce sites, documentation sites, and government sites with departmental hierarchies. Breadcrumbs let you jump up levels: from running shoes to all shoes to all products. The back button can’t do that.

When back buttons work better

Back buttons are best for linear processes where users move through a defined sequence. This would include multi-step forms, checkout flows, wizards, and onboarding. Here, you want users to go back to the previous step, not jump around the hierarchy.

Back buttons also work well on single-level sites where there is no hierarchy to show. This includes landing pages, simple marketing sites, and portfolios.

Don’t fake back buttons

Use caution when creating a custom “back” button that mimics the browser’s back button. The browser already has one. If you need backward navigation within your site hierarchy, use breadcrumbs. Custom back buttons can confuse users who expect them to work like the browser’s back button.

—

Breadcrumbs show hierarchical location and let users navigate up the structure. Back buttons follow the browser history. Use breadcrumbs for hierarchy, trust the browser’s back button for history, and don’t confuse the two.