[ 살펴보기 ] SEO

Google Search Engine

Google search engine은 web crawler 또는 googlebot이라고 software를 통해 web에 존재하는 page를 찾고 방문하며 ( crawling ) 그 내용을 google search를 위한 database에 저장한다. ( indexing ) 그렇기에 google search를 통해 결과로 나오는 page들은 page 관리자가 직접 google에 등록한 것이 아닌 google의 web crawler가 web에 존재하는 page들을 방문하며 index된 page들이다.

Crawling

Internet에 존재하는 web page는 하나의 저장소에 저장되어 있는 것이 아니므로 google은 계속해서 internet에서 새로운 page와 변경된 page를 찾아 다니며 “known pages”라는 list에 새로 발견한 page를 추가하는데 이 과정을 “URL discovoery”라고 한다.

그런 다음 google은 발견한 page의 내용을 파악하기 위해 해당 page를 방문하는데 ( crawl ) 이러한 작업을 하는 program을 googlebot 또는 crawler라고 한다. ( 또는 robot, bot, spider라고도 한다 )

하지만 googlebot이 URL discovery 과정에서 발견한 모든 page를 crawl하는 것은 아니다. site의 특정 page가 site 관리자에 의해 crawling이 금지되거나 login을 통해 제공되는 page는 googlebot이 crawling 하지 못한다. Googlebot은 crawling 과정에서 방문한 page를 render하고 render중 발견한 javascript 역시 실행한다. 즉, 사람이 아닌 bot에 의해 운영되는 browser라고 생각할 수도 있다. Crawling issue가 발생할 수 있는 경우는 다음 documentation을 통해 확인할 수 있다. ( Reference - Crawling )

Indexing

Googlebot는 특정 page를 crawl하고 page의 content를 분석한 다음 page 정보를 google이 관리하는 database에 저장하는데 이 과정을 indexing이라고 한다. Indexing 과정에서 page의 text content나 image의 alt attribute, meta tag와 같은 attribute 등 여러가지 요소가 분석된다.

Crawling한 page를 분석하여 해당 page가 index될 수 있는 적절한 page라고 판단되면 google은 해당 페이지가 다른 페이지와 동일한 페이지인지 혹은 유사한 페이지인지 파악한다. Google은 동일하거나 유사한 page끼리 모아 duplicate cluster를 구성하는데 그 중 duplicate cluster의 대표가 될 수 있는 page가 canonical로 선정되며 canonical로 선정되지 않는 duplicate cluster의 다른 page는 alternate version으로 분류된다.

주의할 점은 googlebot이 crawl하고 분석한 모든 page가 모두 index되지는 않는다. page의 quality가 낮거나 robot.txt에 의해 index가 거부되는 등의 경우 page를 index하지 않는다. Index issue가 발생할 수 있는 경우는 다음 documentation을 통해 확인할 수 있다 ( Reference - Indexing )

Search result

user가 google을 통해 특정 정보를 search할 때 google은 index database에서 user가 search한 내용에 가장 적합하다고 판단되는 결과들을 찾고 ranking이라는 절차를 통해 user에게 보여지는 search result의 순서가 정해진다. search result ranking에는 page content가 얼마나 user search query와 연관이 있는지 뿐만 아니라 현재 user의 위치, 언어, decive ( pc, mobile )등 수 많은 요소가 영향을 준다.

Sitemap

Sitemap이란 특정 site가 가진 page들의 정보를 모아둔 file을 말한다. 필수 사항은 아니지만 google과 같은 search engine이 해당 site를 발견하고 보다 효율적으로 crawling 할 수 있게 도와준다. Sitemap으로 사용할 수 있는 format은 여러 개가 있지만 대부분 아래와 같은 XML 형식으로 관리된다.

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://www.example.com/</loc>
    <lastmod>2025-01-09</lastmod>
  </url>
  <url>
    <loc>https://www.example.com/about</loc>
    <lastmod>2025-01-01</lastmod>
  </url>
  <url>
    <loc>https://www.example.com/blog</loc>
    <lastmod>2025-01-07</lastmod>
  </url>
  <url>
    <loc>https://www.example.com/blog/learn-react</loc>
    <lastmod>2025-01-08</lastmod>
  </url>
</urlset>

위의 예제는 home, about, blog, blog/learn-react page로 구성된 site의 sitemap의 예제다.위의 예제에서 사용된 tag는 다음과 같다.

