코어 웹 바이탈(Core Web Vitals) 이란? > 자유게시판 1

2021년 5월 구글 검색 결과 페이지(SERP)에 노출되는 웹 페이지들의 사용자 경험을 평가한 결과가 표시되게 하겠다고 발표했습니다.

정확한 알고리즘은 알 수 없지만 사용자 경험을 랭킹 산정 요소 중 하나로 검색 결과에 반영하겠다는 뜻으로 해석할 수 있습니다.

코어 웹 바이탈(Core Web Vitals)

코어 웹 바이탈은 웹페이지 로딩 속도, 모바일 친화성, 웹사이트 보안, 세이프 브라우징, 방해요소 여부 등 웹 콘텐츠 이용자의 사용 경험에 영향을 미치는 측정 가능한 값들 중에서 구글이 중요하다 강조하는 측정 요소들을 의미합니다.

구글이 강조하는 측정요소 아래와 같습니다.

1) LCP(Largest Contentful Pain)

2) FID(First Input Delay)

3) CLS(Cumulative Layout Shift)

1) LCP(Largest Contentful Pain)

LCP는 웹페이지의 로딩 속도에 대한 지표로 <main>이나 <section> 뿐만 아니라 제목, div, 양식 요소 등 텍스트 요소가 포함된 모든 HTML 요소들이 브라우저 화면에 렌더링 완료되는데까지 걸리는 시간의 길이입니다.

LCP는 방문자가 스크롤 하지 않고 볼 수 있는 영역에 한해 이미지, 이미지태그, 비디오 썸네일, 배경이미지, 단락, 머리글, 목록과 같은 텍스트 요소의 로딩 속도만을 계산합니다.

Lighthouse, Chrome DevTools, PageSpeed Insight를 사용해 LCP를 측정할 수 있습니다.

LCP가 4초 이상이면 HTML 요소들을 수정하여 개선해야 합니다.

2) FID(First Input Delay)

웹페이지와 사용자간의 상호 작용에 대한 측정요소입니다.

브라우저는 사용자가 웹페이지에 방문해 로딩중인 상태에서 링크나 버튼을 클릭할때 콘텐츠 요소의 로딩이 완료될 때 까지 받은 요청을 보류합니다. 이때 방문자의 다음 행동이 가능할 때까지의 시간을 FID라고 합니다.

값이 300ms 이상이라면 웹사이트 개선이 필요합니다.

3) CLS(Cumulative Layout Shift)

시각적 안정성에 대한 측정 항목입니다.

방문자가 특정 웹사이트에서 링크를 클릭하려는 순간 레이아웃이 이동해 광고를 클릭하는 경우가 있습니다. 이렇게 갑작스럽게 발생하는 레이아웃 이동의 정도를 합산하여 만든 지표가 CLS입니다.

값이 0.25 이상이면 웹사이트 개선이 필요합니다.