피드로 돌아가기
JSON-LD Explained for Personal Websites
Hacker NewsHacker News
Frontend

JSON-LD 기반 Semantic Graph 설계로 Search Engine 최적화 달성

JSON-LD Explained for Personal Websites

2026년 6월 21일12beginner

Context

웹 크롤러가 페이지의 단순 텍스트를 넘어 의미적 구조(Semantic Structure)를 정확히 파악하지 못하는 한계 존재. 검색 엔진 결과의 풍부한 프리뷰(Rich Preview) 제공과 검색 순위 개선을 위한 구조화된 데이터 정의 필요성 대두.

Technical Solution

  • MIME type을 application/ld+json으로 설정하여 브라우저 JS 엔진의 실행을 방지하고 전용 크롤러만 파싱하도록 설계
  • Schema.org 표준 Context를 채택하여 웹 크롤러 간 데이터 호환성 확보
  • @graph 구조를 통해 개별 데이터 노드를 Directed Graph 형태로 연결하여 개체 간 관계 정의
  • @id에 URL과 Hash를 조합한 Unique Identifier를 부여하여 여러 페이지에 분산된 동일 개체 정보의 병합(Merge) 유도
  • 루트 페이지에는 상세 정보를 제공하고 서브 페이지에는 슬림 버전의 JSON-LD를 배치하여 데이터 중복 최소화 및 전송 효율 개선
  • WebSite, WebPage, Person, BlogPosting 등 역할별 노드 분리를 통해 정보 계층 구조 명확화

- `@id` 설정 시 URL#hash 형태의 고유 식별자를 사용하여 크롤러의 데이터 병합을 지원하고 있는가 - 루트 페이지와 서브 페이지 간 JSON-LD 정보 밀도를 차등 설계하여 효율성을 확보했는가 - `Schema.org`에서 정의한 표준 타입과 속성을 사용하여 시맨틱 웹 표준을 준수했는가 - `application/ld+json` 타입을 명시하여 클라이언트 사이드 런타임 오버헤드를 제거했는가

원문 읽기