urlset : sitemap의 root element다.
url : 특정 url에 대한 상세정보를 포함한다.
loc : page의 url을 나타낸다.
lastmod : page가 수정된 마지막 날짜를 나타낸다.

위에서 사용된 tag외에도 sitemap에서 사용할 수 있는 tag는 존재한다. 다만 Google은 priority와 changefreg tag가 있더라도 무시한다는 점을 기억하자.

Sitemap file의 최대 크기 제한은 50MB이며 50,000개 URLs 까지 정의할 수 있으므로 주의하자. 만약 이보다 더 많은 URLs을 정의 해야 한다면 여러 개의 sitemap으로 분리해야 관리해야 한다.

위에서 언급 했듯이 sitemap은 필수 사항은 아니며 google에선 다음과 같은 상황에선 sitemap이 필요하지 않을 수도 있다고 말한다. ( Reference - Do I need a sitemap? )

많은 page를 가지지 않는 site일 때 : 여기서 많은 page란 500page 이상을 말한다.
site를 구성하는 page 사이를 이동하기 위한 내부 link가 잘 구성되어 있다.

하지만 site를 구성하는 page양이 방대하거나 새로 배포하는 site라면 sitemap이 googlebot이 해당 site를 발견하는데 도움이 될 수 있다.

Site를 구성하는 page가 몇 개 안된다면 직접 작성해도 무방하지만 page 숫자가 많다면 자동으로 생성하는 방법을 사용하는 것이 좋다. Sitemap을 자동 생성하는 방법은 다양하지만 그 방법 중 하나로 XML-Sitemaps와 같은 사이트를 사용해 생성할 수 있다.

또한 생성한 sitemap을 google, bing과 같은 search engine에 제출 하는 것이 권장되지만 sitemap을 제출 하는 것이 crawling과 indexing을 100% 보장하지는 않는다. Google은 Google Search Console을 통해 sitemap을 제출할 수 있으며 search engine마다 sitemap을 제출하는 방법은 다르므로 관련 정보는 별도로 찾아 보도록 하자.

또한 sitemap을 배포한 application directory에도 추가한다면 application root directory에 추가하도록 하자. 그리고 robots.txt file에 root directory에 위치한 sitemap location을 url 형식으로 명시해준다. ( robots.txt는 아래에서 추가로 살펴본다 )

robots.txt

Sitemap: https://www.example.com/sitemap.xml

Robot.txt

robot.txt 파일을 통해 site의 어떤 page를 googlebot과 같은 crawler의 crawling을 허용하거나 허용하지 않을 것인지 등 search engine에 전달할 수 있는 추가적인 정보를 설정할 수 있다. robot.txt file을 배포된 appliation directory의 root 위치에 있어야 하며 다음과 같이 원하는 rule을 명시해준다.

robot.txt

User-agent: Googlebot
Disallow: /admin/

User-agent: *
Allow: /

Sitemap: https://test.com/sitemap.xml

위의 robot.txt 예제는 다음 세 가지 사항을 명시하고 있다.

