SEO는 왜 중요한가?

SEO(Search Engine Optimization)는 웹사이트의 가시성을 높이고 검색 엔진에서 쉽게 찾을 수 있도록 최적화하는 프로세스이다. 마케팅 관점에서 주로 다루어지지만, 프론트엔드 개발자로서도 SEO는 매우 중요하다. 프론트엔드 코드는 검색 엔진이 사이트를 이해하고 순위에 반영하는 데 큰 영향을 미치기 때문이다.

SEO의 중요성

SEO는 Zero Moment of Truth(ZMOT)의 일부로, 소비자들이 제품이나 서비스를 구매하기 전에 정보를 찾는 과정이다. ZMOT 중 검색 엔진이 40%를 차지하는 것으로 보았을때, SEO를 고려한 사이트를 구현하는 것은 매우 효과적이며 중요함.

*ZMOT: 제품을 구매하기전 FMOT(오프라인에서 진열된 제품을 살펴보는 순간)보다 더 이전인 자연스럽고 즉각적인 검색의 순간들

검색 엔진의 3가지 구성요소

1. 크롤링(Crawling)

검색 엔진의 크롤러(검색로봇)가 웹페이지를 방문해 콘텐츠를 수집한다.
개발자의 역할: 웹페이지가 크롤링에 최적화되어 있는지 확인해야 한다. 이를 위해 robots.txt 파일과 사이트맵을 제공하여 크롤러가 방문해야 할 페이지를 안내해야한다. 또한, 크롤러가 쉽게 웹페이지를 탐색하도록 HTML 구조를 깔끔하게 유지하고 a태그로 링크를 명확하게 제공하는 것이 중요하다.

2. 인덱싱(Indexing)

크롤러가 수집한 정보를 데이터베이스에 저장하고 키워드와 문서 간의 관계를 분석하여 저장하는 과정. 인덱싱은 단순히 데이터를 저장하는 것을 넘어서, 검색 엔진이 웹페이지의 구조와 콘텐츠를 이해하는 핵심 과정이다.
개발자가 고려해야할 사항:
- 메타 태그 : 검색 엔진이 이 내용을 직접적으로 순위에 반영하지는 않지만, 검색 결과에서 사용자에게 보이는 짧은 설명을 제공한다. 사용자들은 해당 description을 보고 들어 올 수 있기 때문에 클릭률을 높일 수 있도록 페이지의 내용을 잘 요약한 메타 설명을 작성하는 것이 중요하다.
- 사이트맵 : XML 사이트맵은 검색 엔진에 웹사이트의 모든 페이지가 어떻게 구성되어 있는지 알려주는 중요한 도구이다. 사이트맵을 제공함으로써 검색 엔진이 중요한 페이지를 놓치지 않고 크롤링하고 인덱싱할 수 있게 한다. 사이트맵 파일을 Google Search Console에 제출하면 크롤러가 사이트 구조를 더 잘 이해하고 인덱싱 할 수 있다.
- 구조화된 데이터(Schema Markup) : 구조화된 데이터는 페이지의 내용을 검색 엔진이 더 쉽게 이해할 수 있도록 돕는 코드이다. 이를 통해 페이지가 단순한 텍스트나 이미지로만 구성된 것이 아니라, 그 안에 어떤 정보(예: 제품, 리뷰, 레시피 등)가 있는지를 명확히 알릴 수 있다. 이를 사용하면 검색 결과에서 리치 스니펫과 같은 부가 정보를 제공할 수 있어 검색 가시성을 높일 수 있습니다. 예를 들어, 제품 페이지에는 Product, Review 등의 Schema Markup을 적용하면, 검색 결과에서 별점이나 가격 정보와 같은 부가적인 정보가 표시될 수 있다.
```
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Women's Cardigan",
  "image": "https://www.example.com/images/womens-cardigan.jpg",
  "description": "A warm and stylish cardigan for women.",
  "sku": "12345",
  "offers": {
    "@type": "Offer",
    "priceCurrency": "USD",
    "price": "49.99",
    "availability": "https://schema.org/InStock"
  }
}
</script>
```
- 헤드 태그(heading tags)의 올바른 사용: 인덱싱 과정에서 검색 엔진은 헤딩 태그(H1, H2, H3 등)의 구조를 통해 페이지의 중요도를 파악한다. H1 태그는 페이지의 가장 중요한 제목이어야 하며, 페이지 당 하나만 사용하는 것이 원칙이다. 그 아래 H2, H3 등으로 논리적으로 내용을 구분하고, 각 헤딩에 적절한 키워드를 포함하는 것이 좋다.
- 이미지와 미디어 인덱싱: 이미지나 동영상 같은 미디어 파일도 인덱싱될 수 있다. 이를 위해 alt 속성을 정확하게 사용하여 이미지의 내용을 설명하는 것이 중요하다. 이미지에 대한 적절한 텍스트 설명을 추가하면, 검색 엔진이 해당 이미지를 이해하고 이미지 검색 결과에 노출시킬 수 있다.
- URL 최적화: 명확하고 간결한 URL 구조를 사용하고, 가능하면 키워드를 포함하여 검색 엔진과 사용자 모두에게 의미 있는 URL을 작성하는 것이 좋다. 예를 들어, /product/12345보다 /product/womens-cardigan과 같은 형태가 더 이해하기 쉽고 SEO에 유리하다.

