요점

JavaScript 콘텐츠도 인덱스 가능하지만 처리 시간과 장애점이 늘어나기 때문에 중요한 공개 내용은 초기 HTML이 견실합니다.

Next.js에서는 Server Components와 정적 생성을 기본으로 하고 대화 부분만을 클라이언트화합니다.

실천 절차

  1. 응답 HTML과 렌더링 후 DOM을 별도로 확인합니다.
  2. metadata, canonical, hreflang을 URL별로 서버 생성한다.
  3. 주요 네비게이션을 <a href>로 설정하고 올바른 HTTP 상태를 반환합니다.
  4. 프로덕션 build에서 JS량, 응답 시간, 실행 에러를 측정한다.

컴퓨터만 클라이언트 로딩하고 설명, 제목 및 관련 링크는 서버 HTML로 전달됩니다.

흔한 오류

  • JavaScript는 일절 색인되지 않는다고 생각한다.
  • 중요 본문을 클릭 후만 표시한다.
  • 404 화면을 200으로 반환합니다.

한계

  • Google 렌더링은 모든 사용자의 기기와 동일하지 않습니다.
  • 한 번의 테스트는 필드 성능이나 인덱스를 보장하지 않습니다.

출처

관련 가이드 및 도구