핵심 성능 보고서 마스터하기: 사용자 경험 향상을 위한 가이드

게시 됨: 2023-03-21

전자 상거래가 계속해서 온라인 시장을 지배함에 따라 기업은 웹 사이트 최적화 측면에서 앞서 나가야 합니다. 최근 몇 년 동안 등장한 핵심 요소 중 하나는 Core Web Vitals의 개념입니다. 2020년에 Google은 이러한 중요한 웹사이트 요소에 대한 특정 측정항목을 설정하여 전자상거래 비즈니스에 웹사이트 순위를 높일 수 있는 보다 간단한 경로를 제공했습니다. 그러나 Core Web Vitals는 정확히 무엇이며 기업은 최대 효과를 위해 어떻게 최적화할 수 있습니까? 이 기사에서는 핵심 성능 보고서를 자세히 살펴보고 이를 최적화하기 위한 필수 도구를 공유하여 전자 상거래 웹 사이트가 경쟁에서 앞서 나갈 수 있도록 합니다.

관련 게시물: 비즈니스 소유자가 핵심 성능 보고서에 대해 알아야 할 7가지 사항

핵심 성능 보고서가 중요한 이유

1. 핵심 성능 보고서는 사이트의 Google 검색 순위에 영향을 미칩니다.

2. 우수한 사용자 경험을 제공하는 데 중요합니다.

3. Core Web Vitals를 최적화하면 사이트의 트래픽과 수익을 높일 수 있습니다.

Core Web Vitals 최적화는 온라인 상점 소유자와 개발자가 최적의 사용자 경험을 제공하고 Google 검색 결과에서 더 높은 순위를 차지하며 궁극적으로 수익을 늘리는 데 필수적입니다. LCP(Largest Contentful Paint), FID(First Input Delay) 및 CLS(Cumulative Layout Shift)의 세 가지 핵심 지표는 웹 사이트의 로드 속도, 상호 작용 및 시각적 프레젠테이션을 기반으로 합니다.

이러한 메트릭의 우선 순위를 지정하면 웹 사이트에서 고객에게 원활하고 반응이 빠르며 시각적으로 매력적인 경험을 제공할 수 있습니다. 웹 사이트를 디자인하거나 최적화하는 동안 핵심 성능 보고서를 간과하지 마십시오. 좋은 사용자 경험과 훌륭한 사용자 경험을 구분하고 궁극적으로 수익에 영향을 미칠 수 있습니다.

최대 콘텐츠 페인트(LCP)란?

LCP(Largest Contentful Paint)는 이미지나 텍스트 상자와 같은 웹 페이지의 가장 중요한 콘텐츠 요소의 로딩 시간을 측정하는 중요한 지표입니다. 이는 원활한 사용자 경험을 제공하는 데 필수적인 지표 집합인 Core Web Vitals의 중요한 구성 요소 중 하나입니다. 웹사이트의 LCP를 최적화하면 페이지 로드 시간을 줄이고 전반적인 사용자 경험을 개선하여 고객 유지 및 확보를 높일 수 있습니다.

Perspective에서는 Core Web Vitals의 LCP를 개선해 달라는 요청을 자주 받습니다. 고객 중 한 명을 위해 수행한 LCP(Largest Contentful Paint) 최적화의 한 가지 예를 아래에서 볼 수 있습니다.

1. 최적화 전 가장 큰 콘텐츠 페인트

2. 최적화 후 최대 콘텐츠 페인트

또한 읽기: Acer 대 Lenovo Chromebook: 어느 것이 귀하에게 적합합니까?

가장 큰 콘텐츠가 포함된 페인트가 낮은 가장 일반적인 원인은 무엇입니까?

1. 느린 서버 응답 시간

2. 최적화되지 않은 JS 및 CSS

3. 느린 리소스 로드

4. 클라이언트 측에서 느린 렌더링.

가장 큰 콘텐츠가 있는 페인트를 늘리는 방법

