JSON-LD 스키마 마크업: 완벽한 SEO 구현 가이드
JSON-LD 구조화 데이터는 검색 엔진에 콘텐츠 내용을 명확히 전달합니다. 적절한 스키마 마크업으로 구글 검색에서 FAQ, 기사 캐러셀, 빵 부스러기 등 풍부한 결과를 제공합니다.
이 가이드는 주요 스키마 유형별 실제 C# 구현 코드와 생성되는 JSON 출력을 제공합니다. 모든 예제는 실제 Blazor 프로덕션 코드에서 가져왔습니다.
목차
JSON-LD란 무엇이며 SEO에 중요한 이유
JSON-LD는 JSON 형식으로 구조화 데이터를 인코딩하는 방법입니다. 구글 등 검색 엔진은 키워드뿐 아니라 콘텐츠 의미를 이해하기 위해 이 데이터를 읽습니다.
구글이 구조화 데이터를 파싱하면 평점, FAQ, 기사 이미지, 빵 부스러기 등 시각적 강화 검색 결과에 노출되어 일반 링크보다 클릭률이 높아집니다.
구글은 JSON-LD를 공식 권장하며, 이는 페이지 어디에나(헤드 포함) 배치 가능하고 기존 HTML 수정 없이 구조화 데이터를 분리해 관리할 수 있기 때문입니다.
풍부한 결과 노출 조건
유효한 스키마 마크업은 구글 검색에서 FAQ, 기사 캐러셀, 빵 부스러기 등 풍부한 기능 노출 자격을 부여합니다.
동일 순위에서 더 많은 클릭
의미 명확성
구조화 데이터는 모호함을 제거합니다. Q&A 페이지는 FAQPage로 명확히 선언해 구글이 FAQ 풍부한 결과로 표시하도록 합니다.
검색 엔진에 정확한 정보 전달
HTML 변경 없이 적용
JSON-LD는 헤드의 스크립트 태그에 위치해 시각적 HTML에 영향을 주지 않아 레이아웃이나 접근성 문제 없이 스키마를 추가·수정할 수 있습니다.
명확한 역할 분리
JSON-LD, Microdata, RDFa 비교
웹페이지에 schema.org 구조화 데이터를 삽입하는 세 가지 형식이 있으며, 구글은 모두 인식하지만 적용과 유지보수 방식이 크게 다릅니다.
| 포맷 | 구문 위치 | 유지보수 | SEO 영향 | 구글 권장 |
|---|---|---|---|---|
| JSON-LD | 별도 스크립트 태그 | 간편함 — HTML 변경 불필요 | 풍부한 결과 완전 지원 | 권장 |
| Microdata | 인라인 HTML 속성 | 높음 — 마크업에 밀접 결합 | 풍부한 결과 완전 지원 | 지원됨 |
| RDFa | 인라인 HTML 속성 | 높음 — 마크업에 밀접 결합 | 풍부한 결과 완전 지원 | 지원됨 |
JSON-LD가 유지보수에 유리한 이유
Microdata와 RDFa는 HTML 곳곳에 스키마 속성이 분산되어 템플릿 변경 시 구조화 데이터가 깨질 수 있습니다. JSON-LD는 독립 블록으로 스크립트만 수정하면 됩니다.
SEO 최적화로 배우는 최신 웹 개발
제가 드리는 팁 이 강좌는 기술적 SEO, 구조화 데이터, 최신 웹 표준이 실제 프로젝트에서 어떻게 적용되는지 이해하는 데 유용했습니다.
- HTML 메타 태그, Open Graph, JSON-LD 구조화 데이터 구현법 학습
- 검색 노출과 순위 향상을 위한 실무 SEO 전략
- 반응형 디자인과 성능 최적화 실습 프로젝트
핵심 스키마 유형과 사용 시기
Schema.org는 수백 개 유형을 정의하지만, 일부 유형이 대부분 웹 콘텐츠를 차지하며 구글 풍부한 결과를 활성화합니다.
| 스키마 유형 | 사용 사례 | 풍부한 결과 유형 |
|---|---|---|
| Article | 블로그, 가이드, 뉴스 기사 | 기사 캐러셀, 주요 뉴스 |
| FAQPage | 질문/답변 페이지 | 검색 결과 내 FAQ 드롭다운 |
| BreadcrumbList | 내비게이션 계층이 있는 모든 페이지 | URL 아래 빵 부스러기 경로 |
| WebSite / WebPage | 홈페이지, 허브 페이지, 랜딩 페이지 | 사이트링크 검색창, 엔티티 인식 |
| SoftwareApplication | 앱, 도구, 소프트웨어 제품 | 평점 및 가격 포함 앱 풍부한 결과 |
Schema.org 어휘
모든 스키마 유형은 schema.org에 정의되어 있습니다. JSON-LD의 @context 속성은 파서가 schema.org 어휘에 따라 속성명을 해석하도록 합니다. 여러 스키마 유형을 한 페이지에 조합할 수 있으며, 구글은 각 스크립트 블록을 독립 처리합니다.
기사 스키마 구현
기사 스키마는 콘텐츠 중심 사이트에서 가장 중요하며, 제목, 설명, 발행일, 저자, 발행자를 구글에 알려 풍부한 결과 자격을 갖춥니다.
아래 C# 클래스는 직렬화 모델로, 각 속성은 JsonPropertyName 속성으로 JSON-LD 필드에 직접 매핑됩니다.
private class ArticleSchema
{
[JsonPropertyName("@context")]
public string Context { get; } = "https://schema.org";
[JsonPropertyName("@type")]
public string Type { get; } = "Article";
[JsonPropertyName("headline")]
public string? Headline { get; set; }
[JsonPropertyName("description")]
public string? Description { get; set; }
[JsonPropertyName("image")]
public string? Image { get; set; }
[JsonPropertyName("url")]
public string? Url { get; set; }
[JsonPropertyName("author")]
public Organization? Author { get; set; }
[JsonPropertyName("publisher")]
public ArticlePublisher? Publisher { get; set; }
[JsonPropertyName("datePublished")]
public string? DatePublished { get; set; }
[JsonPropertyName("dateModified")]
public string? DateModified { get; set; }
[JsonPropertyName("articleSection")]
public List<string>? ArticleSection { get; set; }
}필수 속성은 제목, 이미지, 발행일, 수정일, 저자, 발행자이며, articleSection 배열은 선택 사항이나 구글에 주제 범위를 알리는 데 권장됩니다.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Article",
"headline": "JSON-LD Schema Markup: Complete SEO Implementation Guide",
"description": "Learn how to implement JSON-LD structured data for Article, FAQPage, BreadcrumbList, WebSite, and WebPage schema types.",
"image": "https://ghostlyinc.com/images/web/jsonldguide/opengraph/hero-1200.png",
"url": "https://ghostlyinc.com/en/json-ld-schema-markup-seo-guide/",
"author": {
"@type": "Organization",
"name": "GhostlyInc",
"url": "https://ghostlyinc.com"
},
"publisher": {
"@type": "Organization",
"name": "GhostlyInc",
"logo": {
"@type": "ImageObject",
"url": "https://ghostlyinc.com/images/logo.png"
}
},
"datePublished": "2026-03-28T10:00:00Z",
"dateModified": "2026-03-28T10:00:00Z",
"articleSection": [
"What is JSON-LD and why it matters for SEO",
"JSON-LD vs. Microdata vs. RDFa",
"Core schema types and when to use them",
"Article schema implementation"
]
}
</script>저자와 발행자는 모두 Organization 타입입니다. 개인 블로그는 저자를 이름과 URL을 가진 Person 타입으로 할 수 있습니다.
FAQ 스키마로 풍부한 스니펫 생성
FAQPage 스키마는 구글 검색 결과에 확장 가능한 질문/답변 쌍을 표시해 결과 영역을 넓히고 가시성과 클릭률을 높입니다.
FaqPage 클래스는 질문 목록을 보유하며, 각 질문은 이름(질문)과 acceptedAnswer의 텍스트(답변)를 포함해야 합니다.
private class FaqPage
{
[JsonPropertyName("@context")]
public string Context { get; } = "https://schema.org";
[JsonPropertyName("@type")]
public string Type { get; } = "FAQPage";
[JsonPropertyName("@id")]
public string? Id { get; set; }
[JsonPropertyName("name")]
public string? Name { get; set; }
[JsonPropertyName("mainEntity")]
public List<FaqEntity>? MainEntity { get; set; }
}
private class FaqEntity
{
[JsonPropertyName("@type")]
public string Type { get; } = "Question";
[JsonPropertyName("name")]
public string? Name { get; set; }
[JsonPropertyName("acceptedAnswer")]
public FaqAnswer? AcceptedAnswer { get; set; }
}
private class FaqAnswer
{
[JsonPropertyName("@type")]
public string Type { get; } = "Answer";
[JsonPropertyName("text")]
public string? Text { get; set; }
}출력은 mainEntity 배열을 가진 단일 FAQPage 블록이며, 각 항목은 acceptedAnswer가 있는 Question 타입입니다. 구글은 페이지당 최대 10개 질문을 지원합니다.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"@id": "https://ghostlyinc.com/en/json-ld-schema-markup-seo-guide/#faq",
"name": "Frequently asked questions",
"mainEntity": [
{
"@type": "Question",
"name": "What is the difference between JSON-LD and Microdata?",
"acceptedAnswer": {
"@type": "Answer",
"text": "JSON-LD is a separate script block that lives in the head and does not touch HTML. Microdata adds attributes directly to HTML elements. Google recommends JSON-LD for its maintainability."
}
},
{
"@type": "Question",
"name": "How many FAQ questions can I mark up?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Google supports up to ten questions per page for the FAQ rich result. Additional questions are still valid schema but will not appear in the search result enhancement."
}
}
]
}
</script>FAQPage 블록의 @id는 특정 URL 조각에 스키마를 고정하며, 여러 스키마 블록이 있는 페이지에서 각 엔티티를 명확히 식별하는 모범 사례입니다.
WebSite 및 WebPage 스키마
WebSite와 WebPage 스키마는 사이트의 기본 엔티티 그래프를 구성합니다. WebSite는 사이트 이름, URL, 언어, 발행자를, WebPage는 개별 페이지와 상위 WebSite를 isPartOf 관계로 연결합니다.
두 클래스 모두 동일한 JSON-LD 패턴을 따르며, WebSite의 @id는 도메인 루트, WebPage의 @id는 전체 페이지 URL입니다.
private class WebSiteSchema
{
[JsonPropertyName("@context")]
public string Context { get; } = "https://schema.org";
[JsonPropertyName("@type")]
public string Type { get; } = "WebSite";
[JsonPropertyName("name")]
public string? Name { get; set; }
[JsonPropertyName("url")]
public string? Url { get; set; }
[JsonPropertyName("inLanguage")]
public string? InLanguage { get; set; }
[JsonPropertyName("publisher")]
public Organization? Publisher { get; set; }
}
private class WebPageSchema
{
[JsonPropertyName("@context")]
public string Context { get; } = "https://schema.org";
[JsonPropertyName("@type")]
public string Type { get; } = "WebPage";
[JsonPropertyName("@id")]
public string? Id { get; set; }
[JsonPropertyName("name")]
public string? Name { get; set; }
[JsonPropertyName("description")]
public string? Description { get; set; }
[JsonPropertyName("url")]
public string? Url { get; set; }
[JsonPropertyName("inLanguage")]
public string? InLanguage { get; set; }
[JsonPropertyName("isPartOf")]
public WebSiteReference? IsPartOf { get; set; }
}inLanguage 속성은 BCP 47 언어 코드를 사용하며(예: en, de, fr), isPartOf 링크는 WebPage를 WebSite 엔티티에 연결해 구글이 사이트 전체 엔티티 모델을 구축하도록 돕습니다.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebSite",
"name": "GhostlyInc",
"url": "https://ghostlyinc.com",
"inLanguage": "en",
"publisher": {
"@type": "Organization",
"name": "GhostlyInc",
"url": "https://ghostlyinc.com"
}
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebPage",
"@id": "https://ghostlyinc.com/en/json-ld-schema-markup-seo-guide/",
"name": "JSON-LD Schema Markup: Complete SEO Implementation Guide",
"description": "Learn how to implement JSON-LD structured data for Article, FAQPage, BreadcrumbList, WebSite, and WebPage schema types.",
"url": "https://ghostlyinc.com/en/json-ld-schema-markup-seo-guide/",
"inLanguage": "en",
"isPartOf": {
"@type": "WebSite",
"@id": "https://ghostlyinc.com"
}
}
</script>구현 모범 사례
WrapInScriptTag 헬퍼 메서드는 JSON 문자열을 유효한 JSON-LD 블록으로 감싸며, application/ld+json MIME 타입의 스크립트 태그로 래핑합니다.
이 메서드는 서비스 내 모든 스키마 빌더(Article, FAQPage, BreadcrumbList, WebSite, WebPage)가 직렬화된 JSON을 전달하는 공통 유틸리티입니다.
private static MarkupString WrapInScriptTag(string json)
{
var builder = new StringBuilder();
builder.AppendLine("<script type=\"application/ld+json\">");
builder.AppendLine(json);
builder.AppendLine("</script>");
return new MarkupString(builder.ToString());
}SchemaContext 객체는 BuildSchema 메서드의 진입점으로, 페이지의 전체 스키마 블록을 구성하는 데 필요한 유형, 메타데이터, FAQ 목록, 빵 부스러기 계층, 기사 데이터를 포함합니다.
public SchemaBuildResult BuildSchema(SchemaContext context)
{
if (context == null) throw new ArgumentNullException(nameof(context));
var jsonLd = new List<MarkupString>();
switch (context.PageType)
{
case PageSchemaType.Home:
jsonLd.Add(WebSite(context));
jsonLd.Add(WebPage(context));
break;
case PageSchemaType.Article:
jsonLd.Add(Article(context.Article!));
break;
case PageSchemaType.Tool:
jsonLd.Add(WebPage(context));
jsonLd.Add(SoftwareApplication(context.SoftwareApplication!));
break;
case PageSchemaType.Hub:
jsonLd.Add(WebPage(context));
break;
}
if (context.Faqs != null && context.Faqs.Count > 0)
{
jsonLd.Add(FAQ(context.Faqs.ToList(), context.FaqTitle, context.Url));
}
if (context.ParentHierarchy.Count > 0)
{
jsonLd.Add(BreadcrumbList(BuildBreadcrumbItems(context)));
}
return new SchemaBuildResult(jsonLd, context.PageType == PageSchemaType.Article);
}디스패치 스위치는 스키마 빌더를 조합 가능하게 하며, FAQ와 빵 부스러기는 페이지 유형에 관계없이 항상 추가됩니다. 따라서 모든 페이지 유형에 FAQ 또는 빵 부스러기 추가가 가능합니다.
스키마 테스트 및 검증
유효한 JSON-LD 구문이 풍부한 결과 노출을 보장하지는 않습니다. 구글 도구는 구문과 정책 준수 여부를 모두 검사합니다.
풍부한 결과 테스트
search.google.com/test/rich-results에서 URL 또는 HTML을 입력해 테스트하세요. 구글이 감지된 풍부한 결과 유형과 누락된 필수 속성을 알려줍니다.
구글 공식 노출 자격 검사기
스키마 마크업 검증기
validator.schema.org는 구글 풍부한 결과 정책과 무관하게 schema.org 규격에 맞는지 검증해 속성명 오타와 타입 불일치를 잡아냅니다.
Schema.org 구문 검증
구글 서치 콘솔
서치 콘솔의 개선사항 섹션은 인덱싱된 페이지의 스키마 오류와 경고를 대규모로 보고하며, 초기 검증 후 지속 모니터링에 활용하세요.
출시 후 대규모 모니터링