구글 코어 웹 바이탈이란 무엇인가

구글 코어 웹 바이탈이란?

구글 코어 웹 바이탈(Core Web Vitals)은 웹사이트의 실제 사용자의 로딩 속도를 빠르게 해 우수한 사용자 경험을 제공하기 위해 필수적인 메트릭스로, 비슷한 콘텐츠가 있을 경우 코어바이털이 좋은 페이지가 검색에 좀 더 노출됩니다

코어 웹 바이탈은 직접적인 구글 랭킹 요소는 아닙니다만 장기적으로는 긍정적인 신호라고 볼수 있습니다. 검색 랭킹 중 가장 중요한 것은 탁월한 콘텐츠라고 봐야 할 것입니다

• LCP(최대 콘텐츠 페인트): 페이지에서 가장 크게 보이는 요소를 렌더링하는 데 걸리는 시간
• CLS(누적 레이아웃 이동): 페이지 로드 중 페이지 UI가 이동하는 정도
• INP(다음 페인트에 대한 상호작용): 페이지가 사용자 상호작용에 응답하는 데 걸리는 시간(2024년 3월 이후 구성 요소 아님)

※ FID(첫 입력 지연): 페이지가 사용자 작업에 반응하기 시작하는 데 걸리는 시간. 2024년 3월부터 INP가 대체함

※100 밀리초는 0.1초. 1 밀리초는 1천분의 1초

LCP : 최대 콘텐츠 렌더링 시간

• LCP(Largest contentful paint, 최대 콘텐츠 렌더링 시간): 사용자가 URL을 요청한 시점부터 표시 영역에 가장 큰 시각 콘텐츠 요소를 렌더링하는 데 걸린 시간입니다. 가장 큰 요소는 일반적으로 이미지 또는 동영상이거나 큰 블록 수준의 텍스트 요소입니다. 이 측정항목은 방문자가 URL이 실제로 로드되는 것을 확인하는 속도를 표시하므로 중요합니다.
• 보고서에 표시된 그룹 LCP란 그룹에 포함된 URL 방문수의 75%가 LCP 상태에 도달하기까지 걸린 시간입니다.

CLS(누적 레이아웃 이동)

• CLS(Cumulative Layout Shift)는 페이지의 전체 수명 동안 발생하는 모든 예상치 못한 레이아웃 변화의 모든 개별적인 레이아웃 변화 점수의 총 합계를 측정합니다. 점수는 0부터 시작하며 양수인 수입니다. 여기에서 0은 변화가 없음을 나타내며 숫자가 클수록 페이지의 레이아웃이 많이 변경되었음을 보여줍니다. 사용자가 상호작용하려고 할 때 페이지 요소가 변경되는 사용자 환경은 좋지 않으므로 CLS는 중요합니다. 왜 큰 값이 표시되었는지 알 수 없다면 페이지와 상호작용해 보면서 점수에 어떻게 영향을 주는지 확인하세요.
• 보고서에 표시된 그룹 CLS란 그룹에 포함된 URL 방문수의 75%에 해당하는 가장 낮은 일반 CLS입니다.

아래는 페이지 로딩 중 레이아웃이 이동해 사용자가 원치않는 버튼을 누르게 되는 CLS 문제점을 예시한 영상입니다

INP(다음 페인트에 대한 상호작용)

• INP(Interaction to Next Paint)는 사용자가 페이지를 방문하는 전체 기간에 발생하는 모든 클릭, 탭, 키보드 상호작용의 지연 시간을 관찰하여 사용자 상호작용에 대한 페이지의 전반적인 응답성을 평가하는 측정항목입니다. 최종 INP 값은 관찰된 가장 긴 상호작용이며 이상점을 무시합니다.
• FID는 사용자가 처음 페이지를 접속할때의 상호작용을 점검한다면 INP는 사용자가 페이지를 나가는 순간 그 전의 상호작용을 점검합니다.
• INP는 2024년 3월부터 FID를 대체합니다.

FID(첫 입력 지연)

• FID(First Input Delay)는 사용자가 페이지와 처음 상호작용했을 때부터(링크를 클릭하거나 버튼을 탭하는 경우 등) 브라우저가 상호작용에 반응할 때까지의 시간입니다. 이 측정값은 사용자가 처음 클릭하는 상호작용 요소에서 가져옵니다. 이는 사용자가 취해야 하는 작업이 있는 페이지에서 중요합니다. 페이지가 상호작용하기 전에 지연되기 때문입니다.
• 보고서에 표시된 그룹 FID란 그룹에 포함된 URL 방문수의 75%가 이 값을 나타냈음(또는 그보다 높을 수 있음)을 의미합니다.
• FID는 2024년 3월부터 INP로 대체됩니다.

코어 웹 바이탈이 왜 중요한가

구글이 밝힌 코어 웹 바이탈 최적화 사례는 아래와 같습니다.

• 조사 결과 사이트가 코어 웹 바이탈 기준점을 충족하면 사용자가 페이지 로드를 중단할 가능성이 24% 더 낮았음
• 최대 콘텐츠 렌더링 시간(LCP)이 100ms 감소할 때마다 Farfetch의 웹 전환율은 1.3% 증가
• Yahoo! 재팬의 레이아웃 변경 횟수(CLS)가 0.2 감소하자 세션당 페이지 조회수가 15% 증가했고, 세션 시간은 13% 늘었으며, 이탈률은 1.72%포인트 감소
• Netzwelt에서 코어 웹 바이탈을 개선한 결과 광고 수익이 18%, 페이지 조회수가 27% 증가
• CLS를 1.65에서 0으로 낮춘 redBus는 전 세계적으로 도메인 순위가 크게 상승

코어 웹 바이탈 측정 도구

• AMP가 아닌 페이지: PageSpeed Insights 테스트 도구
• AMP 페이지: AMP 페이지 경험 가이드

(끝)