Largest Contentful Paint Core Web Vitals

우리는 작업에 지속적으로 적용되는 작은 최적화 방법 목록을 만들었으므로 다음을 권장합니다.

1. 사용하지 않는 JS 코드를 삭제하고 프로덕션 모드에서 파일을 최소화하십시오.

2. 일부 선택자의 양식이 다른 선택자를 중단시키지 않도록 모듈(블록)에 CSS 규칙을 작성하는 것이 좋습니다. 또한 긴 선택자 체인을 만들지 않는 것이 좋습니다. 테스트할 모든 CSS 파일 또는 라이브러리는 CDN을 통해 다운로드하는 것이 아니라 로컬에 저장해야 합니다.

3. 더 빠른 로딩을 위해 이미지를 압축하고 새로운 형식을 사용합니다. 예를 들어 JPEG를 품질 손실 없이 1/3 크기의 WebP로 변환합니다.

4. 반응형 이미지(링크)를 사용하여 다운로드 속도 및 사용자 경험 측면에서 이미지를 최적화하는 것이 좋습니다. 여기에 중요한 점이 있습니다. img 태그에는 두 가지 중요한 속성이 있습니다.

1. src – 원본 이미지 소스를 나타냅니다. src 속성의 이미지는 검색 엔진의 순위에서 스캔되고 고려되므로 여기에서 최고 품질의 이미지를 지정해야 합니다.

2. srcset – 이미지의 다양한 버전을 지정할 수 있습니다. srcset 속성의 이미지에서 브라우저는 실행되는 데스크탑 장치 또는 모바일 장치의 화면 크기에 따라 로드 및 표시할 이미지를 선택합니다.

5. <img> 태그 속성에 loading=”lazy”를 추가하지 않는 것이 좋습니다.

Largest Contentful Paint 증가에 게으른 속성 제거

CLS(누적 레이아웃 이동)란?

CLS(Cumulative Layout Shift)는 페이지를 로드하는 동안 예기치 않은 레이아웃 변화의 정도를 정량화하는 중요한 시각적 안정성 메트릭입니다. 임계값 0.1을 초과하는 모든 레이아웃 이동 점수의 합계로 측정됩니다. CLS 개선은 사용자 경험이 최신 웹 개발의 중심 무대가 되면서 기업의 최우선 순위가 되었습니다. 따라서 고객이 이 핵심 성과 지표에 대한 개선을 자주 요청하는 것은 놀라운 일이 아닙니다.

또한 읽기: 2023년 라이브 카지노의 성장

CLS(Cumulative Layout Shift) 불량의 가장 일반적인 원인은 무엇입니까?

시각적 안정성 표시기는 원활하고 원활한 사용자 경험을 보장하는 데 중요합니다. 그러나 몇 가지 기술적 요인으로 인해 시각적 안정성이 저하될 수 있습니다. 일부 일반적인 범인에는 이미지 및 멀티미디어 파일의 크기 조정, GraphQL 쿼리 및 최적화되지 않은 캐러셀이 포함됩니다.

이미지 및 멀티미디어 파일의 잘못된 크기

이미지 또는 멀티미디어 파일에 지정된 크기가 없으면 항목이 로드될 때 브라우저에서 적절한 공간을 할당할 수 없습니다. 이로 인해 페이지 레이아웃이 지속적으로 변경되어 사용자 경험이 저하될 수 있습니다.

최적화되지 않은 GRAPHQL 쿼리

PWA(Progressive Web App)에서 이미지 또는 GraphQL 블록을 로드할 때 공간을 예약하지 못하면 로드 후 페이지가 "점프"될 수 있습니다. 이로 인해 레이아웃이 잘못 변경되고 성능 메트릭에 부정적인 영향을 미칠 수 있습니다.

최적화되지 않은 캐러셀

