Key pages within 3 clicks

Link key pages within 3 clicks of Home, with descriptive anchors.

From seo-audit: Site Architecture, Internal Linking and Keyword Targeting.

Arrow keys move the page. Enter traces its shortest path from Home.

Same pages, two structures

Click a page to trace its path; drag to untangle.

Pagination chainBad

Hub pagesGood

<nav aria-label="Main">
  <a href="/product">Product</a>
  <a href="/pricing">Pricing</a>
  <a href="/guides">Guides</a>
  <a href="/blog">Blog</a>
</nav>

<!-- /guides -->
<a href="/guides/invoice-approval">Invoice approval workflow guide</a>
<a href="/webinars/ap-close">AP close webinar replay</a>

Add a link, watch depth change

Link Home → Guides, then try the footer toggle.

Link editor

function clickDepth(links, home = "/") {
  const depth = new Map([[home, 0]]);
  const queue = [home];
  while (queue.length) {
    const page = queue.shift();
    for (const next of links.get(page) ?? []) {
      if (depth.has(next)) continue;
      depth.set(next, depth.get(page) + 1);
      queue.push(next);
    }
  }
  return depth;
}

What the anchor tells crawlers

Switch styles, type an anchor, then strip the context.

Vague anchorsBad

Out of context

    Descriptive anchorsGood

    Out of context

      <p>Set up routing with the
  <a href="/guides/invoice-approval">invoice approval workflow guide</a>.
  Limits per role are in
  <a href="/guides/approval-limits">approval limits by role</a>.</p>

      Why it matters, pros and cons

      Why it matters

      Crawlers follow links, so deep pages are found late and look minor.

      Pros

      • Key pages get crawled sooner.
      • Users reach them in fewer clicks.
      • Descriptive anchors are accessible link names.

      Cons

      • 3 is an audit heuristic, not a published threshold.
      • Footer links to everything flatten depth but add noise.
      • Large archives can't all sit at depth 3.