핵심 Web Vital 및 이를 개선하기 위한 주요 기술 이해
게시 됨: 2022-05-112020년 5월 Google은 품질 신호에 대한 지침을 제공하는 이니셔티브인 Web Vitals라는 새로운 프로그램을 도입했습니다. Google은 이러한 측정항목이 웹에서 뛰어난 사용자 경험을 제공하는 데 필수적이라고 생각합니다.
Google은 수년 동안 여러 도구를 제공했으며(Google Analytics, Search Console 및 PageSpeed Insights는 인기 있는 도구 중 일부임) 이러한 도구는 종종 발전함에 따라 따라잡기가 어려울 수 있습니다.
그러나 웹 사이트가 제공하는 사용자 경험의 품질을 이해하기 위해 성능 마법사가 될 필요는 없습니다. Web Vitals는 이를 단순화하여 가장 중요한 메트릭인 Core Web Vital에 집중할 수 있도록 하는 것을 목표로 합니다.
핵심 Web Vital이란 무엇입니까?
핵심 Web Vital은 모든 웹 페이지에 적용되는 Web Vital의 하위 집합입니다. 각각의 핵심 성능 평가는 실제 경험을 반영하고 사용자 경험의 고유한 측면을 나타냅니다. Google은 이러한 측정항목을 모든 사이트 소유자가 측정할 것을 권장합니다.
Core Web Vitals를 구성하는 메트릭은 시간이 지남에 따라 진화하지만 이 글을 쓰는 시점에서 메트릭 세트는 사용자 경험의 세 가지 주요 측면에 중점을 둡니다.
- 로딩 중
- 상호 작용
- 시각적 안정성
LCP(Large Contentful Paint)란 무엇입니까?
가장 큰 콘텐츠가 포함된 페인트(LCP)는 사용자 경험의 첫 번째 측면인 로딩 성능을 측정합니다. 페이지의 기본 콘텐츠 로드가 완료되었을 가능성이 있는 로드 타임라인의 지점을 표시합니다. 가장 큰 콘텐츠가 포함된 페인트가 빠를수록 사용자가 페이지가 유용하다는 것을 Google에 더 확신할 수 있습니다.
웹 페이지에서 우수한 사용자 경험을 제공하려면 페이지가 처음 로드되기 시작한 후 2.5초 이내에 LCP가 발생해야 합니다.
가장 큰 콘텐츠가 포함된 페인트 지침을 충족하는 것의 중요성을 강조하기 위해 사용자는 페이지가 더 빨리 로드될 때 웹사이트에서 더 많은 시간을 보낼 것입니다. 실제로 사용자는 로드 시간이 2초(LCP의 2.5초 권장 사항에 부합)일 때 8.9페이지를 방문하는 반면 로드 시간이 8초일 때는 3.3페이지를 방문합니다.
첫 입력 지연(FID)이란 무엇입니까?
첫 번째 입력 지연(FID)은 사용자 경험의 두 번째 측면인 상호 작용성을 측정합니다. 사용자가 응답하지 않는 페이지와 상호 작용하려고 할 때 느끼는 경험을 수량화합니다.
FID는 사용자가 처음으로 페이지와 상호작용(예: 링크 클릭 또는 버튼 누르기)부터 브라우저가 사용자의 작업에 대한 응답으로 이벤트 처리기를 처리하기 시작할 때까지의 시간을 측정합니다.
좋은 사용자 경험을 제공하려면 페이지의 첫 번째 입력 지연이 100밀리초 이하여야 합니다. FID가 낮으면 페이지를 사용할 수 있습니다.
CLS(누적 레이아웃 시프트)란 무엇입니까?
CLS(Cumulative Layout Shift)는 사용자 경험의 세 번째 측면인 시각적 안정성을 측정합니다. 사용자가 예상치 못한 레이아웃 변경을 경험하는 빈도를 수량화하는 데 도움이 됩니다. 낮은 CLS는 페이지가 투박하지 않은지 확인하는 데 도움이 됩니다.
좋은 사용자 경험을 제공하려면 페이지의 누적 레이아웃 이동을 0.1 이하로 유지해야 합니다. LCP나 FID처럼 시간 측정이 아니라 점수입니다.
LCS 점수는 브라우저가 뷰포트 크기와 두 렌더링된 프레임 사이의 뷰포트에서 불안정한 요소의 움직임을 확인하도록 하여 계산됩니다.
핵심 Web Vital을 개선하는 방법
양질의 사용자 경험을 위해 최적화하는 것이 웹사이트 성공의 열쇠이며 Google은 핵심 핵심 보고서가 모든 웹 경험에 매우 중요하다고 믿습니다. 따라서 가능한 한 많은 페이지에서 사용자 경험을 개선할 수 있는 기회를 식별하는 것이 중요합니다.
웹사이트의 사용자에게 권장되는 목표에 도달했는지 확인하기 위해 LCP, FID 및 CLS 측정항목을 측정하는 좋은 임계값은 페이지 로드의 75번째 백분위수입니다. 귀하의 웹사이트가 핵심 핵심 웹사이트를 준수하는 것으로 간주하려면 이 지표에 대한 75번째 백분위수에서 권장 목표를 충족하는 페이지를 통과하는 것을 고려하십시오.
다음은 핵심 Web Vitals 측정항목을 개선하고 웹사이트가 우수한 사용자 경험을 제공하도록 하는 몇 가지 방법입니다.
페이지 로드 속도 향상
이 시점에서 웹 페이지가 빠르게 로드될 때 더 나은 사용자 경험이 제공된다는 것은 말할 필요도 없습니다. 2~3초 사이는 이탈률이 급증하는 전환점입니다. 소비자의 40%는 사이트를 떠나기로 결정하기 전에 3초 이상 기다리지 않을 것입니다.
PageSpeed Insights를 사용하여 입력한 모든 웹페이지에 대한 점수를 얻고 도구의 제안을 활용하여 페이지 로드 속도를 높일 수 있습니다. 로드 시간이 Core Web Vitals 지침을 충족하지 않는 경우가 있을 수 있으며 이 경우 비디오, 이미지 또는 잠재적으로 느린 로드를 유발할 수 있는 기타 문제를 확인해야 할 수 있습니다.
가장 큰 콘텐츠가 포함된 페인트 최적화
LCP(Large Contentful Paint)는 핵심 웹 바이탈 전체 점수에서 상당한 비중을 차지하므로 이 지표에 맞게 최적화하는 것이 좋습니다. 리소스 로드 시간이 낮은 LCP 점수의 일반적인 원인이므로 Google에서 권장하는 몇 가지 사항은 다음과 같습니다.
- 이미지 최적화 및 압축
- 중요한 리소스 미리 로드
- 텍스트 파일 압축
- 적응형 게재 사용
- 서비스 워커를 사용하여 자산 캐시
이탈률 낮추기
이탈률은 사용자가 웹사이트를 이탈하는 비율을 나타내며 이 비율을 가능한 한 낮추기를 원합니다.
예를 들어 Google Analytics는 방문한 웹사이트 페이지의 이탈률을 보여줍니다. 이렇게 하면 페이지가 응답하지 않거나 휴대기기에서 제대로 로드되지 않는 경우와 같은 문제를 식별하는 데 도움이 될 수 있습니다.
이탈률이 높다는 것은 사용자가 필요한 것을 찾지 못하고 있다는 의미일 수 있으며, 이는 Google에 페이지가 검색 결과에 나타나는 검색어와 관련이 없다는 신호일 수 있습니다. 높은 이탈률은 전면 광고, 팝업 및 기타 눈에 띄는 요소로 인한 사용자 경험이 좋지 않음을 나타낼 수도 있습니다.
예상치 못한 레이아웃 이동 제거
텍스트 또는 버튼이 페이지의 다른 위치로 갑자기 이동하는 경우(종종 로딩 문제로 인해), 이를 예상치 못한 레이아웃 이동이라고 합니다. 사용자가 혼란스러워 하거나 잘못된 것을 클릭하게 만들 수 있습니다.
예기치 않은 레이아웃 변경을 피하거나 제거하려면 다음을 수행하십시오.
- 기존 콘텐츠 위에 콘텐츠 삽입 방지
- 컨텍스트 및 연속성을 위해 전환이 애니메이션되도록 합니다.
- 이미지 및 비디오에 크기 속성 포함
디지털 마케팅의 필수 분야를 마스터하고 싶으십니까? 지금 디지털 마케팅 전문가 과정을 확인하십시오.
SEO 및 핵심 Web Vitals의 이점을 활용하고 싶으십니까?
SEO 및 Google의 Core Web Vitals는 모든 디지털 마케팅 전략에 필수적입니다. 검색 엔진 최적화(SEO) 교육 과정은 웹사이트의 가장 중요한 마케팅 채널에서 지속적인 성장을 주도하는 풀 스택 SEO 전문가로 귀하를 변화시킬 것입니다. 이 과정에서 키워드 연구, 기술 SEO, 링크 구축, 분석 등과 같은 SEO의 여러 측면을 마스터하게 됩니다.
SEO 이상의 기술을 갖춘 풀스택 디지털 마케터가 되는 데 관심이 있다면 디지털 마케팅의 대학원 과정을 확인하십시오. Purdue University와 협력하여 제공되고 Facebook과 공동 제작한 이 포괄적인 프로그램에서는 실습 프로젝트, 실시간 온라인 교육, Purdue 교수진 및 전문가의 마스터 클래스를 통해 성공적인 디지털 마케팅 전문가가 되기 위해 알아야 할 모든 것을 배우게 됩니다. Facebook, Harvard Business Publishing의 사례 연구 등