부드럽지 않고 결합되지 않은 애니메이션을 사용하는 최적화되지 않은 캐러셀은 페이지 레이아웃의 재계산을 트리거하여 CLS(Cumulative Layout Shift) 점수가 낮을 수 있습니다. 약간의 변화가 사용자에게는 거의 눈에 띄지 않을 수 있지만 페이지의 전체 레이아웃 변경 및 시각적 안정성에 상당한 영향을 미칠 수 있습니다.

시각적 안정성 표시기 및 누적 레이아웃 이동을 개선하는 방법

How to improve visual stability indicator and Cumulative Layout Shift Core Web Vitals

자리 표시자 사용

자리 표시자 구현은 웹 사이트의 인식된 성능을 개선하기 위해 널리 채택되는 기술입니다. 자리 표시자는 다운로드가 진행 중이고 사이트가 올바르게 작동하고 있음을 나타내는 시각적 신호 역할을 합니다. 이미지에 대한 가장 효과적인 접근 방식은 높이 및 너비 속성을 설정하는 것입니다.

Core Web Vitals에서 자리 표시자를 사용하여 성능 점수 향상

이 전략을 사용하면 브라우저가 완전히 로드되기 전에 이미지에 필요한 공간을 예약하여 예기치 않은 레이아웃 변경을 방지할 수 있습니다. 다음은 img 태그를 사용하여 이 기술을 구현하는 예입니다.

<img data-src=”image.webp” 폭=”380″ 높이=”120″ alt=”이미지”>

높이 및 너비 속성을 정의함으로써 브라우저는 이미지를 위한 공간을 할당하고 이미지가 로드될 때 레이아웃이 이동하는 것을 방지할 수 있습니다. 결과적으로 사용자는 보다 매끄럽고 시각적으로 안정적인 브라우징 경험을 경험할 수 있습니다.

전면 디스플레이: 스왑

최적의 CLS(Cumulative Layout Shift) 점수를 얻기 위해 개발자는 font-display: swap 속성을 활용하여 사용자 정의 글꼴 파일이 완전히 로드되기 전에 시스템 글꼴로 텍스트를 표시할 수 있습니다. 필수 CSS 글꼴 파일의 font-face 규칙은 글꼴 파일 경로를 지정하고 font-display: swap 속성을 포함해야 합니다.

다음은 font-display: swap 속성으로 font-face 규칙을 정의하는 방법의 예입니다.

@font-face {Font-family: “Proxima Nova”;src: url(“../fonts/proximanova-regular.woff2”) format(“woff2”);font-display: 스왑;}

font-display: swap 속성을 사용하면 브라우저는 사용자 지정 글꼴 파일이 완전히 로드될 때까지 즉시 시스템 글꼴로 텍스트를 표시합니다. 이 기술은 예기치 않은 레이아웃 변경을 방지하고 페이지의 시각적 안정성을 개선하여 더 나은 사용자 경험을 제공할 수 있습니다.

또한 읽기: 암호화폐의 가치에 대한 글로벌 경제 상황의 영향

CSS 변환

CSS 변환 기능은 개발자가 사이트의 성능과 사용자 경험을 향상시키기 위해 활용할 수 있는 영향력 있는 도구입니다. 예를 들어 CSS 변환을 사용하면 이미지 캐러셀 로드와 관련된 문제를 완화하여 더 빠르고 사용자 친화적인 브라우징 경험을 얻을 수 있습니다.

GraphQL HTML 요소를 통해 CMS 블록(특히 PWA 프로젝트에서) 로드를 최적화할 때 고정 높이로 CSS 속성을 설정하는 것이 좋습니다. 이 접근 방식은 예기치 않은 레이아웃 변경을 방지하고 페이지가 로드된 후 시각적으로 안정적인 페이지를 보장하는 데 도움이 될 수 있습니다.

이러한 기술을 구현함으로써 기업은 Core Web Vitals 점수를 개선하고 더 매끄럽고 즐거운 사용자 경험을 제공할 수 있습니다. 최근 사례 중 하나에서 CSS 파일에 font-display: swap 속성을 추가하고 최소 높이를 설정하고 글꼴 로드(@font-face)를 최적화하여 CLS 점수를 크게 개선했습니다.

