Growth Marketing
Marketing Wiki

코어 웹 바이탈 정의와 측정 방법

박예원 GP

박예원 GP

5분 읽기
코어 웹 바이탈 정의와 측정 방법

웹사이트 속도는 그저 숫자일 뿐일까요? 아닙니다. 속도는 고객의 구매 결정, 나아가 비즈니스의 성패까지 좌우합니다. 구글과 Deloitte의 공동 연구에 따르면 웹페이지 로딩 시간이 0.1초 빨라질 때마다 전환율은 최대 10.1%까지 올라갑니다. 곧 매출로 이어지는 수치입니다.  

그렇다면 웹사이트 속도는 어떻게 측정하고 개선해야 할까요? 구글은 이 고민의 답으로 ‘코어 웹 바이탈(Core Web Vitals)’이라는 핵심 지표를 내놓았습니다. 웹페이지의 사용자 경험을 객관적으로 따져 보고 손볼 곳을 찾으려면 이 지표가 필요합니다. 이 글에서는 코어 웹 바이탈의 정의와 측정 방법, 개선 방식까지 하나씩 살펴보겠습니다.

코어 웹 바이탈 (Core Web Vitals) 이란?

코어 웹 바이탈은 사용자가 웹페이지를 얼마나 빠르고 안정적이고 쾌적하게 쓰는지 재는 지표입니다. 웹페이지의 로딩 속도와 반응성, 시각적 안정성을 객관적으로 따져 사용자 만족도를 끌어올리는 데 씁니다.  

웹사이트 전체 성능을 가리키는 ‘사이트 속도’와 개별 페이지의 로딩 속도를 가리키는 ‘페이지 속도’를 모두 아우르는 개념이기도 합니다. 그래서 코어 웹 바이탈 하나로 웹사이트 전체는 물론 개별 페이지의 사용자 경험까지 함께 평가합니다.

코어 웹 바이탈 측정 지표

코어 웹 바이탈은 다음 세 가지 핵심 지표로 구성됩니다.

코어 웹 바이탈 측정 지표

LCP (Largest Contentful Paint): 최대 콘텐츠풀 페인트

웹페이지에서 가장 큰 콘텐츠(이미지, 비디오, 텍스트 블록 등)가 화면에 표시되는 데 걸리는 시간을 측정합니다. 사용자가 페이지에 들어왔을 때 가장 먼저 눈에 띄는 콘텐츠가 얼마나 빨리 뜨는지 보는 지표입니다. LCP 점수가 낮으면 그만큼 로딩이 느리다는 뜻이고, 이탈률 증가로 이어지기 쉽습니다.

INP (Interaction to Next Paint): 다음 페인트까지의 상호작용

INP는 2024년 3월부터 구글이 FID를 대체하여 코어 웹 바이탈에 새롭게 포함시킨 핵심 지표입니다. 사용자가 페이지와 상호 작용(클릭, 탭, 키 입력 등)할 때 그 상호작용에 대한 시각적 피드백, 곧 다음 페인트가 끝날 때까지 걸리는 시간을 잽니다. 페이지 전반의 응답성을 보는 지표인 셈입니다. INP는 페이지에서 일어나는 거의 모든 상호작용의 지연 시간을 지켜본 뒤 가장 긴 시간을 대표값으로 삼습니다.

  • 이상적인 INP: 200밀리초 이하. (Google web.dev 권장 기준)
  • FID (First Input Delay) 와 비교시 개선된 점:
    • FID는 첫 입력의 지연만 쟀지만, INP는 페이지 안의 모든 상호작용을 함께 봅니다.
    • INP는 입력 처리 시간에 더해 브라우저가 다음 프레임을 그리는 시간까지 넣어 응답성을 더 넓게 잽니다.

CLS (Cumulative Layout Shift): 누적 레이아웃 시프트

