알레오 위키wiki
/Breadcrumb
📘Concept

Breadcrumb

최종 업데이트:

Definition

Breadcrumb takes its name from the fairy tale Hansel and Gretel, where breadcrumbs were left to find the way home. It is a web navigation pattern that visually shows where the current page sits within the site hierarchy.

From an SEO perspective, breadcrumbs explicitly communicate site structure to Google and, through BreadcrumbList schema, replace URL display in search results with text paths to improve CTR.

Summary

Breadcrumb implementation checklist: ①Add text breadcrumb UI to the page → ②Add BreadcrumbList JSON-LD schema → ③Verify rich results in GSC. On WordPress, Yoast/Rank Math handles this automatically.

SEO Role of Breadcrumbs

Site Structure Signal Transmission

Breadcrumbs clearly tell Googlebot which hierarchy level the current page occupies. Together with internal links, they help Google understand site architecture. See Site Architecture for details.

SERP URL Display Improvement

Applying BreadcrumbList schema displays text paths instead of URLs in Google search results.

Before: https://example.com/blog/seo/keyword-research/long-tail
After: Home › SEO › Keyword Research

Users immediately understand page context, improving click-through rate (CTR).

Internal Link Strengthening

Each breadcrumb item is an internal link to a parent page. This passes link authority to category pages and home.

3 Types of Breadcrumbs

1. Hierarchy-Based

The most common type. Reflects site hierarchy structure.

Home > SEO > Keyword Research > Long-Tail Keywords

Suitable for content blogs, e-commerce, and news sites.

2. Attribute-Based

E-commerce approach displaying filters and attributes as breadcrumbs.

Home > Men > Tops > Short-Sleeve T-Shirts

Users can reach the same product through multiple paths, requiring canonical handling.

3. History-Based

Displays the path the user visited, similar to browser history. Low SEO value; used for UX purposes only.

BreadcrumbList JSON-LD Implementation

Basic Structure

{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Home",
      "item": "https://example.com/"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "SEO",
      "item": "https://example.com/seo/"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "Keyword Research",
      "item": "https://example.com/seo/keyword-research/"
    },
    {
      "@type": "ListItem",
      "position": 4,
      "name": "Long-Tail Keywords",
      "item": "https://example.com/seo/keyword-research/long-tail-keywords/"
    }
  ]
}

See JSON-LD Basics for details.

Implementation Rules

  • position increments sequentially starting from 1
  • The item of the last item (current page) is optional but recommended
  • name is the label displayed to users; keep it concise
  • Each item URL must be the canonical URL

Breadcrumb HTML Markup

Visual breadcrumb UI in HTML is needed in addition to schema. Google processes JSON-LD alone without HTML breadcrumbs, but having both is recommended.

<nav aria-label="breadcrumb">
  <ol class="breadcrumb">
    <li><a href="/">Home</a></li>
    <li><a href="/seo/">SEO</a></li>
    <li><a href="/seo/keyword-research/">Keyword Research</a></li>
    <li aria-current="page">Long-Tail Keywords</li>
  </ol>
</nav>

Accessibility points: aria-label="breadcrumb" and aria-current="page" clearly communicate to screen reader users.

Breadcrumb Implementation by CMS

WordPress

  • Yoast SEO: Enable in Settings > Search Appearance > Breadcrumbs. JSON-LD auto-generated
  • Rank Math: BreadcrumbList auto-supported in Modules > Structured Data
  • Manual: The SEO Framework, or direct implementation in functions.php

Next.js / React

const Breadcrumb = ({ items }) => (
  <>
    <nav aria-label="breadcrumb">
      <ol>
        {items.map((item, index) => (
          <li key={index}>
            {index < items.length - 1 ? (
              <a href={item.url}>{item.name}</a>
            ) : (
              <span aria-current="page">{item.name}</span>
            )}
          </li>
        ))}
      </ol>
    </nav>
    <script type="application/ld+json">
      {JSON.stringify({
        '@context': 'https://schema.org',
        '@type': 'BreadcrumbList',
        itemListElement: items.map((item, index) => ({
          '@type': 'ListItem',
          position: index + 1,
          name: item.name,
          item: item.url,
        })),
      })}
    </script>
  </>
)

Breadcrumb Validation

Google Rich Results Test

After implementation, enter the URL in Google Rich Results Test to verify BreadcrumbList is recognized correctly.

GSC Rich Results Report

In GSC → Appearance > Rich results, check breadcrumb validity errors. Common errors:

  • Missing name field
  • position not incrementing sequentially
  • Invalid or redirecting item URL

