[SEO] Introduction

2023. 4. 30. 09:03Next.js/SEO

1. SEO란?

SEO란 Search Engine Optimization의 약자로, 검색 엔진 결과에서 순위를 높이는 전략을 말한다. 순위가 높아야 트래픽이 증가하므로 비즈니스측면에선 매우 중요하다고 할 수 있다.

 

1.1 SEO의 중요성

SEO는 브랜드 신뢰도와 전환율을 높이는 핵심 요소이다. 여기서 전환율이란 인터넷 마케팅 용어로, 웹사이트를 방문한 사람 중 제작자가 유도한 행위를 한 방문자의 비율을 말한다. 예를 들어, 제작자가 회원가입을 유도했다면 전체 방문자 중 회원가입을 한 사람들의 비율을 말하는 것이다.

 

검색 순위가 높을수록 자연 방문자가 많아지고, 검색 엔진 오가닉 트래픽(Search engine organic traffic)은 다음과 같은 이유로 비즈니스에서 중요하다.

  • 퀄리티 : 방문자가 고객으로 전환될 가능성이 높아짐
  • 신뢰성 : 브랜드나 미션에 대한 신뢰도가 높아짐
  • Low-Cost : 시간과 노력좀 들이는 걸 제외한다면 SEO 높인다고 돈 드는것도 아니고 걍 좋잖아

 

※ Search engine organic traffic : 검색 엔진에서 검색 결과를 클릭해 사이트를 방문한 방문자

NOTE
SEO와 SEMsupSearch Engine Marketing/sup은 다른 개념이다. 

 

1.2 최적화의 세 가지 기둥

웹사이트를 최적화하는 과정은 크게 세 가지로 나눌 수 있다.

  • Technical : 크롤링과 웹 성능을 위한 최적화
  • Creation : 특정 키워드를 타게팅할 수 있는 콘텐츠 전략
  • Popularity : 검색엔진이 신뢰할 수 있는 출처라고 인지하게끔 온라인에서의 존재감 높이기. 이 과정은 백링크를 통해 이뤄진다.

 

SEO 분야는 광범위하고 다양한 측면이 있지만, Next.js 개발자로서 첫 단계로써 모범 사례를 통해 웹 앱을 어떻게 SEO에 적합하도록 만드는지 이해하는 것부터 시작해보자. (개인적으로는 여기를 천천히 읽어보는게 더 도움될거같다. 분량은 많아도 더 정확하고 이해하기 쉽게 돼있는 듯)

 

 

2. 검색 시스템

검색 시스템이란 통상 구글, Bing과 같은 검색 엔진을 칭하는데, 단순해보여도 기술 역사상 가장 큰 문제를 다루는 복잡한 시스템이기도 하다.

 

2.1 검색 시스템의 네 가지 책임

1) 크롤링 : 웹을 탐색하고 사이트내 콘텐츠를 분석하는 프로세스. 3억 5천만개가 넘는 도메인이 존재하므로 매우 방대한 작업이다.

2) 인덱싱(색인) : 크롤링 단계에서 수집한 데이터를 대규모 데이터베이스에 저장함

3) 렌더링 : 페이지의 콘텐츠나 기능들을 활성화하는 리소스(JS같은)들을 실행함. 크롤링되는 모든 페이지마다 수행되는 작업은 아니며, 경우에 따라선 콘텐츠가 인덱싱되기도 전에 수행되기도 함. 작업을 수행하는데 사용할 수 있는 리소스가 없는 경우 인덱싱 후에 렌더링이 발생할 수 있음.

4) 랭킹(순위 매김 작업) : 데이터를 쿼리해 사용자 입력과 유관한 결과 페이지를 생성함. 이 단계에선 유저들의 검색 의도와 맞는 결과를 내놓을 수 있게끔 다양한 기준이 적용됨.

 

사실 말만 들으면 뭔소린가 이해가 안갈 수 있으므로 구글봇이 어떻게 동작하는지 알아보자. 구글봇은 구글의 인터넷 크롤러로, 정보들을 수집하고 방대한 콘텐츠 데이터베이스를 만들어 최상의 검색 결과를 내놓는데 사용된다.

 

 

3. 웹 크롤러

웹 크롤러는 유저를 에뮬레이션하고 웹사이트내 링크들을 탐색해 색인을 생성하는 일종의 봇이다. 말이 좀 어려운데, 구글 검색 센터의 말을 빌리자면 '한 웹페이지에서 다른 웹페이지로 연결되는 링크를 따라가며 웹사이트를 자동으로 검색하는 데 사용되는 프로그램'을 말한다.

 

검색 엔진들은 웹 크롤러로 사이트들을 탐색하고 이를 바탕으로 웹 사이트 검색 결과를 표출시키는데, 구글을 포함한 대부분의 검색 엔진들이 크롤러를 보유하고 있다.

검색 엔진마다 순위 매김 작업과 렌더링에선 약간씩 차이가 있지만, 크롤링과 인덱싱은 대체로 비슷한 방식으로 동작하는 편이므로 이 가이드에선 가장 규모가 큰 구글에 대해 다뤄보고자 한다. 만약 중국이나 러시아, 일본, 한국을 타게팅 중이라면 해당 가이드라인을 참조할 것을 권장한다.

구글은 웹 크롤러를 여러개 보유하고 있지만 주로 사용되는 것들은 Googlebot Desktop과 Googlebot Smartphone이다(Web crawlers identify themselves using custom user-agents)

 

3.1 구글봇 동작 방식

1) URL 찾기

Google Search Console, XMP 사이트맵, 웹사이트간 링크 등 여러 곳에서 URL들을 긁어온다. 

 

2) 크롤링 큐에 추가

구글 봇이 처리할 수 있게끔 URL을 크롤링 큐에 추가한다. 크롤링 큐에 들어간 URL은 통상 몇 초 정도 대기하면 끝이지만 경우에 따라선 며칠이 걸리기도 한다. 에를 들어, 페이지가 렌더링돼야 한다거나 색인, 혹은 (이미 색인된 URL의 경우) 리프레시 작업이 필요한 경우에 말이다.

 

3) HTTP 요청

해더를 가져오기 위해 HTTP request를 날리고, 수신한 상태 코드에 따라 다른 행동을 취한다.

  • 200 : 크롤링 및 HTML 파싱 수행
  • 30x : redirect를 따라감
  • 40x : error를 기록하고 HTML을 로드하지 않음
  • 50x : 상태 코드가 바뀌는지 확인하기 위해 나중에 다시 접속할 수 있음

 

4) 렌더링 큐

검색 시스템의 여러 서비스 및 요소들이 HTML을 처리하고 콘텐츠를 파싱한다. 이 때 만약 페이지에 클라이언트 사이드 JS가 있다면 URL을 렌더링 큐에 집어넣는다. JS를 렌더링하는 작업은 리소스를 많이 잡아먹기 때문에 적은 비율의 페이지만이 렌더링된다.

 

5) 색인 생성 준비 완료

모든 기준이 충족되면 페이지가 색인되어 검색 결과에 표시될 수 있다.

 

지금까지 검색 엔진이 어떻게 돌아가는지에 대해 간단히 알아봤다. 다음 장에서는 좀더 깊이 들어가 검색 엔진의 핵심 요소인 크롤링과 인덱싱, 렌더링과 랭킹(순위 매김)에 대해 자세히 알아보기로 하자.

 

 

 

 

'Next.js > SEO' 카테고리의 다른 글

[SEO] 렌더링과 랭킹  (0) 2023.05.01
[SEO] 크롤링과 인덱싱(색인)  (0) 2023.04.30