# Breadcrumb schema is implemented on interior pages

- **Pattern:** `ab-001674` (`marketing-advanced-seo.structured-data.breadcrumb-schema`)
- **Severity:** low
- **Lifecycle:** active
- **Last modified:** 2026-04-18
- **Canonical URL:** https://auditbuffet.com/patterns/ab-001674
- **License:** CC-BY-4.0 — attribute to AuditBuffet Pattern Catalog (https://auditbuffet.com/patterns/ab-001674)

## Why it matters

When Google displays breadcrumbs in search results — the path hierarchy shown beneath the page title — it pulls from `BreadcrumbList` schema-org markup, not from the visible UI component on your page. Interior pages without `BreadcrumbList` JSON-LD miss the SERP breadcrumb display even if a visible breadcrumb component exists. For sites with nested URL structures (`/docs/getting-started`, `/blog/category/post`), breadcrumb trails in search results improve click-through rates by communicating page context before the user clicks. A visible breadcrumb UI without corresponding schema is a common implementation gap that leaves this benefit unclaimed.

## Severity rationale

Low because missing breadcrumb schema costs click-through rate on interior pages but does not affect crawlability, indexation, or core ranking signals directly.

## Remediation

Create a reusable `BreadcrumbSchema` server component and render it from interior page layouts. Each `itemListElement` entry needs `position` (1-based), `name`, and `item` (absolute URL — omit `item` only on the current page).

```tsx
// components/breadcrumb-schema.tsx
type Crumb = { name: string; href?: string }

export function BreadcrumbSchema({ crumbs }: { crumbs: Crumb[] }) {
  const schema = {
    '@context': 'https://schema.org',
    '@type': 'BreadcrumbList',
    itemListElement: crumbs.map((crumb, i) => ({
      '@type': 'ListItem',
      position: i + 1,
      name: crumb.name,
      ...(crumb.href ? { item: `https://yoursite.com${crumb.href}` } : {}),
    })),
  }
  return (
    <script
      type="application/ld+json"
      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}
    />
  )
}
```

Add `<BreadcrumbSchema>` to your blog post, docs, and product detail layouts — not the root layout, since the homepage has no breadcrumb hierarchy.

## Detection

- **ID:** `breadcrumb-schema`
- **Severity:** `low`
- **What to look for:** Count all interior pages with hierarchical URLs. Enumerate which have BreadcrumbList schema vs. which lack it. Look for `BreadcrumbList` schema in JSON-LD blocks on interior pages (pages with a URL depth of 2 or more, e.g., `/blog/my-post`, `/docs/getting-started`, `/products/widget`). Also check for a visible breadcrumb UI component — if one exists visually, check whether it has corresponding JSON-LD schema markup.
- **Pass criteria:** Pages at URL depth 2+ have `BreadcrumbList` JSON-LD with at least 2 `ListItem` entries that match the URL path hierarchy. At least 80% of hierarchical pages should have BreadcrumbList schema.
- **Fail criteria:** Interior pages at depth 2+ exist but have no `BreadcrumbList` schema. A visible breadcrumb UI exists but has no corresponding JSON-LD.
- **Skip (N/A) when:** The project has no pages at URL depth 2 or greater (all routes are top-level: `/about`, `/pricing`, etc., with no nested paths).

- **Cross-reference:** For URL structure best practices, see the `url-structure` check.
- **Detail on fail:** `"Interior pages at depth 2+ exist (e.g., /blog/[slug]) but no BreadcrumbList JSON-LD found. A visible breadcrumb component was detected without corresponding schema markup."`
- **Remediation:** Breadcrumb schema can trigger breadcrumb trails in search results, showing the page's path hierarchy directly in the SERP. Add a `BreadcrumbList` JSON-LD block alongside your other page schema. The `itemListElement` array should contain one `ListItem` per level of the breadcrumb path, each with `position` (1-based integer), `name` (display label), and `item` (absolute URL for all items except the current page).

  ```tsx
  // components/breadcrumb-schema.tsx — add to interior page layouts
  const breadcrumbSchema = { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [...] }
  ```

## External references

- schema-org BreadcrumbList

Taxons: findability

HTML version: https://auditbuffet.com/patterns/ab-001674