브레드크럼 (Breadcrumb)

브레드크럼은 사이트 안에서 현재 페이지의 위치와 상위 페이지로 가는 경로를 보여 주는 탐색 요소입니다. 상세 페이지 상단에 〈홈 > 블로그 > SEO〉처럼 표시된 경로가 대표적입니다.

사용자는 이 경로를 보고 지금 읽는 페이지가 어느 분류에 속하는지 알 수 있습니다. 상위 항목의 링크를 누르면 관련 페이지가 모인 목록으로 이동합니다.

화면에 표시하는 경로

브레드크럼은 보통 페이지 제목 위나 아래에 가로로 배치합니다.

AVCD 용어사전이라면 〈홈 > SEO 용어사전 > 브레드크럼〉처럼 구성할 수 있습니다. 중간의 〈SEO 용어사전〉을 누르면 용어 목록을 엽니다. 마지막 항목은 현재 페이지를 나타내므로 링크를 생략하기도 합니다.

브레드크럼과 URL 구조의 차이

브레드크럼에는 페이지가 속한 분류를 표시합니다. 주소에 /blog/seo/가 포함돼 있어도 사이트에서 ‘SEO 용어사전’으로 묶어 제공하는 페이지라면 그 분류명을 쓸 수 있습니다.

Google도 URL의 폴더 구조를 그대로 옮기기보다 사용자가 해당 페이지를 찾아가는 일반적인 경로를 표시하도록 권장합니다. 개발용 코드나 폴더명을 노출하기보다는 사용자가 실제 메뉴에서 접하는 분류명을 적는 편이 이해하기 쉽습니다.

BreadcrumbList 구조화 데이터

BreadcrumbList는 브레드크럼의 각 단계와 순서를 검색엔진에 전달하는 구조화 데이터입니다. 스키마 마크업을 JSON-LD로 구현할 때는 각 단계를 ListItem으로 작성하고 position에 순서를 적습니다. JSON-LD를 추가하는 것만으로 화면에 이동 경로가 생기지는 않으므로, 사용자가 누를 링크는 별도로 구현해야 합니다.

{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "SEO 용어사전",
      "item": "https://example.com/glossary"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "브레드크럼"
    }
  ]
}

예시에서 name은 단계의 이름이고, item은 연결할 URL입니다. position: 1은 경로의 시작을 뜻합니다. 마지막 단계에서 item을 생략하면 Google은 마크업이 들어 있는 현재 페이지의 URL을 사용합니다. Google의 브레드크럼 요건을 충족하려면 최소 두 개의 ListItem이 있어야 합니다.

화면과 마크업 점검

1. 각 단계에 해당하는 페이지나 카테고리의 이름을 적습니다.
2. 상위 단계의 링크가 실제 페이지로 연결되는지 확인합니다.
3. 같은 카테고리에 속한 페이지들이 동일한 상위 분류로 연결되는지 살펴봅니다.
4. 화면에 표시한 경로와 구조화 데이터의 이름, 순서를 대조합니다.
5. 리치 결과 테스트에서 BreadcrumbList가 감지되는지 확인하고 필수 속성 오류를 수정합니다.

네이버도 BreadcrumbList를 지원하지만 ListItem의 필수 속성은 Google과 다릅니다. 네이버 가이드에서는 name이 필수이고 position은 선택 사항입니다. Google에도 대응하려면 position을 생략하지 말고 각 단계의 순서를 적어야 합니다.

사이트의 경로와 검색결과의 경로

사이트 화면의 브레드크럼과 Google 검색결과에 표시되는 경로는 구분해야 합니다. Google은 2025년 1월부터 모바일 검색결과의 URL 표시를 도메인 중심으로 단순화하면서 브레드크럼을 제외했습니다. 데스크톱 검색결과에서는 계속 경로를 표시합니다. 모바일 검색에 경로가 보이지 않는다는 이유만으로 마크업 오류라고 판단할 수는 없습니다.

리치 결과 테스트는 구조화 데이터가 Google 요건에 맞는지 검사하는 도구입니다. 테스트를 통과했다고 검색결과에 반드시 표시되는 것은 아닙니다. 실제 반영 상태는 Google이 페이지를 수집한 뒤 데스크톱 검색결과와 Search Console의 브레드크럼 보고서에서 확인합니다.

함께 알아두면 좋은 용어

• 내부 링크: 사이트 안에서 페이지와 페이지를 연결하는 링크
• 스키마 마크업: 구조화 데이터를 웹페이지에 구현하는 방식
• 구조화 데이터: 페이지의 의미와 관계를 정해진 형식으로 전달하는 데이터
• URL 구조: 페이지 주소의 경로와 표기 방식

참고 문서

• Google 검색 센터, 브레드크럼 구조화 데이터
• Schema.org, BreadcrumbList
• 네이버 서치어드바이저, 브레드크럼
• Google 검색 센터, 모바일 검색의 URL 표시 변경