페이지가 로딩되는 동안 콘텐츠 위치가 예기치 않게 밀리는 정도를 잽니다. 위치가 갑자기 바뀌면 사용자는 당황하고 클릭 오류를 겪습니다. CLS 점수는 이런 레이아웃 변화의 폭을 나타냅니다. 점수가 높을수록 페이지가 불안정하고 사용자 경험도 그만큼 나빠집니다.

Core Web Vitals는 LCP 2.5초 이하, INP 200ms 이하, CLS 0.1 이하 기준을 함께 관리해야 한다.
코어 웹 바이탈은 속도 하나가 아니라 로딩, 반응성, 안정성을 함께 보는 지표입니다.

코어 웹 바이탈 측정 방식

코어 웹 바이탈을 측정하는 방법은 여럿입니다. 구글이 제공하는 PageSpeed Insights, Lighthouse, Search Console 같은 도구로 웹페이지의 코어 웹 바이탈 점수를 손쉽게 확인합니다. Chrome 웹 브라우저의 개발자 도구를 쓰면 실시간으로 지표를 재고 뜯어볼 수도 있습니다.

PageSpeed Insights

PageSpeed Insights는 웹페이지 성능을 분석하고 개선 방법까지 짚어 주는 구글의 무료 도구입니다. URL만 넣으면 LCP, FID, CLS를 비롯한 여러 성능 지표가 나오고, 속도를 개선할 구체적인 제안도 함께 받습니다.

PageSpeed Insights는 현장 데이터, 실험실 진단, 개선 제안을 함께 보여주며 LCP, INP, CLS 점검에 활용된다.
PageSpeed Insights는 Core Web Vitals 점수와 개선 제안을 연결해 실제 병목을 좁히는 출발점입니다.

Lighthouse

Lighthouse는 웹페이지 품질을 평가하는 오픈 소스 도구입니다. Chrome 웹 브라우저에 들어 있고 성능, 접근성, SEO, PWA 등 여러 측면에서 페이지를 분석합니다. Lighthouse로 코어 웹 바이탈 점수를 확인하고 개선용 상세 보고서까지 받습니다.

Search Console

Search Console은 웹사이트의 검색 엔진 최적화(SEO) 성능을 살피고 관리하는 구글의 무료 서비스입니다. 여기 있는 ‘Core Web Vitals’ 보고서로 사이트 전체의 코어 웹 바이탈 상태를 확인하고, 문제가 있는 페이지를 골라내 고칩니다.

Chrome 개발자 도구

Chrome 웹 브라우저의 개발자 도구는 웹페이지를 분석하고 디버깅할 때 쓰는 강력한 도구입니다. ‘Performance’ 패널을 열면 페이지 로딩 과정을 단계별로 뜯어보고 LCP, FID, CLS 같은 코어 웹 바이탈 지표를 실시간으로 잴 수 있습니다.

코어 웹 바이탈 측정

코어 웹 바이탈 개선 방식

측정해 보니 문제가 있다면 다음 방식으로 개선합니다.

코어 웹 바이탈 개선은 이미지 최적화, 코드 최적화, 브라우저 캐싱, CDN 사용을 함께 점검해야 한다.
측정 결과가 나쁘다면 이미지와 코드, 캐싱, CDN부터 실제 병목을 줄여야 합니다.
  • 이미지 최적화: 이미지 파일 크기를 줄이고 웹에 맞는 형식(예: WebP)을 씁니다. 지연 로딩을 걸면 초기 로딩 속도까지 잡습니다.  
  • 코드 최적화: 불필요한 코드를 걷어내고 CSS와 JavaScript 파일을 압축해 페이지 크기를 줄입니다.  
  • 캐싱 활용: 브라우저 캐싱으로 웹페이지 리소스를 로컬에 저장해 두고 재방문할 때 로딩 속도를 높입니다.  
  • CDN 사용: 콘텐츠 전송 네트워크(CDN)로 웹페이지 콘텐츠를 여러 서버에 나눠 두고, 사용자와 가장 가까운 서버에서 내려보내 로딩 속도를 끌어올립니다.  
  • 서버 응답 시간 단축: 서버가 답하는 시간을 줄여 웹페이지 로딩 속도를 개선합니다. 