1. 코어 웹 바이탈 최적화 전 온라인 스토어

2. 핵심 웹 바이탈 최적화 후 온라인 스토어

첫 번째 입력 지연(FID)이란 무엇입니까?

FID(First Input Delay)는 웹사이트의 상호 작용을 측정하는 중요한 지표입니다. 첫 번째 입력 지연은 버튼을 클릭하거나 양식 필드에 입력하는 것과 같이 페이지와 사용자의 첫 번째 상호 작용에 사이트가 응답하는 데 걸리는 시간을 측정합니다.

Magento 2에서 FID 사용

Magento 2에서는 라이브 채팅 버튼 클릭, 장바구니에 제품 추가 또는 구매 완료와 같은 많은 사용자 상호 작용이 사이트의 FID에 영향을 미칠 수 있습니다. 이러한 상호 작용이 반응하지 않고 사용자에게 즉각적인 피드백을 제공하지 않으면 사용자 경험이 느리고 실망스러울 수 있습니다.

최적의 사용자 경험을 보장하려면 100ms 미만의 FID 점수를 달성하는 것이 필수적입니다. 이는 JavaScript 실행 시간 최소화, 타사 스크립트 최적화 및 서버 응답 시간 최적화와 같은 다양한 최적화 기술을 통해 달성할 수 있습니다. FID를 최적화함으로써 기업은 사용자의 참여와 만족을 유지하는 보다 반응이 빠르고 매력적인 웹 사이트를 제공할 수 있습니다.

첫 번째 입력 지연을 최적화하는 방법

작업 분해

FID(First Input Delay)를 개선하기 위해 권장되는 접근 방식은 더 긴 작업을 더 작고 관리하기 쉬운 하위 작업으로 분할하는 것입니다. 시간이 오래 걸리는 작업은 기본 스레드에 과부하를 주어 사용자 입력 처리 및 실행을 방해할 수 있습니다. 50밀리초 이상 흐름을 방해하는 모든 코드 세그먼트는 긴 작업으로 간주됩니다.

FID를 확인하려면 실제 조건에서 측정을 수행해야 합니다. 정확한 측정을 위해서는 웹 페이지와의 진정한 사용자 상호 작용이 필수적이기 때문입니다.

실제 조건에서 테스트

FID(First Input Delay)를 정확하게 측정하려면 실제 조건에서 성능을 측정하는 특수 도구를 사용하는 것이 좋습니다. 이러한 도구에는 다음이 포함됩니다.

1. PageSpeed ​​Insights 테스트

2. 검색 콘솔(Core Web Vitals 보고서)

3. Chrome 사용자 경험 보고서

FID는 사용자 상호 작용을 필요로 하기 때문에 실험실 환경에서 테스트를 수행하는 것은 불가능합니다. 반대로 필드 메트릭은 사용자 행동을 분석하여 실제 성능을 캡처합니다. 그러나 FCP(First Contentful Paint)와 TTI(Time to Interactive) 사이의 기간을 평가하는 메트릭인 TBT(Total Blocking Time)는 실험실 환경에서 측정할 수 있으며 현장 조건에서 FID와 잘 연관됩니다. TBT는 또한 상호 작용 관련 문제를 식별하는 데 능숙합니다. 결과적으로 실험실 환경에서 TBT를 향상시키는 모든 최적화는 사용자를 위한 FID도 향상시킵니다. Lighthouse는 TBT를 효과적으로 측정할 수 있는 도구입니다.

또한 읽기: 맞춤형 Shopify Storefront 구축을 위한 단계별 가이드

주문형 다운로드 활성화

타사 코드를 사용하여 웹 페이지에 대한 요청 시 다운로드를 활성화할 수 있습니다. 예를 들어 페이지 하단의 배너 또는 광고가 보기에 가깝게 스크롤할 때만 표시되도록 주문형 다운로드를 활성화할 수 있습니다. 줄 끝에 다운로드 가능한 웹 요소가 아닌 사용자에게 가장 중요한 가치를 제공하는 웹 요소를 우선적으로 다운로드하는 것이 주된 아이디어입니다.

