검색 엔진의 방식으로 페이지의 소스 코드 확인하기

2 분 분량
Wix 사이트는 서버 사이드 렌더링(SSR)을 사용해 페이지의 HTML을 방문자가 브라우저로 보는 버전으로 변환합니다.
SSR은 또한 검색 엔진이 페이지 내 모든 콘텐츠를 크롤링 및 색인 시 이를 더욱 수월하게 만듭니다. 여기에는 페이지의 소스 코드이지만 렌더링된 페이지에서는 표시되지 않는 메타 태그와 같은 유용한 SEO 콘텐츠가 포함됩니다.
브라우저의 설정 내에서 사용자 에이전트를 변경해 검색 엔진의 조회 방식으로 페이지의 소스 코드를 확인할 수 있습니다. 사용자 에이전트는 사용 중인 브라우저를 식별합니다. Googlebot과 같은 웹 크롤러를 사용자 에이전트로 선택하면 봇이 크롤링하는 콘텐츠를 확인할 수 있습니다. 
다음 도움말을 참고하세요.

Google Chrome에서 페이지의 소스 코드 확인하기

Google Chrome의 개발자 도구를 사용해 검색 엔진의 방식으로 페이지의 소스 코드를 확인할 수 있습니다.

Google Chrome으로 소스 코드를 확인하려면:

  1. Google Chrome에서 사이트 내 원하는 페이지를 엽니다.
  2. 페이지의 소스 코드 보기를 엽니다.
    • Windows: 마우스로 페이지를 오른쪽 클릭한 후 페이지 소스 보기를 (또는 소스 보기) 클릭합니다. 또는, 키보드에서 Ctrl + U 키를 누를 수 있습니다.
    • Mac: 키보드에서 Cmd + Option + U를 누릅니다.
  3. 개발자 도구를 엽니다.
    • Windows: 키보드에서 F12 키를 누릅니다.
    • Mac: 키보드에서 Cmd + Option + I를 누릅니다.
  4. 오른쪽 상단의 DevTools 맞춤 설정 및 제어 아이콘을 클릭합니다. 
  5. 도구 더보기에 마우스오버한 후 네트워크 조건을 클릭합니다.
Google Chrome의 개발자 도구에서 추가 도구를 선택하기
  1. 사용자 에이전트 아래에서 브라우저 기본값 사용을 선택 해제합니다.
  2. 드롭다운 메뉴에서 Googlebot을 선택합니다. 
Google Chrome에서 사용자 에이전트로 Googlebot을 선택하기
  1. 페이지를 새로고침합니다.

Safari에서 페이지의 소스 코드 확인하기

Safari의 개발 탭을 사용해 검색 엔진의 방식으로 페이지의 코드를 확인할 수 있습니다.

Safari에서 소스 코드를 확인하려면:

  1. 상단 메뉴에서 Safari를 클릭합니다.
  2. 설정을 선택합니다.
  3. 고급을 선택합니다.
  4. 메뉴 막대에서 개발자용 메뉴 보기 체크 상자를 선택합니다.
메뉴 막대에서 개발자용 메뉴 보기 체크 상자가 선택된 Safari의 설정 패널 스크린샷.
체크 상자를 선택하면 상단 메뉴에 개발자용 탭이 표시됩니다.
A screenshot of a top menu with Develop selected.
  1. Safari에서 사이트 내 원하는 페이지를 엽니다.
  2. 상단 메뉴에서 개발을 클릭합니다.
  3. 사용자 에이전트에 마우스오버합니다.
  4. 하단에서 기타를 선택합니다.
  5. 입력란 내 텍스트를 다음의 텍스트로 변경합니다: Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; Googlebot/2.1; +http://www.google.com/bot.html) Safari/537.36
  6. 확인을 클릭해 확인합니다.

도움이 되었나요?

|