당신의 $50k 헤드리스 스택이 AI에 보이지 않는다 (그리고 해결 방법)
Source: Dev.to
개요
현대 웹 개발의 잔인한 아이러니: 우리는 지난 5년간 콘텐츠를 프레젠테이션에서 분리해 구글을 위해 사이트를 더 빠르게 만들었지만, 그 결과 ChatGPT에게는 읽을 수 없게 만들었습니다.
당연히 알죠. Headless CMS(예: Sanity, Storyblok, Contentful)로 마이그레이션하고, 멋진 Next.js 혹은 Nuxt 프론트엔드를 구축했습니다. Lighthouse 점수는 98, Core Web Vitals는 초록색.
그럼에도 불구하고, ChatGPT에 제품에 대해 물어보면 2023년에 폐기한 기능을 환각처럼 떠올리거나, 더 심한 경우 아직도 먼지가 쌓인 WordPress 설치를 사용 중인 경쟁자를 추천합니다.
왜일까요?
크롤러(Googlebot)를 위해 최적화했지만, 독자(LLM)를 무시했기 때문입니다.
“Div Soup” 함정
Headless 아키텍처는 인간에게는 뛰어납니다. 즉시 JSON을 로드하고, React 컴포넌트를 하이드레이트하며, 스냅 같은 앱 경험을 제공합니다.
하지만 브랜드 컨텍스트를 흡수하려는 LLM에게는 악몽과도 같습니다.
AI 봇이 사이트를 스크랩할 때, 아름다운 UI를 “보는” 것이 아니라 하이드레이션 스크립트, 쿠키 배너, “무료 체험” 버튼, 그리고 깊게 중첩된 “ 태그들의 혼란스러운 집합을 보게 됩니다. 신호‑대‑잡음 비율이 형편없습니다.
예전엔 의미론적 HTML(<h1>, <h2>, <p>)만으로 충분했습니다. 오늘날엔 콘텐츠가 클라이언트‑사이드 번들 안에 파묻혀 있어 파싱에 무거운 렌더링 리소스가 필요합니다.
구글은 JS를 렌더링하기 위해 무제한 컴퓨트를 가지고 있지만, Perplexity, ChatGPT, Claude는 그렇지 않습니다. 그들은 순수하고 깨끗하며 구조화된 텍스트를 원합니다.
누락된 파일: llms.txt
AI 에이전트가 웹사이트를 읽는 방식을 표준화하려는 움직임이 커지고 있습니다. 바로 /llms.txt 입니다.
robots.txt를 인간(그리고 초똑똑한 봇)용으로 만든다고 생각하면 됩니다. 마크다운 파일로 다음을 설명합니다:
- 당신이 누구인지.
- 무엇을 하는지.
- 핵심 문서, 가격, 기능을 어디서 찾을 수 있는지.
Headless 스택을 운영한다면, 이 파일을 만들 변명할 여지가 없습니다. 이미 CMS에 구조화된 데이터가 있기 때문이죠!
해결책 (3단계)
/llms.txt엔드포인트 생성 – 빌드 시점에 마크다운 파일을 생성합니다.- 불필요한 요소 제거 – 네비게이션, 푸터, CTA 버튼을 제외하고 H1, H2와 일반 텍스트만 포함합니다.
- 봇에 제공 – 푸터에 이 파일을 명시적으로 링크하거나 (비공식적으로)
robots.txt에 포함시켜 연구자와 봇이 찾을 수 있게 합니다.
“Headless SEO” 격차
새로운 기술 부채 카테고리가 등장하고 있습니다: AI 가독성 부채.
기업들은 “현대적인” 스택이 2026년에 답을 제공하는 엔진에 적대적이기 때문에 가시성을 잃고 있습니다.
Storyblok이나 Sanity를 사용한다면, 구조화된 데이터가 금광과도 같습니다. 하지만 그 데이터를 React 컴포넌트에만 파이프하고 기계가 읽을 수 있는 엔드포인트를 제공하지 않으면, 여러분은 보이지 않게 됩니다.
2026년에 성공하는 브랜드는 구글 순위만 올리는 것이 아니라 ChatGPT에 인용되는 브랜드입니다.
ChatGPT는 여러분의 LCP 점수에 관심이 없습니다. 텍스트에 관심이 있습니다.
당신의 Headless 스택이 보이지 않나요? VectorGap은 AI 모델이 여러분의 브랜드를 경쟁사와 비교해 어떻게 인식하는지 추적합니다. 추측을 멈추고 측정을 시작하세요.