[ASAC 6기] 웹 검색 엔진과 SEO

우리가 웹 페이지에서 정보를 찾고 싶으면 주소창에 도메인 네임(IP주소)를 직접 입력해서 정보를 찾는가?

우리는 검색창에 우리가 원하는 정보를 단어나 문장으로 검색창에 입력한다. (`naver.com`을 검색하지 않고 `네이버`라고 입력한다)

 

검색창에 원하는 정보를 입력하면 내가 원하는 정보를 쫘라락 나열해준다.

 

이렇게 무언가 나 대신 모든 웹 서버의 웹 페이지들을 미리 다 찾아 놓고, 분류 및 정리한 뒤에 내 검색어에 따라 그에 적합한 웹 페이지들만 골라 전달해준다.

• 무언가: 구글, 네이버, 다음과 같은 서비스(검색 엔진)
• 다 찾아놓고: 웹 크롤링(세계 모든 웹 서버의 웹 페이지 정보 수집)
• 분류 및 정리한 뒤: 인덱싱(앞성 수집한 전체 웹 페이지들을 상관관계별로 분류)
• 내 검색어에 따라 그에 적합한 웹 페이지들만 골라 전달: 검색 엔진(검색 결과 반환)

 

✅검색 엔진

검색어와 검색 결과의 연관성이 구글같은 검색 엔진을 사용하는 고객들의 만족도 및 검색 엔진의 사명

 

많은 웹 페이지 속에서 내 웹 페이지를 관심있는 사람들이 검색했을 때 적절하게 노출시키는 방법은 검색시 상위 노출 전략(SEO; Search Engine Optimization)을 사용하는 것이다.

 

✅SEO(Search Engine Optimization)

웹사이트가 검색 결과에 더 잘 보이도록 최적화하는 과정. 검색 순위 개선이라고도 한다.

 

고객 입장에서 생각해보면, 검색해서 노출된 페이지에 들어갔을 때 웹 페이지 내 내용도 좋아야하고, 이벤트 및 페이지 이동 성능도 좋아야 고객이 만족할 것이다. 아래와 같은 요소가 SEO에 중요하게 작용한다.

🔹좋은 내용 
🔹Semantic HTML
🔹키워드 및 메타 태그
🔹성능 Perfomance Metrics
🔹웹 접근성

 

🔷Semantic HTML이란?

    HTML 태그를 잘 활용하여 사용한 것을 말함.

 

🔷웹 페이지 성능 Perfomance Metrics: Core Web Vital

웹 페이지 성능은 클라이언트 개발자 측에서 많이 신경써야하는 부분이다. 1, 2초 딜레이로 인해 엄청난 손해를 볼 수도 있기 때문에...

 

웹 페이지 성능 측정요소는 아래와 같다.

🔹Load Time
🔹FCP(First Comtentful Paint): 웹 페이지 내 가장 첫 의미있는 정보가 보여지는 순간까지의 시간
🔹LCP(Larest Contentful Paint): 웹 페이지 내 가장 큰 의미있는 정보가 보여지는 순간까지의 시간
🔹TBT(Total Blocking Time): 동기 실해 시 멈춘 시간들
🔹TTI(Time To Interactive): JS가 모두 동작 가능한 상태로 준비 완료되기까지의 시간. (TTI완료된 바로 다음에 FCP)
🔹FID(First Input Delay): 이벤트 버튼 등을 누르고 그 이벤트 반영이 시작하기까지의 지연 시간

 

 

위키페이지의 Lighthouse 점수를 보면서하면서 웹 페이지 성능을 확인해보자

위 사진처럼 웹 페이지 성능을 확인할 수 있다.

 

🔷TTI란

HTML과 CSS 파일이 로드되는 시간과 JS가 로드뢰는 시간이 다르므로 TTI가 발생하는 이유이다.

 

TTI가 중요한 이유가 뭘까?

만약 TTI문제로 갑자기 새로운 페이지나 버튼이 튀어나와서 유저가 의도하지 않은 작업을 할 수도 있다. 이를 방지하기 위해 스켈레톤이라는 걸 사용한다. 

스켈레톤 로딩 사용

 

스켈레톤 관련해서 검색하다가 이 블로그를 보게 되었다. 스켈레톤 화면이 사용자 경험에 도움이 되는가에 대한 글이다.

그럼 스켈레톤 화면을 노출하는게 무조건 좋은것인가? 로딩이 오래 걸리면 사용하는게 사용자 입장에선 덜 지루하지 않을까? 싶다.

---

ref

• https://developer.mozilla.org/ko/docs/Glossary/SEO