저는 AI 도구로 직접 웹사이트를 구축해 왔고, 몇 개를 출시한 후 간단한 답을 얻고 싶었습니다. 과연 ChatGPT가 실제로 이 사이트들을 읽어낼 수 있을까요?
그래서 Bolt나 Lovable 같은 도구로 만들어진 30개의 라이브 사이트를 가져와서, 대부분의 AI 크롤러가 하는 방식(자바스크립트 없이 단순 HTTP 요청 하나)으로 각 홈페이지를 테스트했고, 무엇이 돌아오는지 확인했습니다.
왜 원본 HTML이 중요한가
대부분의 AI 제작 웹사이트는 Single-page React 앱입니다. 서버는 거의 비어 있는 HTML 파일을 보내고, 브라우저에서 자바스크립트(JavaScript)가 실행된 후에 페이지를 구축합니다.
이는 사람에게는 문제가 없습니다. 구글(Google)에게도 어느 정도 괜찮습니다. 왜냐하면 구글은 JavaScript를 렌더링하기 때문이지만, 단순 HTML보다 나중에, 그리고 덜 안정적으로 처리됩니다. 하지만 Vercel과 MERJ가 2024년 12월에 발표한 연구에 따르면, 그들이 관찰한 주요 AI 크롤러들(OpenAI, Anthropic, Perplexity 포함) 중 어느 것도 JavaScript를 렌더링하지 못하는 것으로 나타났습니다. Slack, X, WhatsApp의 링크 미리보기 역시 대부분 원본 HTML을 읽어냅니다.
따라서 콘텐츠가 자바스크립트 실행 후에만 존재하는 경우, 해당 도구들은 다음과 같은 것을 받게 됩니다:
제가 발견한 것들
저는 2026년 10월 14일에 이 점검을 실행했고, 더 나은 플랫폼 감지 기능을 사용하여 10월 23일에 재실행했습니다. 다음은 10월 23일의 수치입니다:
| Platform | Sites | Still reachable | Blank without JS |
|---|
| Bolt | 10 | 9 | 8 |
| ... | | | |
"Blank"는 원본 HTML에서 가시적인 문자가 200자 미만이거나 빈 앱 마운트 포인트 또는 페이지를 구축하는 스크립트로 이루어진 경우를 의미합니다. 이 분할은 결코 사소하지 않았습니다. 첫 번째 실행에서는 빈 사이트들이 최대 163자의 가시적 문자만을 가지고 있었고, 나머지 모든 사이트는 최소 1,692자 이상을 가지고 있었습니다.
몇 가지 다른 점들도 발견되었습니다:
- Soft 404s: 30개 사이트 중 13개가 존재하지 않는 페이지에 대해
200 OK 응답을 했습니다. 크롤러에게는 모든 쓰레기 URL이 동일한 콘텐츠를 가진 실제 페이지처럼 보입니다.
- 사이트맵 부재 (No sitemap): 첫 번째 실행에서 30개 중 16개가 제가 찾을 수 있는 사이트맵이 없었으며, 이는 Bolt 사이트 10개 중 9개에 해당했습니다.
http://localhost:3000/를 가리키는 canonical: 한 사이트는 검색 엔진에게 자신의 실제 주소가 개발자의 노트북이라고 알려주고 있었습니다.
Lovable 관련 주의사항
Lovable은 표가 보여주는 것보다 더 복잡합니다. Lovable에 따르면 2026년 5월 이후 생성된 프로젝트는 서버 렌더링(server-rendered)되며, 이전 프로젝트의 경우 ChatGPT, Perplexity, Claude, Gemini를 포함한 인증된 크롤러에게만 제공되는 사전 렌더링된 복사본(prerendered copy)을 받습니다. Base44 역시 커스텀 도메인에서 이와 유사하게 작동한다고 알려져 있습니다.
제가 수행한 점검은 자체 봇으로 식별되기 때문에, 크롤러 전용 복사본을 볼 수 없습니다. 외부에서 빈 페이지가 보인다고 해서 ChatGPT가 Lovable 사이트에서 아무것도 보지 못한다는 것을 증명하지는 못합니다. Bolt나 순수한 Vite + React 사이트는 사용자가 직접 설정한 경우에만 해당 대체(fallback)를 받게 됩니다.
10초 만에 본인의 사이트 점검하기
curl -s https://yoursite.com | grep -o "<title>.*</title>"
curl -s https://yoursite.com | wc -c
curl -s -o /dev/null -w "%{http_code}\n" https://yoursite.com/this-page-does-not-exist
- 만약 제목이 여전히
Vite + React + TS라면, 이것부터 수정해야 합니다. 이는 Google과 AI 도구에서 사이트 이름으로 표시되는 내용입니다.
- HTML의 크기가 수백 바이트에 불과하고 헤드라인이 포함되어 있지 않다면, JavaScript를 실행하지 않는 크롤러는 빈 페이지로 인식합니다.
- 마지막 명령어가
200을 출력한다면, 소프트 404(soft 404s)가 있다는 의미입니다.
Chrome에서 view-source:yoursite.com을 열고 헤드라인을 검색해 보는 것도 방법입니다.
수정 방법
- 콘텐츠가 포함된 HTML 전송(Ship HTML with content). 모든 공개 페이지에 대해 빌드 시 사전 렌더링(build-time prerendering)을 추가하거나 서버 렌더링(server rendering)을 사용하세요. Next.js와 Astro는 이를 기본적으로 수행합니다. Vite + React 앱의 경우, 빌더(Bolt, Replit Agent, Cursor 또는 Claude Code)에게 모든 공개 경로에 대해 빌드 시 사전 렌더링을 추가하도록 요청하여 각 페이지의 제목(title), 설명(description), 본문 텍스트가 HTML에 포함되도록 하세요.
- 실제 404 오류 반환(Return a real 404). 많은 호스팅 서비스는 모든 경로를
index.html로 보내도록 설정되어 있습니다. 이 리라이트 기능을 존재하는 경로로 제한하고, 나머지 경로는 404 상태 코드를 가진 '찾을 수 없음' 페이지를 제공하세요.
- 사이트맵 추가(Add a sitemap). 실제 도메인의 페이지 목록이 포함된
sitemap.xml을 생성하고, 이를 robots.txt에 참조하며 Google Search Console에 제출하세요.
- 정규화 태그 확인(Check your canonical). 이 태그는
*.bolt.host, *.vercel.app 또는 localhost 주소가 아닌 실제 운영 도메인(production domain)을 가리켜야 합니다.
그런 다음 curl 명령을 다시 실행하세요. 헤드라인이 원본 HTML에 나타난다면 작업이 완료된 것입니다.
제한 사항 (Limitations)
30개의 사이트는 적은 표본이며 무작위로 추출된 것이 아닙니다. 저는 이들을 Google 검색 결과에서 직접 복사했기 때문에, 빈 페이지인지 여부와 관계없이 이미 Google에 색인(indexed)되어 있었습니다. 플랫폼 감지 기능이 사이트를 잘못 분류할 수 있으며, 각 사이트는 특정 시점에 확인되었습니다. 제시된 백분율은 전체 통계가 아닌 하나의 신호로 간주해 주십시오.
전체 방법과 익명화된 데이터(CSV)는 여기에서 확인할 수 있습니다: 우리가 확인한 Lovable 및 Bolt 사이트 중 대부분은 JavaScript 없이 빈 페이지였습니다.
고지 사항 (Disclosure): 저는 이 점검 기능을 무료 도구인 IndexReady로 만들었습니다. 이 도구는 사용자가 만든 홈페이지에 대해 약 15초 만에 이러한 테스트를 실행하고 단계별 수정 방법을 제공합니다. 가입할 필요가 없습니다. 만약 이를 실행했는데 뭔가 잘못된 것 같다면, 저에게 알려주시면 감사하겠습니다.