당신의 페이지가 Google에서는 1위지만 ChatGPT에는 보이지 않는 이유: 둘 다 사실입니다

대부분의 엔지니어링 팀 내부에는 조용히 자리 잡은 가정이 하나 있습니다. 만약 Google이 우리 사이트를 크롤링(Crawl)하고 렌더링(Render)할 수 있다면, AI 크롤러(Crawler)도 그럴 수 있을 것이라는 생각입니다.

그것은 틀렸습니다. 그리고 이것은 현재 기술적 SEO (Technical SEO) 분야에서 가장 비용이 많이 드는 잘못된 가정입니다.

격차 (The gap)

Googlebot은 JavaScript를 렌더링합니다. 수년 동안 그렇게 해왔습니다. 페이지가 렌더링 대기열(Render queue)에 들어가면, 헤드리스 크로미움(Headless Chromium)이 스크립트를 실행하고 그 결과가 인덱싱(Indexed)됩니다. 지연은 발생하지만, 작동은 합니다.

AI 크롤러는 아무것도 렌더링하지 않습니다.

2024년 12월 17일에 발표된 Vercel과 MERJ의 서버 로그 연구에 따르면, 주요 AI 크롤러 중 JavaScript를 실행하는 곳은 단 하나도 없었습니다. 여기에는 OpenAI의 GPTBot, OAI-SearchBot, ChatGPT-User 및 Anthropic의 ClaudeBot이 포함됩니다. 5억 건 이상의 GPTBot 페치(Fetch)에 대한 별도의 분석에서도 JavaScript 실행에 대한 증거는 전혀 발견되지 않았습니다.

가장 시사하는 바가 큰 세부 사항은 다음과 같습니다. 이 크롤러들은 JavaScript 파일을 다운로드하기는 합니다. GPTBot은 요청의 약 11.5%, ClaudeBot은 약 23.84%에서 그렇습니다. 그들은 스크립트를 가져오지만 결코 실행하지는 않습니다.

여기서 부분적인 점수를 줄 수는 없습니다. 당신의 콘텐츠가 초기 HTML 응답에 포함되어 있거나, 아니거나 둘 중 하나입니다.

유일한 예외는 Google Gemini입니다. Gemini는 Googlebot의 웹 렌더링 서비스(Web Rendering Service)를 기반으로 작동하며, 모든 대기 지연과 함께 JS를 실행하는 능력을 상속받습니다.

그래서 두 가지가 동시에 사실입니다

당신의 React 사이트가 첫 페이지에 랭크되어 있습니다. Google이 이를 렌더링하고, 인덱싱하고, 순위를 매겼습니다.

그런 다음 고객이 ChatGPT에 당신의 페이지가 답을 제공하는 바로 그 질문을 던졌을 때, 당신은 응답에 포함되어 있지 않습니다. 당신의 순위에는 아무런 문제가 없습니다. 크롤러가 빈 껍데기만을 받았기 때문입니다:

<body>
  <div id="root"></div>
  <script type="module" src="/assets/index-a1b2c3.js"></script>
...

당신은 동시에 1위이면서 동시에 보이지 않는 상태입니다.

함정 속의 함정: 구조화된 데이터 (Structured data)

이 부분이 구체적인 지점입니다.

당신은 React 사이트를 구축합니다. react-helmet을 추가합니다. 이를 통해 Organization, LocalBusiness, FAQPage 등 전체 그래프를 포함하는 JSON-LD를 주입합니다:

<Helmet>
  <script type="application/ld+json">
    {JSON.stringify(schema)}
...

DevTools를 열고 <head>를 확장하면 그것이 보입니다. 아름다운 마크업. 작업 완료.

완료된 것이 아닙니다. DevTools는 렌더링된 DOM (Document Object Model) — 즉, JavaScript가 실행된 후의 페이지를 보여줍니다. 그것은 크롤러(crawler)가 받는 내용이 아닙니다.

대신 view-source:를 여세요. Elements 패널이 아닙니다. 만약 당신의 JSON-LD가 DevTools에는 존재하지만 view-source에는 없다면, GPTBot, ClaudeBot, PerplexityBot은 그것을 절대 볼 수 없습니다.

Google은 여전히 그것을 찾아낼 것입니다. 왜냐하면 Google은 렌더링(rendering)을 하기 때문입니다. 이것이 이 실패가 매우 조용하게 일어나는 이유입니다. 평소에 확인하는 모든 도구들이 당신이 괜찮다고 말해주기 때문입니다.

알아둘 만한 미묘한 차이 하나: 콘텐츠가 반드시 눈에 보이는 산문(prose)일 필요는 없습니다. 초기 HTML에 인라인 JSON(inline JSON)이나 서버 사이드 렌더링(server-rendered) 페이로드로 임베디드된 데이터는 원문 응답(raw response)에 포함되어 있으며 읽을 수 있습니다. 놓치는 것은 구체적으로 브라우저가 로드 후에 구축하는 내용입니다.

이것이 문제를 악화시키는 이유

ChatGPT 에이전트 쿼리의 약 92%가 Bing의 인덱스(index)에 의존하며, Bingbot의 JavaScript 렌더링은 제한적입니다. 따라서 클라이언트 사이드 렌더링(client-side rendered) SPA(Single Page Application)는 Bing뿐만 아니라 이를 쿼리하는 모든 AI 크롤러로부터 누락될 위험이 있습니다. 두 가지 실패가 하나의 근본 원인에서 비롯되는 것입니다.

테스트는 30초면 충분합니다

curl -s https://you.com/page | grep -c "ld+json"
curl -s https://you.com/page | grep "your headline text"

만약 grep이 아무것도 반환하지 않는다면, 크롤러도 아무것도 반환하지 않습니다.

당신의 가격 페이지, 서비스 페이지, 가장 인기 있는 기사에서 실행해 보세요. 그 페이지들이 가장 많은 것을 잃을 수 있는 페이지들입니다.

해결책은 새로운 것이 아닙니다

서버 사이드 렌더링 (SSR, Server-side rendering), 정적 생성 (static generation), 또는 프리렌더링 (prerendering). Next.js, Nuxt, Angular Universal, Django SSR — 프레임워크보다 중요한 것은 원칙입니다: 실제 콘텐츠를 서버가 보내는 HTML에 넣으세요.

저희 플랫폼의 경우, JSON-LD를 Helmet을 통해 주입하는 대신 DOM에 직접 렌더링하며, 주요 페이지는 프리렌더링(prerendered)됩니다. 이것이 우아해서가 아니라, 스키마(schema)를 가지고 있는 것과 누구나 읽을 수 있는 스키마를 가지고 있는 것의 차이이기 때문입니다.

이것은 지난 10년 동안 옳았던 것과 동일한 조언입니다. 변한 것은 이를 무시했을 때 발생하는 비용입니다. 과거에는 Google의 렌더링 대기열 (render queue)에서 기다리는 것을 의미했습니다. 하지만 이제는 현존하는 가장 빠르게 성장하는 발견 채널 (discovery channel)에서 답변 자체가 완전히 누락되는 것을 의미합니다.

Insights

당신의 페이지가 Google에서는 1위지만 ChatGPT에는 보이지 않는 이유: 둘 다 사실입니다

요약

핵심 포인트