SEO
Search Engine Optimization
웹사이트나 웹페이지를 검색 엔진에서 더 잘 찾을 수 있도록 최적화 하는 과정
웹사이트의 가시성을 높여 더 많은 방문자와 잠재 고객을 유치 가능
SEO가 왜 필요해?
인터넷 사용자가 정보를 찾을 때 주로 검색 엔진을 사용
이때 사용자는 SERP에서 최대 3페이지 정도만 탐색을 하고 이탈
=> 첫 페이지의 검색 이탈율은 거의 92% 가까이 되고 3페이지 까지 보는 사용자는 3.7% 정도...
SEO가 되어있지 않아 상위 랭킹에 없다면 자연검색에서의 기회는 없다고 생각해야...
또한, SEO에 초기 투자만 잘 해두면 지속적인 광고 비용이 들지 않음
SEO를 통해서 내가 홍보하고 싶은 페이지가 상위에 노출된다면 자연스럽게 마케팅이 되겠지
검색 엔진의 동작 원리
검색 엔진은 웹을 끊임없이 돌아다니며 정보를 수집하고 정리하는데, 해당 과정은 크게 세 단계로 분류
- 크롤링 (Crawling) : 검색엔진로봇(크롤러 또는 스파이더)이 웹을 탐색하며 웹페이지 내용을 수집
해당 로봇은 링크를 따라 새 페이지를 발견하고 기존 페이지의 변경 사항을 확인 - 인덱싱 (Indexing) : 크롤링으로 모은 정보를 분석하고 데이터베이스에 이를 저장
해당 과정에서 웹페이지의 내용, 이미지, 비디오 등을 이해하고 분류 - 랭킹 (Ranking) : 사용자가 검색어를 입력하면, 검색 엔진은 인덱싱된 정보 중 가장 관련성 높고 유용한 결과를 찾아 상위에 노출
SEO는 해당 과정에서 내 웹사이트가 더 높은 순위에 노출되도록 최적화 하는 작업
SEO의 종류
SEO는 크게 세 가지 유형으로 구분 가능
기술적 SEO
웹사이트의 기술적 측면을 최적화하여 검색 엔진의 크롤링과 인덱싱을 개선하는 작업
사이트의 로딩 속도 향상, 모바일 친화성 개선, XML 사이트맵, SSL 보안 등이 포함
온페이지 SEO
웹페이지 내부의 콘텐츠와 HTML 소스 코드를 최적화 하는 작업
콘텐츠를 더 관령성 높고 사용자 친화적으로 만드는 것이 목적
메타 태그, 콘텐츠 품질, 이미지 최적화 등이 포함
메타 태그
메타 태그는 웹페이지의 HTML 코드 내에 포함되어 있는 정보로, 웹페이지 자체의 정보를 명시하기 위한 목적으로 사용
메타 태그에는 메타 제목, 메타 설명, 메타 키워드 등이 포함
- Keyworkds : 검색 엔진에 의해 검색되는 단어 지정
- Description : 검색 결과에 표시되는 문자 지정
- robots : 검색 로봇 제어를 통해 검색결과에 표시되지 않도록 하거나 페이지 링크를 표시하지 않는 등의 속성 지정 가능
외에도 Title, Author 등 많은 태그들이 존재
콘텐츠 품질
구글은 사용자 경험을 매우 중요하게 여기며 사용자가 링크를 클릭한 후 얼마나 오래 머무르는지 등을 분석
=> 사용자에게 가치있는 정보를 제공하는 콘텐츠를 제작해야...!
타겟 사용자의 검색 키워드를 적절히 사용해서 검색 엔진이 콘텐츠의 주제를 쉽게 이해할 수 있도록 하고,
멀티미디어를 활용하여 콘텐츠의 가치를 높이는 것도 중요
오프페이지 SEO
웹사이트 외부 요소를 최적화 하는 것으로, 주로 백링크 구축에 중점
백링크
백링크는 다른 웹사이트에서 해당 웹사이트로 연결되는 링크
=> 다른 사이트가 해당 사이트의 콘텐츠를 추천하는 것과 같아서 검색엔진이 이를 신뢰도의 지표로 간주
=> 양질의 백링크가 많을 수록 검색 순위가 높아지겠네..!
신뢰할 수 있는 웹사이트나 관련성이 높은 웹사이트, 트레픽이 많은 웹사이트에서 오는 백링크일수록 검색 순위 상승에 도움
SPA에서의 SEO
SPA의 단점 중 하나가 검색 엔진 최적화가 어렵다는 것
SPA가 기억이 나지 않는다면? SPA
검색엔진의 크롤러는 링크를 타고 페이지를 돌아다니며 웹 문서를 읽고, 해당 작업을 통해 URL의 페이지마다 색인을 만듦
=> SPA는 여러 뷰를 가지고 있어도 URL이 하나, 한 개의 페이지로 색인
=> 다양한 페이지 뷰가 단일 Meta data로 보인다
SPA는 페이지의 뷰가 변화해도 타이틀과 디스크립션을 바꿀 수 없기 때문에 사용자 경험 개선 및 검색엔진의 최적화가 어렵다
해결방안
SSR
사이트 구축 전 SEO 구축이 필요한 상황이라면 SPA를 SSR 방식으로 구축
SSR이 기억나지 않는다면? SSR
SPA는 기본적으로 CSR 방식으로 구현되지만 사실 SSR 방식으로 구현하는 것이 SEO 관점에서 적합
history API 활용
사이트 내에서 유저가 이동한 기록을 남겨주는 기능
해당 API의 메서드 중 하나인 pushState를 활용하면 url을 변경 가능
해당 방법을 이용하면 SPA를 사용해도 여러 페이지를 가진 것처럼 검색 엔진에 표시 가능
이는 크롤링 뿐만 아니라 백링크를 얻기 용이하게 되었다는 장점도 있음
XML 사이트맵 웹사이트에서 검색 엔진에 색인할 모든 페이지를 나열한 XML 파일로, 색인 되어야 할 모든 페이지의 목록을 제공함으로써 검색엔진 크롤러가 발견하기 어려운 페이지도 문제없이 크롤링 되고 색인될 수 있게 돕는 파일
'FE Study' 카테고리의 다른 글
| [FE] Polling / Long Polling / SSE / WebSockets (0) | 2024.08.27 |
|---|---|
| Nginx (0) | 2024.08.24 |
| [FE] webpack vs vite (0) | 2024.08.16 |
| [FE] JavaScript에서의 Class (0) | 2024.08.16 |
| [FE] JavaScript에서의 프로토타입(Prototype) (0) | 2024.08.09 |