자바스크립트 최적화

웹 사이트 성능을 향상시키려면 불필요한 JavaScript 파일을 제거하는 것이 중요합니다. 한 가지 권장되는 접근 방식은 필요할 때까지 JavaScript 파일 다운로드를 연기하는 것입니다. 이 기술을 사용하면 처음에는 브라우저가 HTML 및 CSS와 같은 중요한 웹 요소를 얻을 수 있습니다. 그런 다음 스크립트를 평가할 수 있으므로 로딩 시간이 빨라집니다. 이 전략을 채택하는 것은 많은 Magento 매장에서 사용하는 Mega Menu 확장과 같이 상당한 JavaScript 확장이 있는 웹사이트에 특히 유용합니다. 이 기술을 통해 웹사이트 소유자는 로드 프로세스를 간소화하고 보다 효율적인 사용자 경험을 제공할 수 있습니다. 따라서 사용하지 않는 JavaScript를 제거하는 것은 웹 사이트 성능을 향상시키기 위해 고려해야 하는 근본적인 최적화 기술입니다.

Core Web Vitals 개선을 위한 추가 지표

More indicators to improve Core Web Vitals user experience audit

위의 세 가지 주요 핵심 웹 요소 외에도 몇 가지 추가 메트릭이 있습니다.

첫 번째 콘텐츠가 있는 페인트(FCP)

FCP(First Contentful Paint)는 페이지가 초기 이미지 또는 텍스트 블록을 표시하는 데 걸리는 시간을 측정하는 데 도움이 되는 유용한 메트릭입니다. 이 메트릭에는 DNS 요청, 서버 요청, 서버 측 작업 및 DOM 기본 렌더링에 대한 처리 시간이 포함됩니다. DNS 및 네트워크 속도와 같은 요소는 우리가 통제할 수 없지만 서버 측 작업의 처리 시간을 줄이고 스타일 및 스크립트 로딩을 최적화하면 성능에 상당한 영향을 미칠 수 있습니다. 특히 Google은 웹 페이지의 헤드 섹션에 중요한 스타일만 포함하는 것을 우선시하고 가능하면 링크 태그 대신 스타일 태그를 사용하여 불필요한 서버 요청을 최소화할 것을 권장합니다.

웹사이트 성능을 더욱 향상시키기 위해 Google Analytics는 사용자 행동 및 참여에 대한 풍부한 정보를 제공합니다. 예를 들어 사용자 시간 보고서를 사용하여 웹 사이트 소유자는 페이지 로드, 사용자 상호 작용 및 기타 사용자 지정 이벤트를 포함하여 특정 작업 및 이벤트의 기간을 모니터링할 수 있습니다. 이 데이터는 최적화가 필요한 웹 사이트 영역을 식별하고 변경 사항의 효과를 추적하는 데 도움이 될 수 있습니다.

속도 지수 지표

FCP가 첫 번째 요소가 표시되는 시간을 측정하는 동안 속도 지수(SI) 메트릭은 페이지가 사용자에게 완전히 표시되는 데 필요한 시간을 고려하여 웹 페이지의 전체 로딩 속도를 캡처합니다. 페이지 로드 성능에 대한 포괄적인 개요를 제공하고 네트워크 속도 및 서버 처리 시간의 영향을 고려합니다. FCP와 SI의 조합을 활용함으로써 사이트 소유자는 웹 사이트 성능에 대한 포괄적인 개요를 얻고 사용자 경험을 향상시키기 위한 적절한 조치를 취할 수 있습니다.

