WCAG 2.4.8: Location
Half of your visitors never see your home page — they arrive from a search engine, deep inside the site, with no idea how this page relates to anything else. 2.4.8 requires that information about the user’s location within a set of pages is available: a breadcrumb trail, a navigation menu that marks the current section, a step indicator — some reliable answer to the question “where am I?”
The success criterion, in full
Information about the user’s location within a set of Web pages is available.
“Available” is deliberately open: no specific widget is mandated. Breadcrumbs, current-page markers in navigation, section- bearing page titles, site maps, and step indicators are all valid routes — what matters is that a user on any page can determine where that page sits within the whole.
Who this helps
People with memory or attention disabilities
Losing the thread of 'how did I get here?' mid-task is routine; location cues let them re-orient instantly instead of starting over.
Screen reader users
Without a visual gestalt of the layout, a labelled breadcrumb landmark or an announced 'current page' item is the fastest answer to 'where am I?'
People with cognitive disabilities
Consistent orientation cues — the same breadcrumb, the same highlighted nav — make a large site learnable rather than a maze.
Search and link arrivals
Anyone landing on a deep page from Google, a chat message, or a bookmark gets context and one-click paths to broader levels.
As a bonus, the same structures feed search engines: breadcrumb markup is displayed directly in search results, improving click-through — one of the clearest cases where accessibility work and SEO are the same work.
Techniques that satisfy 2.4.8
- Breadcrumb trail (G65) — Shows the hierarchical path — Home / Support / Warranty — with each ancestor as a link. Position plus escape routes in one compact strip.
- Current page indicated in navigation (G128) — The persistent menu marks the active section and page, visually and with aria-current, so orientation travels with the navigation itself.
- Page titles that carry the hierarchy (G127 + 2.4.2) — A title like 'Warranty — Support — Acme' locates the page in the tab bar, bookmarks, history, and the first thing a screen reader announces.
- Site map (G63) — A dedicated page showing the full structure gives users a reference map; linking to it from every page provides on-demand orientation.
- Step indicators for linear processes — 'Step 2 of 4: Shipping' locates the user within a defined sequence — the location principle applied to flows instead of hierarchies.
Code examples
An accessible breadcrumb trail
A labelled nav landmark, an ordered list for the hierarchy, aria-current="page" on the final crumb, and decorative separators kept out of the accessibility tree.
<nav aria-label="Breadcrumb">
<ol class="breadcrumb">
<li><a href="/">Home</a></li>
<li><a href="/support">Support</a></li>
<li><a href="/support/returns">Returns & refunds</a></li>
<li aria-current="page">Warranty claims</li>
</ol>
</nav>
<style>
.breadcrumb { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; }
/* Separator is pure decoration — CSS content is not exposed as text
to most screen readers, and never part of the link names */
.breadcrumb li + li::before { content: "/"; margin-inline-end: .5rem; }
.breadcrumb [aria-current="page"] { font-weight: 600; }
</style>Marking the current page in site navigation
aria-current="page" is announced by screen readers (“current page”); pair it with a visual treatment that does not rely on color alone.
<nav aria-label="Main">
<ul>
<li><a href="/products">Products</a></li>
<li><a href="/docs" aria-current="page">Documentation</a></li>
<li><a href="/pricing">Pricing</a></li>
</ul>
</nav>
<style>
/* Visible marker beyond color: underline + weight */
nav [aria-current="page"] {
font-weight: 700;
text-decoration: underline;
text-underline-offset: 4px;
}
</style>
<!-- SPA note: keep it in sync with the route -->
<script>
function markCurrent(pathname) {
document.querySelectorAll("nav [aria-current]")
.forEach((el) => el.removeAttribute("aria-current"));
document
.querySelector(`nav a[href="${pathname}"]`)
?.setAttribute("aria-current", "page");
// And update the title: "Documentation — Acme"
}
</script>Breadcrumb structured data (bonus for search)
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{ "@type": "ListItem", "position": 1, "name": "Home",
"item": "https://example.com/" },
{ "@type": "ListItem", "position": 2, "name": "Support",
"item": "https://example.com/support" },
{ "@type": "ListItem", "position": 3, "name": "Warranty claims" }
]
}
</script>Pass and fail examples
✓ Passes 2.4.8
- A documentation site with a breadcrumb on every article plus a sidebar tree that highlights the current page.
- An e-commerce product page showing Home / Audio / Headphones / [Product], with each ancestor linked.
- A checkout with a visible, announced “Step 3 of 4: Payment” indicator.
- A small site whose persistent nav marks the current page with aria-current and a visible underline — sufficient on its own for a flat structure.
✗ Fails 2.4.8
- A deep knowledge-base article reachable from search with no breadcrumb, no highlighted nav, and a title that names only the article.
- A multi-level store where category pages give no indication of which department you are browsing.
- An SPA that swaps views without updating the title or the navigation’s current-page marker — every view claims to be nowhere.
- A breadcrumb rendered as plain text with separators baked into link names (“Home >”), unlabeled and unusable as a landmark.
Common failures
- No location information at all on deep pages — the site assumes everyone starts at the home page and remembers the route.
- Breadcrumbs that exist visually but are inaccessible: no nav landmark or label, separators read aloud as part of link text, or no aria-current on the final item.
- Current-page indication by color alone in navigation, invisible to users who cannot perceive the color difference (and to screen readers without aria-current).
- SPAs that update the view but not the document title or navigation state, so assistive technology has no location signal after the first route change.
- Breadcrumbs showing the user's click history instead of the site hierarchy — location means where the page lives, not how this visitor wandered to it.
- Inconsistent placement or structure of the location cue across sections, undermining the very orientation habit it should build (see 3.2.3 Consistent Navigation).
- Step indicators that are purely visual graphics with no text alternative announcing the current step and total.
How to test for 2.4.8
- 1
Deep-link into the site cold
Open several deep pages directly, as a search engine would deliver them. On each, answer three questions using only what the page shows: What section am I in? What is one level up? How do I get to the top?
- 2
Check every hierarchical level
Walk one full branch — home, section, subsection, detail page — and confirm the location cue (breadcrumb, nav highlight, title) is present and accurate at each level, not just on leaf pages.
- 3
Inspect the markup
Breadcrumb inside a labelled <nav>, hierarchy as a list, aria-current='page' on the current item, separators decorative. Navigation current-page markers must exist in the accessibility tree, not just in CSS.
- 4
Listen with a screen reader
From page load: does the title announce the section? Can you find a 'Breadcrumb' landmark? Does the current nav item announce 'current page'? Orientation must be perceivable non-visually.
- 5
Test dynamic navigation
In SPAs and filtered views, navigate between routes and confirm the title, breadcrumb, and aria-current update in step. Also verify checkout or wizard steps announce their position ('Step 2 of 4').
Related criteria to verify together: 2.4.2 Page Titled (titles carry the location into tabs and history) and 2.4.6 Headings and Labels (the h1 should confirm where the user landed). Then continue with the full WCAG 2.2 checklist.
Frequently asked questions
What does WCAG 2.4.8 Location require?
It requires that information about the user's location within a set of web pages is available. In other words, on any page of a multi-page site, users should be able to work out where they are relative to the whole — which section they are in, and how this page relates to the site's structure. Breadcrumb trails, highlighted navigation with aria-current, descriptive page titles that include the section, and site maps are the standard ways to provide it. It is a Level AAA criterion under Guideline 2.4 Navigable.
Is a breadcrumb trail required to pass 2.4.8?
No single technique is mandated — the requirement is that location information is available by some means. A breadcrumb trail is the most direct technique (W3C technique G65), but indicating the current page within a persistent navigation menu (G128), stating the parent section, providing a site map (G63), or even a clear 'you are here' text line can satisfy it. Breadcrumbs are popular because they simultaneously show position and provide one-click escape routes to each ancestor level.
How should a breadcrumb be marked up accessibly?
Use a nav element labelled 'Breadcrumb' containing an ordered list of links, with aria-current='page' on the final item representing the current page. The nav label lets screen reader users find it in the landmarks list; the ordered list conveys the hierarchy ('list, 3 items'); and aria-current tells them which item is the page they are on. Visual separators like slashes or chevrons should be decorative (CSS or aria-hidden) so they are not read aloud.
How does 2.4.8 relate to 2.4.2 Page Titled and 2.4.5 Multiple Ways?
They form the orientation cluster of Guideline 2.4. 2.4.2 (A) requires each page to have a title describing its topic or purpose — a title like 'Warranty — Support — Acme' already carries location information. 2.4.5 (AA) requires more than one way to find a page (search, site map, navigation). 2.4.8 (AAA) completes the picture: once you have arrived, the page must tell you where you are within the whole. A site with structured titles, consistent navigation that marks the current section, and breadcrumbs typically satisfies all three.
Who benefits from location information?
People with short-term memory or attention disabilities who lose track of how they got to a page; screen reader users who land deep in a site from a search result and need context without visually scanning the layout; people with cognitive disabilities who rely on consistent orientation cues to build a mental model of the site; and frankly everyone arriving from search engines — around half of sessions start on a deep page, not the home page. Location cues turn 'lost in the middle of a site' into 'oriented and one click from anywhere above me'.
Does 2.4.8 apply to single-page applications and checkout flows?
Yes, wherever there is a 'set of web pages' or an equivalent set of views. In an SPA, each routed view should still expose location: update the document title, keep the navigation's aria-current in sync with the route, and render breadcrumbs for hierarchical content. For linear processes like checkouts, a step indicator ('Step 2 of 4: Shipping address') is the location information — it tells users where they are within the set of steps, which is exactly the intent of the criterion.
Related Success Criteria
A mechanism is available to bypass blocks of content that are repeated.
Web pages have titles that describe topic or purpose.
Focusable components receive focus in an order that preserves meaning.
The purpose of each link can be determined from link text or context.
More than one way is available to locate a page within a set of pages.