결론: 사용자 만족도 향상과 비즈니스 성장을 위한 코어 웹 바이탈

코어 웹 바이탈을 개선하면 사용자 만족도를 높이고 이탈률은 줄어듭니다. 비즈니스 성장으로도 이어집니다. 빠르고 안정적인 웹페이지는 사용자 경험을 좋게 만들어 재방문율을 높이고 브랜드 이미지에도 보탬이 됩니다.

구글은 웹사이트 순위를 정할 때도 코어 웹 바이탈을 중요한 요소로 봅니다. 실제로 Google 검색 공식 문서는 “코어 웹 바이탈은 우리(Google)의 순위 결정 시스템에 사용된다”고 명시합니다. 다만 페이지 경험만으로 상위 노출이 보장되지는 않습니다. 콘텐츠의 관련성과 품질이 함께 뒷받침될 때 검색 결과 상위에 오를 가능성이 커지고, 유기적 트래픽도 그만큼 늘어납니다.  


함께 읽으면 좋은 글

이 주제를 우리 비즈니스에 적용하고 싶으시다면 — 관련해서는 SEO 서비스에서 성장의 접근 방식을 보실 수 있고, 구체적인 상황 진단이 필요하시면 상담 문의로 연락 주세요. 트래픽 양이 아니라 매출이 될 1명을 기준으로 답해 드립니다.

자주 묻는 질문 (FAQ)

INP가 FID를 대체했다는데, 무엇이 달라졌나요?

FID(First Input Delay)는 사용자의 첫 입력에 대한 지연만 측정했지만, INP(Interaction to Next Paint)는 페이지에서 일어나는 거의 모든 상호작용의 지연 시간을 지켜본 뒤 가장 긴 시간을 대표값으로 삼습니다. 입력 처리 시간뿐 아니라 브라우저가 다음 프레임을 그리는 시간까지 넣기 때문에, 페이지 전반의 응답성을 훨씬 넓게 반영합니다. Google web.dev는 INP를 FID의 후속 지표로 정의하며, 200밀리초 이하를 좋은 응답성 기준으로 제시합니다.

코어 웹 바이탈 점수는 어디서 측정할 수 있나요?

구글이 제공하는 PageSpeed Insights, Lighthouse, Search Console로 점수를 확인합니다. PageSpeed Insights는 URL만 넣으면 지표와 개선 제안을 함께 내주고, 크롬 브라우저에 들어 있는 Lighthouse는 상세 보고서를 내줍니다. Search Console의 ‘Core Web Vitals’ 보고서로는 사이트 전체에서 문제가 있는 페이지를 골라낼 수 있습니다. 크롬 개발자 도구의 ‘Performance’ 패널에서는 실시간 측정도 됩니다.

코어 웹 바이탈이 검색 순위에 직접 영향을 주나요?

네, 영향을 줍니다. Google 검색 공식 문서는 코어 웹 바이탈이 순위 결정 시스템에 사용된다고 밝힙니다. 다만 이 신호 하나로 상위 노출이 보장되지는 않고, 콘텐츠의 관련성과 품질이 먼저입니다. 좋은 페이지 경험은 다른 조건이 비슷할 때 검색 성과를 밀어 주는 플러스 요인으로 보는 편이 정확합니다.

모바일과 데스크톱 점수가 다른데 어느 쪽을 기준으로 봐야 하나요?

web.dev 가이드는 LCP·CLS 등 코어 웹 바이탈 목표를 모바일과 데스크톱 각각에서 페이지 로드의 75 백분위수를 기준으로 측정하라고 권합니다. 어느 한 번의 측정값이 아니라 대다수 사용자(상위 75%)가 겪는 값이 기준선을 넘는지를 봐야 한다는 뜻입니다. 모바일 트래픽 비중이 높다면 모바일 점수부터 챙기는 편이 현실적입니다.