SI는 네트워크 속도, 서버 처리 시간, 로드되는 리소스 크기 등 웹 페이지 성능에 영향을 미치는 다양한 요소를 고려합니다. 메트릭은 로드 프로세스 동안 정기적으로 웹 페이지의 시각적 완성도를 계산하고 페이지 속도를 나타내는 점수를 할당합니다. SI 점수가 낮을수록 페이지 로드 속도가 빨라지고 사용자 경험이 향상됩니다.

SI를 개선하기 위해 웹 개발자는 CSS 및 JavaScript와 같은 외부 리소스 최소화, 이미지 크기 축소, 브라우저 캐싱을 활용하여 리소스 로드 속도를 높이는 등 다양한 최적화 기술을 사용할 수 있습니다. Google Analytics 및 WebPageTest와 같은 도구를 사용하여 SI 점수를 분석함으로써 웹사이트 소유자는 최적화가 필요한 영역을 식별하고 웹사이트 성능을 개선하기 위해 변경할 수 있습니다. 궁극적으로 웹 사이트 성능을 개선하고 사용자 경험을 향상함으로써 웹 사이트 소유자는 참여를 개선하고 전환을 늘리며 비즈니스를 성장시킬 수 있습니다.

다음 페인트와의 상호 작용

INP(Interaction to Next Paint)는 사용자와 웹 페이지의 상호 작용과 시각적 응답 표시 사이의 시간을 측정하는 중요한 메트릭입니다. 이 지표는 특히 소셜 미디어 플랫폼 및 전자 상거래 사이트와 같이 빈번한 사용자 상호 작용이 필요한 페이지와 관련이 있습니다. INP는 웹 페이지의 응답성에 대한 귀중한 통찰력을 제공하고 사용자 경험을 개선하기 위해 최적화가 필요한 영역을 식별하는 데 도움이 됩니다.

INP는 현재 웹 페이지 방문 중 가장 최근의 사용자 상호 작용을 선택하고 웹 페이지가 시각적 업데이트로 응답하는 데 걸리는 시간을 측정하여 계산됩니다. 이 업데이트에는 새 이미지 또는 텍스트 블록의 모양, 요소의 위치 또는 크기 조정 또는 복잡한 애니메이션 실행과 같은 다양한 변경 사항이 포함될 수 있습니다. 사용자 상호 작용과 시각적 반응 사이의 시간을 측정함으로써 INP는 웹 페이지의 인식된 성능에 대한 귀중한 통찰력을 제공하고 최적화가 필요한 영역을 식별하는 데 도움을 줄 수 있습니다.

INP를 향상시키기 위해 웹 개발자는 JavaScript 사용을 최소화하고 이미지 및 비디오 크기를 줄이는 것과 같은 다양한 최적화 기술을 구현할 수 있습니다. 또한 Intersection Observer API 및 Web Workers와 같은 최신 웹 기술을 활용하면 리소스 집약적인 작업을 오프로드하고 메인 스레드의 워크로드를 줄여 성능을 향상시킬 수 있습니다.

또한 읽기: 프랑스어 번역이 귀하의 비즈니스에 어떻게 긍정적인 영향을 미칠까요?

처음 물기까지의 시간(TTFB)

TTFB(Time to First Byte)는 페이지 성능에 중요한 메트릭입니다. 요청이 전송된 후 서버가 데이터의 첫 번째 바이트를 수신하는 데 걸리는 시간을 나타냅니다. TTFB 값은 네트워크 대기 시간, 서버 처리 시간 및 웹 사이트 코드의 복잡성과 같은 다양한 요인의 영향을 받습니다. 더 낮은 TTFB 값은 더 빠른 로딩 시간과 더 나은 사용자 경험을 나타내므로 바람직합니다. 웹 사이트의 이상적인 응답 시간은 250~350밀리초이며 500밀리초 이상은 긴 응답 시간으로 간주되며 웹 사이트 성능에 부정적인 영향을 미칠 수 있습니다.