Application in the Korean Market

Korean Breadcrumb Display

Korean sites may use Korean labels in breadcrumb name fields. Google displays Korean text as-is in the SERP.

{
  "name": "SEO Guide"
}

Breadcrumbs and Naver

Naver supports BreadcrumbList structured data in its own search results. Structured data validation is available in Naver Webmaster Tools (Naver Search Advisor).

Breadcrumbs in Korean E-commerce

Korean commerce platforms like Cafe24 and Godomall provide breadcrumb HTML by default, but JSON-LD schema often requires manual addition. Insert schema by modifying platform template files.

Frequently Asked Questions

Q. Do breadcrumbs improve rankings?
A. They are not a direct ranking signal. The main SEO effects of breadcrumbs are indirect through structure signal transmission and CTR improvement. When text paths display in the SERP, users understand page context and are more likely to click.

Q. Are breadcrumbs needed on single pages (home)?
A. Homepages do not need breadcrumbs. Apply breadcrumbs to pages with hierarchy of two or more levels (category pages, detail pages).

Q. What if a page has multiple breadcrumb paths?
A. In e-commerce where products belong to multiple categories, define multiple BreadcrumbLists or choose the most appropriate one. Google selects one BreadcrumbList to display or decides based on canonical URL.

Q. Do breadcrumb link texts (anchor text) affect SEO?
A. Yes. Breadcrumb link text becomes anchor text signals to parent category pages. Using clear labels with keywords in category names contributes to parent page relevance signals. See Anchor Text for details.

Q. Do breadcrumbs display in SERP on mobile too?
A. Yes. Google mobile search results also display breadcrumb text paths instead of URLs. Apply the same BreadcrumbList schema on mobile pages in a mobile-first indexing environment.

Sources

이 페이지를 참조하는 항목

관련 항목

📘Concept
Click-Through Rate (CTR)
CTR (Click-Through Rate) is the ratio of actual clicks to search result impressions (clicks ÷ impressions × 100) — a core metric showing SEO content appeal and an indirect ranking signal.
📙How-to
Indexing Coverage Diagnosis
Indexing coverage diagnosis uses the GSC indexing report to check overall site indexing status, identify causes of unindexed pages, and fix them — a core SEO task.
📘ConceptPillar
GEO Master Guide: 5-Area Checklist
An execution guide for Generative AI Optimization covering GEO's five areas: content, structure, technical, off-site, and measurement.
📘ConceptPillar
What Is AEO?
AEO is the practice of optimizing content so AI answer engines cite it.
📙How-to
H Tag Hierarchy Design
H tag hierarchy design is the practice of arranging H1–H6 headers in semantic order to clarify page structure and improve LLM chunk extraction and accessibility.
📘ConceptPillar
Internal Linking Strategy
Internal linking strategy is the practice of semantically connecting pages within your own site to optimize topic authority and bot and user navigation.
📘ConceptPillar
URL Slug
A URL slug is the string forming the path after the domain in a web page address. SEO best practices include keyword inclusion, hyphen use, lowercase, and short, clear structure.
📘Concept
Google AI Overviews
Google AI Overviews is a feature that adds AI answer blocks to search SERPs.
📙How-to
FAQPage Schema
FAQPage schema is markup that structures Q&A content to increase AI citation potential.
📘ConceptPillar
JSON-LD Basics
JSON-LD is the Schema.org structured data insertion method recommended by Google.
📘ConceptPillar
Rich Snippet
A Rich Snippet is a SERP format that displays additional visual information such as ratings, FAQ, price, and images in search results based on structured data (Schema.org), serving as a core SEO signal that improves CTR and AI answer citation potential.
📘ConceptPillar
Site Architecture
Site architecture is the overall design of page hierarchy, URL structure, and internal linking on a website. It simultaneously determines crawl efficiency, indexing quality, and user navigation experience — a foundational SEO element.

이런 항목도 있어요

📙How-to
FAQPage Schema
FAQPage schema is markup that structures Q&A content to increase AI citation potential.
📘ConceptPillar
JSON-LD Basics
JSON-LD is the Schema.org structured data insertion method recommended by Google.
📘ConceptPillar
Rich Snippet
A Rich Snippet is a SERP format that displays additional visual information such as ratings, FAQ, price, and images in search results based on structured data (Schema.org), serving as a core SEO signal that improves CTR and AI answer citation potential.
📘ConceptPillar
Internal Linking Strategy
Internal linking strategy is the practice of semantically connecting pages within your own site to optimize topic authority and bot and user navigation.
이 페이지가 도움이 됐나요?