3. 랭킹(Ranking)

검색 엔진이 검색 결과에서 웹페이지를 어느 위치에 노출시킬지를 결정하는 과정.
랭킹에 영향을 미치는 주요 요소
- 콘텐츠의 질과 관련성:
  - 검색 엔진은 사용자가 입력한 검색어(쿼리)와 페이지 콘텐츠의 관련성을 분석한다. 이는 페이지가 얼마나 사용자의 의도에 부합하는 정보를 제공하는지를 의미한다.
  - 프론트엔드 개발자는 헤드 태그(heading tags)나 텍스트 콘텐츠에 적절한 키워드를 포함시켜 검색 엔진이 페이지의 주제를 명확하게 이해할 수 있도록 도와야 한다. 또한, 콘텐츠의 구조가 논리적이고 읽기 쉬워야 하며 너무 짧은 글 보다는 글의 양이 좀 있어야 검색엔진이 유용한 내용이라 판단한다.
- 사용자 경험(User Experience, UX):
  - 페이지 로딩 속도: 페이지가 느리게 로딩되면 사용자 이탈률이 높아지며, 이는 랭킹에 부정적인 영향을 미친다. 때문에 프론트엔드 개발자는 이미지 최적화, 코드 압축, 캐싱 등을 통해 로딩 속도를 개선해야 한다.
  - 모바일 최적화: 구글은 모바일 퍼스트 인덱싱(Mobile-First Indexing)을 적용하고 있으며, 모바일 친화적인 웹사이트는 더 높은 랭킹을 받을 가능성이 크다. 따라서 반응형 웹 디자인을 구현하여 다양한 디바이스에서 일관된 사용자 경험을 제공해야 한다.
  - HTTPS: HTTPS가 적용된 사이트는 사용자 데이터를 보호하며, 구글은 이를 중요하게 평가한다.
- 페이지 권위(Page Authority)와 링크 빌딩(Link Building):
  - 검색 엔진은 웹페이지의 신뢰성과 권위를 평가한다.
  - 이때 중요한 역할을 하는 것이 백링크이다. 백링크(Backlink)는 다른 사이트에서 내 사이트로 링크를 걸어주는 것을 말하는데, 신뢰도 높은 사이트에서 내 웹페이지로 연결된 링크가 많을수록 내 페이지의 권위(authority)가 높아지고, 검색 순위도 올라간다.
  - 내부 링크(Internal Links)도 중요한데, 프론트엔드 개발자는 사이트 내에서 관련된 페이지들 간에 적절한 내부 링크를 설정함으로써, 검색 엔진이 사이트의 구조를 더 잘 이해하도록 돕고, 페이지 간의 흐름을 자연스럽게 이어줄 수 있다.
- 콘텐츠 신선도(Freshness):
  - 최신 정보를 제공하는 웹사이트는 검색 결과에서 우선순위를 가질 수 있다. 예를 들어, 뉴스, 블로그, 혹은 자주 업데이트되는 콘텐츠는 검색 엔진에서 더 높은 가치를 부여받는다.
- 사용자 신호(User Signals):
  - CTR: 검색 결과에서 페이지가 몇 번 클릭되는지 나타내는 지표로, 제목과 메타 설명을 매력적으로 작성해 클릭을 유도해야 한다.
  - 체류 시간: 사용자가 해당 페이지에서 얼마나 오랫동안 머무는지로, 이 지표가 높을수록 해당 콘텐츠가 유용하다는 신호로 간주된다.
  - 반송률: 사용자가 페이지를 클릭한 후 다른 페이지로 이동하지 않고 바로 나가는 비율로, 높은 반송률은 부정적인 신호가 될 수 있습니다. 따라서 프론트엔드 개발자는 사용자 인터랙션을 유도하는 디자인과 콘텐츠 흐름을 만들어 사용자 참여를 증가시켜야 한다.
- 키워드 전략:
  - 키워드 플래닝: 구글 키워드 플래너나 네이버 광고 센터와 같은 도구를 사용해 사용자가 자주 검색하는 키워드를 파악할 수 있다. 개발자는 이러한 키워드를 기반으로 콘텐츠를 구조화하고, 페이지 URL, 헤드 태그, 이미지 alt 속성에 적절히 반영해야 한다.
  - 경쟁사 분석: 구글 서치 콘솔과 ahrefs 같은 도구를 사용해 경쟁사에서 사용하는 키워드를 파악하고, 우리 사이트에 들어오는 검색어를 분석하여 전략을 세울 수 있다.