Core Web Vitals는 구글이 실제 사용자의 로딩 경험을 재는 세 가지 지표입니다. 구글 검색 평가에 반영되고, 무엇보다 느린 페이지는 방문자가 기다리지 않고 떠납니다.
세 지표와 기준
| 지표 | 쉬운 뜻 | 좋음 | 개선 필요 | 나쁨 |
|---|---|---|---|---|
| LCP | 첫 화면의 가장 큰 그림이나 글이 뜨는 시간 | 2.5초 이하 | 4초 이하 | 4초 초과 |
| INP | 버튼을 눌렀을 때 화면이 반응하는 시간 | 200ms 이하 | 500ms 이하 | 500ms 초과 |
| CLS | 로딩 중 화면이 밀리는 정도 | 0.1 이하 | 0.25 이하 | 0.25 초과 |
판정은 실제 방문자 기록의 75번째 백분위수 기준입니다. 방문자 넷 중 셋 이상이 "좋음"을 겪어야 통과입니다.
어디서 확인하나
- PageSpeed Insights: 위쪽은 실제 사용자 데이터(방문자가 충분할 때만), 아래쪽은 그 자리에서 잰 실험실 점수입니다. 두 숫자가 다를 수 있습니다.
- 구글 서치콘솔 "핵심 웹 지표": 사이트 전체에서 느린 페이지 묶음을 보여 줍니다.
LCP가 느릴 때
- 메인 배너 이미지가 수 MB라면 WebP나 AVIF로 바꾸고 화면 크기에 맞게 줄입니다.
- 첫 화면 이미지에
loading="lazy"가 붙어 있으면 오히려 늦어집니다. 첫 화면 이미지는 지연 로딩에서 빼고fetchpriority="high"를 줍니다. - 한글 웹폰트 전체 파일(1~2MB)을 받는 경우 서브셋 폰트로 바꿉니다.
INP가 느릴 때
- 쓰지 않는 슬라이더, 팝업, 채팅, 분석 스크립트를 정리합니다.
- 무거운 스크립트는
defer로 미루거나 필요한 페이지에서만 불러옵니다.
CLS가 높을 때
- 이미지와 영상에
width,height를 지정해 자리를 미리 잡습니다. - 늦게 뜨는 배너, 쿠키 안내, 광고 영역이 본문을 밀지 않게 자리를 고정합니다.
- 웹폰트가 바뀌며 글자 폭이 달라지는 경우
font-display와 대체 폰트 크기를 맞춥니다.
점수 하나에 매달리기보다 "가장 많이 들어오는 페이지의 LCP"부터 보세요. 대부분의 사이트는 메인 이미지와 폰트 두 가지만 고쳐도 체감이 크게 달라집니다.