핵심 요약
LCP(가장 큰 가시 부분) 측정 점수를 낮추는 대형 이미지 최적화에 대한 가이드입니다.
이미지 최적화의 LCP 초점
많은 사이트에서 LCP 요소는 일반적으로 기본 이미지(히어로 이미지)입니다. 이 이미지가 늦게 로드된다면 Google이 보기에 귀하의 사이트가 느리다는 의미입니다. LCP 점수를 높이면 사용자 경험과 검색 순위 모두에 직접적인 영향을 미칩니다.
LCP 개선 전략
- 사전 로드:
를 사용하여 기본 LCP 이미지를 브라우저에 조기에 선언합니다. - 최신 형식: 대신 WebP 또는 AVIF를 사용하여 품질 저하 없이 50~70%를 절약합니다. JPG
- 반응형 이미지:
srcset및크기를 사용하여 모바일 사용자에게 거대한 데스크톱 이미지 전송을 중지합니다. - CDN 사용: 에지 서버에서 이미지를 제공하여 물리적 거리로 인한 지연을 줄입니다.
가져오기 우선순위 기능
HTML5와 함께 제공되는 fetchpriority="high" 속성을 LCP 이미지에 추가하여 브라우저가 이 리소스에 우선순위를 부여하도록 할 수 있습니다. 이 기능은 Chrome 101+ 버전에서 지원됩니다.
지연 로딩 주의
LCP 이미지에 loading="lazy"를 추가하지 마세요! 이렇게 하면 이미지 로드가 지연되어 LCP 점수가 악화됩니다. 지연 로딩은 스크롤 없이 볼 수 있는 이미지에만 사용해야 합니다.
관련 서비스
Meta 광고 및 퍼포먼스 마케팅
서버 CAPI 트래킹을 통한 광고 예산 낭비 차단 및 입증 가능한 ROAS 스케일링
