자바스크립트 SEO JavaScript SEO
자바스크립트 SEO는 자바스크립트로 화면을 그리는 사이트가 검색엔진과 AI 양쪽에 제대로 읽히게 만드는 일입니다. 구글은 자바스크립트를 실행해 내용을 읽지만, 챗GPT와 클로드 같은 AI 봇 대부분은 실행하지 않습니다. 같은 페이지가 검색에는 나오고 AI 답변에는 빠지는 일이 여기서 생깁니다.
같은 페이지를 구글은 읽고 AI는 못 읽습니다
브라우저에서 멀쩡히 보이는 화면이라도, 검색엔진과 AI가 받아 가는 내용은 다를 수 있습니다. 서버가 처음 내려주는 HTML에 글이 들어 있는 경우가 있고, 빈 껍데기만 내려준 뒤 자바스크립트가 화면을 그려 채우는 경우가 있습니다. 사람 눈에는 결과가 같지만 기계에게는 전혀 다릅니다.
자바스크립트 SEO는 이 차이를 관리하는 일입니다. 자바스크립트로 화면을 그리는 사이트가 검색엔진과 AI 양쪽에 제대로 읽히도록 만드는 작업을 말합니다.
구글은 자바스크립트를 실행합니다
구글은 자바스크립트 사이트를 크롤링, 렌더링, 색인 세 단계로 처리합니다. 페이지를 가져온 다음(크롤링), 브라우저와 같은 환경에서 자바스크립트를 실행해 화면을 완성하고(렌더링), 그 결과를 검색 데이터베이스에 넣습니다(색인). Google 공식
렌더링은 곧바로 일어나지 않고 순서를 기다립니다. 이 대기 때문에 "구글이 자바스크립트 사이트를 늦게 색인한다"는 말이 오래 돌았는데, 실측 결과는 생각보다 짧습니다. 크롤링부터 렌더링이 끝나기까지, 절반은 10초 안에 끝났고 네 곳 중 세 곳이 26초 안에 끝났습니다. MERJ·Vercel 실측
처리 범위도 넓습니다. 같은 조사에서 검사한 HTML 페이지는 전부 렌더링됐고, 화면을 연 뒤 서버에서 따로 불러오는 방식으로 채운 내용도 모두 색인됐습니다. 구글만 놓고 보면 자바스크립트로 만든 사이트라도 큰 문제가 없다는 뜻입니다. MERJ·Vercel 실측
AI 봇 대부분은 자바스크립트를 실행하지 않습니다
여기서 갈립니다. 챗GPT와 클로드의 수집 봇은 자바스크립트 파일을 받아 가기는 합니다. 전체 요청 가운데 챗GPT가 11.50퍼센트, 클로드가 23.84퍼센트를 자바스크립트 파일에 씁니다. 그런데 받아만 갈 뿐 실행하지 않습니다. 자바스크립트가 그려 넣는 내용은 이들에게 존재하지 않는 것과 같습니다. Vercel 실측
2026년 1월 조사에서도 결과는 같았습니다. 오픈AI, 앤스로픽, 메타, 바이트댄스, 퍼플렉시티의 봇은 모두 자바스크립트를 실행하지 못했습니다. 실행한 것은 제미나이, 애플봇, 커먼크롤의 봇 세 종류뿐이었습니다. 제미나이가 되는 이유는 구글의 수집 기반을 그대로 쓰기 때문입니다. Search Engine Journal
구글 공식 문서도 이 점을 짚고 있습니다. 서버에서 미리 완성해 내려주는 방식을 권하면서, 이유 가운데 하나로 모든 봇이 자바스크립트를 실행할 수 있는 것은 아니라는 점을 듭니다. Google 공식
그래서 GEO를 신경 쓰는 사이트라면 순서를 바꿔 생각해야 합니다. 구글에서 잘 나온다고 AI 답변에도 나온다는 보장이 없습니다. 검색 노출과 AI 인용은 통과해야 하는 관문이 다릅니다.
갈리는 기준은 도구가 아니라 렌더링 방식입니다
리액트나 뷰 같은 도구를 썼다고 해서 안 읽히는 것이 아니고, 워드프레스로 만들었다고 해서 저절로 읽히는 것도 아닙니다. 기준은 하나입니다. 서버가 처음 내려주는 HTML 안에 내용이 들어 있는가입니다.
- 서버에서 완성해 내려주면(서버 사이드 렌더링) 어떤 도구로 만들었든 AI 봇도 읽습니다.
- 브라우저에서 그려 채우면(클라이언트 사이드 렌더링) 구글은 읽지만 AI 봇 대부분은 못 읽습니다.
- 워드프레스도 핵심 내용을 자바스크립트로만 채우면 똑같이 안 보입니다.
워드프레스가 상대적으로 안전한 편인 것은 사실이지만, 워드프레스라서가 아니라 서버에서 HTML을 완성해 내려주는 구조이기 때문입니다. 도구 이름이 아니라 구조를 봐야 합니다.
내 사이트가 어느 쪽인지 확인하는 법
브라우저에서 페이지 소스 보기를 열면 서버가 내려준 최초 HTML을 그대로 볼 수 있습니다. 윈도우는 Ctrl+U, 맥은 Command+Option+U입니다. 여기서 본문 문장 한 토막을 찾아보십시오.
- 소스 안에서 찾아지면 정적 HTML에 담긴 내용입니다. AI 봇도 읽습니다.
- 소스에는 없는데 화면에는 보이면 자바스크립트가 그린 내용입니다. AI 봇에게는 보이지 않습니다.
개발자도구의 요소 탭은 자바스크립트가 다 실행된 뒤의 최종 상태를 보여주므로, 이 확인에는 쓰면 안 됩니다. 반드시 소스 보기로 대조해야 차이가 드러납니다. Search Engine Journal
제목, 설명, 본문, 메뉴처럼 검색과 AI가 참고할 내용은 소스 보기 단계에서 이미 들어 있어야 합니다. Vercel 실측
페이지 소스 보기(Ctrl+U)에서 본문 문장 검색
찾아짐 → 정적 HTML → 구글·AI 모두 읽음
안 찾아짐 → JS 렌더링 → 구글은 읽고 AI는 못 읽음동적 렌더링은 구글이 권하지 않습니다
봇이 접속하면 완성된 HTML을 따로 만들어 주고 사람에게는 원래대로 보여주는 방식을 동적 렌더링이라고 부릅니다. 한때 해결책으로 쓰였지만 구글은 임시 방편이었을 뿐 오래 쓸 방법이 아니라고 정리했습니다. 구조가 복잡해지고 서버 자원이 더 들기 때문입니다. Google 공식
구글이 대신 권하는 것은 서버 사이드 렌더링, 정적 렌더링, 하이드레이션입니다. 하이드레이션은 서버에서 완성한 HTML을 먼저 내려준 뒤 브라우저에서 자바스크립트를 얹어 동작을 살리는 방식입니다. 처음 응답에 내용이 들어 있으므로 봇도 읽고, 사용자는 원래의 상호작용을 그대로 씁니다. Google 공식
자바스크립트 파일을 robots.txt로 막아 두면 구글도 렌더링하지 못합니다. 차단된 파일에서는 자바스크립트를 실행하지 않기 때문입니다. robots.txt 설정을 손볼 때 함께 확인할 부분입니다. Google 공식
