구글 및 AI 검색은 자바스크립트 전용 가격 페이지를 읽을 수 있을까?

구글 및 AI 검색은 자바스크립트 전용 가격 페이지를 읽을 수 있을까?

구글은 자바스크립트 전용 가격 페이지를 읽을 수 있지만, 여전히 페이지의 초기 HTML에 요금제 이름, 가격 및 주요 제한 사항을 포함해야 합니다. 구글의 렌더링은 지연되거나 불완전할 수 있으며, 구글은 모든 봇이 자바스크립트를 실행할 수 있는 것은 아니라고 경고합니다.

구글이 자바스크립트를 실행할 수 없다는 것이 위험은 아닙니다.

구글은 최신 버전의 Chromium을 사용하여 자바스크립트를 렌더링합니다. 하지만 페이지를 단계별로 처리합니다. 먼저 페이지를 가져오고, 렌더링한 다음, 렌더링된 콘텐츠를 색인화에 사용합니다. 구글은 페이지가 렌더링 대기열에서 몇 초 또는 그 이상 기다릴 수 있다고 말합니다. 스크립트나 페이지 리소스가 차단되거나 스크립트가 가격 정보를 로드하지 못하면 구글은 귀하의 브라우저에서 보는 콘텐츠를 보지 못할 수 있습니다. 구글의 자바스크립트 SEO 가이드와 자바스크립트 문제 해결 가이드는 이러한 한계를 설명합니다. (developers.google.com)

이는 비즈니스 위험을 초래합니다. 귀하의 가격 페이지는 방문자에게는 완전하게 보이지만, 크롤러에게는 빈 껍데기나 불완전한 요금제 정보를 제공할 수 있습니다. 구글의 렌더링된 버전에서 가격이나 사용량 제한이 누락되면, 구글은 해당 누락된 콘텐츠를 색인화할 수 없다고 말합니다. 구글의 AI 기능 또한 페이지가 색인화되고 중요한 콘텐츠가 텍스트로 제공되는 것을 포함하여 동일한 핵심 SEO 기반에 의존합니다. (developers.google.com)

AI 검색은 하나의 렌더링 설정에 의존하지 말아야 할 또 다른 이유를 추가합니다. 구글은 일부 봇이 자바스크립트를 실행할 수 없다고 말하는 반면, OpenAI는 ChatGPT 검색에서 웹사이트를 표시하는 데 사용되는 크롤러로 OAI-SearchBot을 식별합니다. 모든 검색 시스템이 고객의 브라우저와 동일한 방식으로 페이지를 본다고 가정하지 마십시오. 구글의 자바스크립트 SEO 가이드 OpenAI의 크롤러 문서. (developers.google.com)

해결책 순위: 초기 HTML이 승리합니다.

1. 최고: 요금제 이름, 가격, 청구 조건 및 주요 제한 사항을 초기 HTML에 포함합니다. 페이지는 브라우저가 자바스크립트를 실행하기 전에 이러한 정보를 보내야 합니다.
2. 다음: 자바스크립트를 상호작용에 사용합니다. 월간/연간 전환 토글 또는 가입 버튼과 같은 기능을 처리하도록 합니다.
3. 브라우저 확인에만 의존하지 마십시오. 노트북에서 가격을 보는 것은 브라우저가 해당 가격을 로드했음을 증명합니다. 이는 구글이나 다른 크롤러가 무엇을 받았는지 보여주지 않습니다.

이 접근 방식은 많은 SaaS 사이트를 위한 작고 집중적인 수정 사항입니다. 모든 페이지를 다시 만들거나 특별한 "AI" 마크업을 추가할 필요가 없습니다. 구글은 자사의 AI 기능에 추가적인 기술 요구 사항이나 특별한 스키마가 없다고 말합니다. 구글의 지침은 동일한 SEO 기본 사항을 따르고 중요한 콘텐츠를 텍스트로 제공하는 것입니다. 구글의 AI 기능 가이드. (developers.google.com)

세 가지 요금제 페이지: 금전적, 시간적 위험