TTFB 가치를 향상시키기 위해 웹 사이트 소유자는 다양한 도구와 기술을 사용할 수 있습니다. 이러한 기술 중 하나는 자주 액세스하는 데이터를 캐시에 저장하여 더 빠른 액세스 및 검색을 허용하는 쿼리 캐싱입니다. Varnish와 같은 도구는 서버와 사용자 간의 캐싱 레이어 역할을 하여 웹 사이트 속도를 향상시키고 서버 부하를 줄일 수 있습니다. PWA 프로젝트의 경우 서비스 워커를 사용하여 HTML 콘텐츠를 캐시할 수 있으며 콘텐츠가 변경될 때 업데이트할 수 있으므로 자주 액세스하는 콘텐츠에 더 빠르게 액세스할 수 있습니다.

Magento 프로젝트의 경우 전체 페이지 캐싱은 TTFB 값도 향상시킬 수 있습니다. 전체 페이지 캐싱을 사용하면 전체 페이지를 캐시할 수 있으므로 서버에서 많은 코드를 실행하고 데이터베이스에서 정보를 검색할 필요가 줄어듭니다. 전체 페이지 캐싱을 활성화하면 브라우저가 캐시에서 직접 페이지를 읽을 수 있으므로 로딩 시간이 단축되고 사용자 경험이 향상됩니다.

따라서 페이지와 블록을 너무 많이 만들지 말고 최대한 줄여야 합니다.

Core Web Vitals 감사에 권장되는 도구

Lighthouse는 개발자가 웹 사이트 속도 및 상호 작용 문제를 진단하는 데 도움이 되는 강력한 웹 성능 감사 도구입니다. 최신 웹 기술과 모범 사례를 결합하여 심층적인 웹 사이트 성능 분석을 제공하고 실행 가능한 최적화 통찰력을 제공합니다. Lighthouse 감사를 실행함으로써 개발자는 사이트 속도, 상호 작용 및 기타 주요 메트릭을 개선할 수 있는 기회를 빠르게 식별할 수 있습니다.

Lighthouse 보고서에는 여러 섹션이 있습니다.

1. 사이트 성능 : 사이트 다운로드 속도 분석

2. 기능: 사이트 속도를 높이고 성능을 개선하는 방법을 설명합니다.

3. 진단: 주의 를 기울이고 수정해야 할 사항을 나타냅니다.

4. 프로그레시브 웹 프로그램: 상세 감사

5. 가용성: UX 디자인을 개선하는 방법에 대한 섹션

6. 모범 사례: 대부분의 사이트를 안정적으로 최적화하는 최선의 방법

감사를 실행하기 전에 분석 페이지 로드 버튼을 사용하여 관심사(성능, SEO, 접근성 등)에 맞게 감사 수준을 조정할 수 있습니다.

감사가 시작되면 감사 보고서가 새 창에 표시됩니다. PageSpeed ​​Insights 웹사이트에서도 측정할 수 있습니다.

Core Web vitals의 측정항목은 지난 28일 동안 수집된다는 점을 잊지 마세요.

또한 읽기: 최고의 Apple MacBook Air 및 MacBook Pro 노트북은 무엇입니까?

결론

결론적으로 온라인 상점에 대한 우수한 사용자 경험을 보장하기 위해 Core Web Vitals 감사 팀에 문의하는 것이 좋습니다. Core Web Vitals 지표는 추상적으로 보일 수 있지만 사이트를 보다 사용자 친화적으로 만듭니다. 또한 이러한 메트릭은 사이트 코드의 기능과 명확하게 연결되어 있어 상대적으로 쉽게 개선할 수 있습니다.

우리의 경험을 바탕으로 이러한 메트릭을 최적화하면 순위 및 전환율이 빠르게 향상될 수 있습니다. Core Web Vitals를 측정하면 최적화가 필요한 영역을 찾아내고 웹 사이트의 전반적인 사용자 경험을 향상시킬 수 있습니다. 따라서 주저하지 말고 Core Web Vitals 감사 팀에 연락하여 온라인 비즈니스에 미칠 수 있는 긍정적인 영향을 확인하십시오!