user agent가 Googlebot이면 URL path가 /admin/으로 시작하는 page에 대해선 crawling을 허용하지 않는다. ( ex- https://test.com/admin/ )
그 다음 다른 모든 user agent는 site의 모든 page를 crawling할 수 있다. default로 모든 user agent가 사이트의 모든 page를 crawling할 수 있으므로 User-agent:*로 시작하는 두 번째 section은 생략해도 무방하다.
마지막으로 site의 sitemap의 경로를 명시하여 search engine에게 sitemap의 위치를 알려준다.

robot.txt는 위의 예제와 같이 하나 또는 여러 개의 group으로 구성될 수 있으며 각 group은 User-agent directive로 시작한다. 각 group에선 다음과 같은 정보를 명시할 수 있다.

group을 적용할 user agent.
user agent에 접근을 허용할 directory나 파일.
user agent에 접근을 허용하지 않을 directory나 파일.

Crawler는 robot.txt을 상단부터 하단으로 해석하며 각 group에 명시된 user-agent 중 가장 일치하는 group의 rule ( directive )를 따른다. 예를 들어 위의 예제 코드를 기준으로 현재 site를 crawling하려는 crawler가 googlebot이라면 첫 번째 group에 명시된 rule이 적용된다.

각 directive에 설정된 값은 대소문자를 구분한다. 만약 Disallow: /admin.html라는 rule이 명시되어 있다면 해당 rule은 https://test.com/admin.html 에는 적용되지만 https://test.com/ADMIN.html에는 적용되지 않는다.

Googlebot이 지원하는 robot.txt rules은 다음과 같다.

User-agent : rule을 적용할 search engine crawler의 이름을 설정한다. 위에서 언급 했듯이 User-agent rule ( directive )과 Allow, Disallow와 같은 rule을 통해 하나의 group이 형성된다.
Disallow : Crawling을 허용하지 않을 directory나 page를 명시한다. 특정 page를 명시할 경우 경로가 /로 시작해야 하며 ( ex - Disallow: /admin.html ) 특정 directory를 명시할 때는 경로가 /로 시작해 /로 끝나야 한다 ( ex - Disallow: /admin/ )
Allow : Crawling을 허용할 directory나 page를 명시한다. 같은 group에서 Disallow rule에 적용된 directory 내부의 일부 페이지 또는 directory에 Allow rule을 적용하여 rule을 override할 수도 있다.
Sitemap : Site의 sitemap의 경로를 설정한다. Sitemap의 경로는 full URL 형식으로 설정한다. ( ex - Sitemap: https://test.com/sitemap.xml )

또한 robot.txt에 Googltbot이 지원하는 rules이 아닌 line이 있을 경우 해당 line은 무시된다. 다음은 google search documentation에서 제공하는 robot.txt 예제 중 일부다. ( Reference - Useful robots.txt rules )

사이트의 모든 페이지에 대해 crawling을 허용하지 않는다.

User-agent: *
Disallow: /

특정 directory와 directory contents에 대해 crawling을 허용하지 않는다.

User-agent: *
Disallow: /calendar/
Disallow: /junk/
Disallow: /books/fiction/contemporary/

Googlebot-news crawler에게만 crawling을 허용한다.

User-agent: Googlebot-news
Allow: /

User-agent: *
Disallow: /

특정 페이지에 대한 crawling을 허용하지 않는다. 예를 들어 아래 예제는 https://example.com/useless_file.html과 https://example.com/junk/other_useless_file.html 파일에 대한 crawling을 허용하지 않는다.

User-agent: *
Disallow: /useless_file.html
Disallow: /junk/other_useless_file.html

public directory에 있는 resource에 대해서만 crawling을 허용한다.

User-agent: *
Disallow: /
Allow: /public/

Limitation of robots.txt

robot.txt를 통해 특정 page를 disallow 처리를 했다고 해서 해당 page가 search engine에 의해 index 되지 않도록 보장해주지는 않는다. 이렇듯 robot.txt를 통해 search engine을 제어 하는 것에도 limitation이 있으며 대표적인 limitation은 다음과 같다.

모든 search engine이 robot.txt rule을 지원하지 않을 수 있다. Googlebot은 robot.txt의 rule을 따르지만 다른 search engine은 robot.txt에 설정한 rule을 따르지 않을 수도 있다.
robot.txt를 통해 disallow 처리한 page가 다른 사이트 혹은 page의 link를 통해 여전히 search engine에 의해 index될 수도 있다. Googlebot이 특정 site를 crawling할 때 robot.txt에 설정된 disallow page를 crawl하지는 않지만 다른 site 혹은 page의 link 정보를 통해 robot.txt에서 disallow 처리된 page와 연결되는 상황이라면 search engine이 해당 page는 crawl하고 index처리 할 수도 있다. 만약 특정 page가 index되는 것을 막고자 한다면 noindex meta tag를 사용하는 방법이 있다.

noindex

위에서 언급했듯이 robot.txt를 통해 특정 페이지 또는 사이트에 대한 crawling을 허용하지 않도록 명시하더라도 여전히 search engine에 의해 index될 수 있다. 사이트 혹은 특정 페이지가 index되지 않게 막기 위해서는 robot.txt외에 추가적인 조치가 필요하며 이 때 noindex rule을 사용할 수 있다.

특정 page에 noindex rule을 적용하는 방법에는 두 가지가 있다. 하나는 noindex meta tag를 이용하는 방법과 HTTP response header를 이용하는 방법이다. 우선 meta tag를 사용하는 방법을 살펴보자.

meta tag를 통해 search engine이 특정 page를 index 하지 못하게 처리하려면 다음 meta tag를 page html <head> section에 추가한다.

<!DOCTYPE html>
<html>
  <head>
    <meta name="robots" content="noindex">
    ...
  </head>
  <body>
    ...
  </body>
</html>

혹은 googlebot만 index를 하지 못하게 막고 싶다면 다음과 같이 googlebot을 name에 명시해준다.

<!DOCTYPE html>
<html>
  <head>
    <meta name="googlebot" content="noindex">
    ...
  </head>
  <body>
    ...
  </body>
</html>

반면 HTTP response header를 통해 search engine이 특정 page를 index하지 못하게 처리하고자 한다면 다음과 같이 response header에 X-Robots-Tag header를 noindex로 설정한다.

HTTP/1.1 200 OK
X-Robots-Tag: noindex
(...)

noindex를 사용할 때 주의할 점은 noindex rule을 적용하는 page는 robot.txt에 의해 block되어선 안되는 것이 좋다. robot.txt에 의해 noindex rule이 적용된 page가 block되면 crawler가 해당 페이지에 접근하지 않으므로 noindex rule의 적용 여부를 확인하지 못할 수도 있다.

또한 Google과 같이 대표적인 search engine은 noindex rule을 지원하지만 모든 search engine이 noindex rule을 지원하지 않을 수도 있으므로 주의하자. 그리고 <meta name="robots" content="noindex"> meta tag는 search engine crawler에 적용이 되므로 search engine과는 다른 종류의 crawler를 block하고자 한다면 다음과 같이 block하고자 하는 crawler를 직접 명시해준다. <meta name="AdsBot-Google" content="noindex">

robot meta tag의 content에는 noindex 외에 다른 값 역시 설정할 수 있다. robot meta tag의 content에 설정할 수 있는 값 중 일부는 다음과 같다.

nofollow : search engine이 해당 page에 있는 link를 타고 다른 page로 이동하지 않도록 한다.
nosnippet : search result에 해당 page의 text snippet이나 video preview가 보이지 않도록 한다.
indexifembedded : noindex가 적용된 page일지라도 해당 page가 다른 page에서 iframe으로 embed되었을 때 index를 허용한다. noindex rule과 함께 사용될 때만 효과가 있다.
notranslate : search result에 해당 page에 대한 translation을 제공하지 않는다.

위의 설정 값 외에 설정할 수 있는 값 list는 다음 documentation에서 확인할 수 있다. ( Reference - Valid indexing and serving rules )

여러개의 robots meta rule을 적용할 때는 다음과 같이 comma를 통해 적용하거나 여러 개의 meta tag를 사용해서 적용할 수 있다.

<meta name="robots" content="noindex, nofollow">

위의 예제를 아래와 같이 여러 개의 meta tag로 적용해도 무방하다.

<meta name="robots" content="noindex">
<meta name="robots" content="nofollow">

Common meta tags

html page에 사용할 수 있는 meta tag의 종류는 매우 다양하며 그 역할도 다르다. 다양한 meta tag 중 흔히 사용되는 meta tag를 살펴보자.

description : page에 대한 설명과 정보를 제공할 때 사용된다. 보통 search engine의 search 결과에 포함되어 나온다.
```
  <meta name="description" content="A summary of the webpage content" />
```
viewport : viewport tag를 통해 mobile에서 page를 어떻게 render할지 명시할 수 있으며 search engine이 해당 tag를 통해 crawling하는 page가 mobile-friendly page인지 판단할 때 사용되기도 한다.
```
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
```
canonical : site에 동일한 내용 또는 유사한 내용을 가진 url이 여러 개 존재할 때 특정 page의 url을 canonical url로 설정하여 해당 page는 crawling하는 search engine에게 알릴 수 있다.
```
  <link rel="canonical" href="https://www.test.com/my-order-list" />
```
charset : html page의 character encoding을 설정한다.
```
  <meta charset="UTF-8" />
```

author : html page의 author 정보를 명시한다.

  <meta name="author" content="Creator Name or Company Name" />

open graph : Facebook, Kakao와 같은 social media에서 page의 link를 share할 때 보이는 site 정보의 형태를 설정한다.

  <meta property="og:title" content="Page Title" />
  <meta property="og:description" content="page description" />
  <meta property="og:image" content="https://www.test.com/image.jpg" />
  <meta property="og:url" content="https://www.test.com/page" />
  <meta property="og:type" content="website" />

twitter ( X ) : 다른 social media와는 다르게 twitter에서는 open graph tag 대신 twitter tag를 통해 twitter ( X )에서 page link를 share할 때 보이는 정보의 형태를 설정할 수 있다.

  <meta name="twitter:card" content="summary_large_image" />
  <meta name="twitter:title" content="Page Title" />
  <meta name="twitter:description" content="page description" />
  <meta name="twitter:image" content="https://www.example.com/image.jpg" />

[ 살펴보기 ] SEO - Basics