3인 SaaS 기업이 30페이지짜리 마케팅 사이트를 가지고 있다고 가정해 봅시다. 검색 콘솔에 따르면 해당 가격 페이지는 월 120건의 유기적 클릭을 얻습니다. 이 페이지는 자바스크립트가 실행된 후에야 세 가지 요금제를 표시합니다.

이것은 예시 가격과 제한 사항입니다. 실제 제안을 사용하십시오. 요점은 페이지가 스크립트 실행 후에 그리는 것이 아니라 텍스트로 해당 세부 정보를 노출해야 한다는 것입니다. 크롤러가 49달러 팀 요금제 또는 5사용자 제한을 놓친다면, 해당 가격이나 제한에 대한 검색에 페이지를 충분히 일치시키지 못할 수 있습니다. 이는 검색 가능성 위험이며, 누락된 가격이 순위 하락을 보장한다는 주장은 아닙니다.

다음은 간단한 비용 확인입니다. 49달러 요금제를 선택했을 고객 한 명이 해당 요금제를 찾거나 이해하지 못한다면, 12개월 동안 588달러의 구독 매출 손실이 발생합니다. 이는 산술적인 계산이지 예측이 아닙니다. 구현 예산 샘플로, 창업자가 정확한 요금제 문구를 확인하는 데 30분, 페이지 변경 및 확인을 위해 두 개발자 시간을 할애하십시오. 시간당 100달러의 내부 개발자 비용을 가정하면, 시간으로 환산하여 200달러입니다.

이 수정 사항은 모든 30페이지가 아니라 하나의 가격 페이지에 적용됩니다. 이 예시에서는 합리적인 작업입니다. 실제 제안을 첫 번째 응답에 넣은 다음, 자바스크립트가 상호작용 부분을 추가하도록 합니다.

한 문장으로 개발자에게 인수인계

서버가 페이지의 첫 번째 응답에서 요금제 이름, 가격, 청구 조건 및 주요 제한 사항을 보내도록 하여 브라우저가 자바스크립트를 실행하기 전에 해당 정보가 존재하도록 해주세요.

고객과 크롤러에게 상충되는 가격 정보가 제공되지 않도록 보이는 페이지와 초기 HTML에 동일한 정보를 유지하십시오.

구글 서치 콘솔에서 렌더링된 페이지 확인하기

이번 주에 서치 콘솔에서 가격 페이지 URL을 검사하십시오.

1. 서치 콘솔 검색창에 전체 가격 페이지 URL을 붙여넣습니다.
2. 실시간 URL 테스트를 클릭합니다.
3. 테스트된 페이지 보기를 클릭합니다.
4. HTML 탭을 열고 각 요금제 이름, 가격, 청구 기간 및 주요 제한 사항을 검색합니다.

구글의 도움말 가이드는 테스트된 페이지 보기가 렌더링된 HTML을 보여준다고 확인합니다. 실시간 테스트는 렌더링된 페이지의 스크린샷도 보여줄 수 있습니다. 렌더링된 소스 보기에 대한 구글 지침. (support.google.com)

스크린샷에 카드들이 보이지만 HTML에 텍스트가 누락되어 있다면, 해당 페이지는 초기 HTML 수정이 필요합니다. 렌더링된 HTML에 세 가지 요금제와 그 조건이 모두 포함되어 있다면, 구글은 해당 테스트에서 이러한 세부 정보를 볼 수 있습니다. 이는 구글의 렌더링을 확인하는 것이지, 모든 AI 크롤러가 페이지를 어떻게 처리할지를 알려주지는 않습니다.

정확한 가격 게시를 건너뛰어야 하는 경우: 의도적으로 맞춤형 가격이 책정된 엔터프라이즈 요금제만 판매하는 SaaS 기업. 대신 초기 HTML에 "맞춤 가격"과 명확한 영업 문의 경로를 넣으십시오.

**이번 주에 다음 행동: 가격 페이지에서 URL 검사를 실행하고 렌더링된 HTML에서 세 가지 요금제 이름, 가격 및 제한 사항을 모두 검색하십시오.