auditmysitev2.0.2

Missing location indication (AAA)

navigation/location-missing

WCAG success criterion
2.4.8 (level AAA)
Outcome class
Hint only. An automated check that by design reports review hints only: its findings are marked for manual review, never as confirmed violations.
Area
Accessibility, Navigation & Operation
Default severity
low
axe-core rule
location

Why we flag this

Users lose orientation within nested websites.

Missing breadcrumb navigation or sitemap linkage.

What the rule checks

Scope. Pages with a navigation (nav or role=navigation) that contains links.

Expectation. needs_review once per page (page-level, at the root) when the page has a navigation with links but neither marks the current page (aria-current="page") nor offers a breadcrumb trail (aria-label containing "breadcrumb"). Review, not violation: 2.4.8 can also be met by the title, headings or a site map. A breadcrumb or aria-current="page" passes. Pages without a navigation are not applicable.

Source. WCAG 2.2 SC 2.4.8 Location (AAA); techniques G65 (breadcrumb trail), G128 (indicating current location within navigation)

Detection: shared; needs dom.

Failing example

The check flags this for review. Corpus case interaction_location_missing. The page may contain further findings for other rules.

interaction_location_missing.htmlHTML
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Opening hours without a location cue</title>
    <style>
        body { font-family: sans-serif; margin: 0; padding: 16px; color: #111; background: #fff; }
        a, button { display: inline-block; min-width: 44px; min-height: 44px; padding: 12px; box-sizing: border-box; margin: 4px; }
        .skip { position: absolute; left: -9999px; }
        .skip:focus { left: 16px; }
    </style>
</head>
<body>
    <a class="skip" href="#main">Skip to main content</a>
    <header><p>Example Museum</p></header>
    <!-- needs_review (2.4.8): site navigation, but no breadcrumb and no aria-current="page" -->
    <nav aria-label="Main">
        <a href="/">Home</a>
        <a href="/visit">Visit</a>
        <a href="/exhibitions">Exhibitions</a>
    </nav>
    <main id="main">
        <h1>Opening hours</h1>
        <p>Open Tuesday to Sunday, ten to six.</p>
    </main>
    <footer><p>Example Museum footer</p></footer>
</body>
</html>

Passing example

The check reports nothing here. Corpus case interaction_location_breadcrumb. The page may contain further findings for other rules.

interaction_location_breadcrumb.htmlHTML
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Exhibition page with a breadcrumb</title>
    <style>
        body { font-family: sans-serif; margin: 0; padding: 16px; color: #111; background: #fff; }
        a, button { display: inline-block; min-width: 44px; min-height: 44px; padding: 12px; box-sizing: border-box; margin: 4px; }
        .skip { position: absolute; left: -9999px; }
        .skip:focus { left: 16px; }
    </style>
</head>
<body>
    <header><p>Example Museum</p></header>
    <nav aria-label="Main">
        <a href="/">Home</a>
        <a href="/visit">Visit</a>
        <a href="/exhibitions">Exhibitions</a>
    </nav>
    <!-- absent (2.4.8): the breadcrumb trail shows where the page sits -->
    <nav aria-label="Breadcrumb">
        <a href="/">Home</a> /
        <a href="/exhibitions">Exhibitions</a> /
        <span>Dutch masters</span>
    </nav>
    <main id="main">
        <h1>Dutch masters</h1>
        <p>Forty paintings from the seventeenth century.</p>
    </main>
    <footer><p>Example Museum footer</p></footer>
    <script>
        // absent (2.4.1): the skip link is inserted by a script, before the first link
        var skip = document.createElement('a');
        skip.className = 'skip';
        skip.href = '#main';
        skip.textContent = 'Skip to main content';
        document.body.insertBefore(skip, document.body.firstChild);
    </script>
</body>
</html>

This page is generated from the rule catalogue and the rule contracts; see therule overview for how the outcome classes are derived.