개인 웹사이트에 JSON-LD 넣는 법, 검색엔진과 크롤러가 내 사이트를 제대로 읽게 만들기
개인 웹사이트에 JSON-LD 구조화 데이터를 추가해 검색엔진과 크롤러가 사이트, 사람, 글, 프로젝트를 더 정확히 이해하게 만드는 실전 가이드야. WebSite, Person, ProfilePage, BlogPosting 같은 노드를 어떻게 연결하고 어느 페이지에 넣어야 하는지 예시 중심으로 설명해.
- 1
JSON-LD는 브라우저가 실행하는 자바스크립트가 아니라 크롤러가 읽는 구조화 데이터임
- 2
개인 사이트는 WebSite, Person, ProfilePage, BlogPosting 같은 노드를 연결하면 검색 결과와 지식 그래프 표현이 좋아질 수 있음
- 3
같은 @id를 여러 페이지에서 재사용하면 크롤러가 노드 정보를 병합할 수 있음
- 4
LLM 크롤러처럼 한 페이지만 읽는 수집기도 있으므로 페이지마다 최소한의 맥락을 넣는 균형이 필요함
개인 블로그나 포트폴리오를 운영하는 개발자에게 꽤 바로 써먹을 수 있는 글이야. 요즘은 검색엔진뿐 아니라 LLM 크롤러도 페이지의 작성자와 맥락을 보니까, 구조화 데이터는 예전보다 더 실용적인 메타데이터 작업이 됐어.
관련 기사
Deno, 웹 프로젝트를 데스크톱 앱으로 묶는 `deno desktop` 공개
Deno가 TypeScript 파일 하나부터 Next.js 앱까지 데스크톱 앱으로 패키징하는 `deno desktop`을 공개했다. 아직 안정 릴리스는 아니고 Deno v2.9.0 canary에서만 쓸 수 있지만, 운영체제 WebView 기반의 작은 바이너리, 프레임워크 자동 감지, 내장 자동 업데이트까지 한 번에 노린다.
파비콘 안에 웹사이트를 숨겨 넣은 개발자, 진짜 됨
한 개발자가 웹사이트의 파비콘 이미지를 작은 저장소처럼 사용해 HTML을 픽셀 RGB 값 안에 넣고, 브라우저에서 다시 읽어 렌더링하는 실험을 했다. 208바이트짜리 HTML payload에 4바이트 길이 헤더를 붙여 총 212바이트를 만들었고, 이를 9x9 픽셀 PNG 안에 87% 사용률로 저장했다.
스크린이 절대 못 보여주는 색은 어디에 있을까
이 글은 우리가 화면에서 보는 색이 인간이 볼 수 있는 색 전체가 아니라, sRGB와 Display-P3 같은 색역 안에 갇힌 일부라는 점을 파고든다. 특히 숲, 바닷속, 새와 나비의 구조색, 생물발광, 교통신호 LED 같은 실제 세계에는 모니터와 카메라가 제대로 담지 못하는 청록색과 녹색 계열이 꽤 많다는 얘기다. 디스플레이, 카메라, 조명, 렌더링을 다루는 개발자라면 “색상값 하나”가 생각보다 물리와 표준의 타협이라는 걸 체감하게 된다.
크롬, 매니페스트 버전 2 우회로까지 닫는다
구글 크롬이 매니페스트 버전 2 확장 지원을 사실상 최종 종료 단계로 밀어넣고 있다. 기존에는 플래그나 레지스트리 설정으로 유블록 오리진 같은 확장을 살리는 우회가 있었지만, 크로미움 150과 151을 거치며 그 우회 코드까지 제거되는 흐름이다.
HTML 우선 사이트로 전환했더니 신청 완료자가 하룻밤 사이 2배가 된 이야기
한 공공성 강한 유틸리티 회사가 React 기반 신청 폼 실패 뒤, Astro와 HTML 우선 구조로 다시 만들었더니 폼 완료자가 출시 직후 2배로 늘어남. 핵심은 자바스크립트 없이도 동작하는 페이지별 폼, 서버 저장 세션, 접근성, 점진적 향상이었음.
댓글
댓글
댓글을 불러오는 중...