Core Web Vitals 관련하여 이해를 하고 개선해보세요. 쉽지는 않습니다. 2021년 6월 Update

Core Web Vitals 관련하여…

구글은 그동안 미루어왔던 Core Web Vitals를 도입하였습니다. 작년부터 중요하다고 이야기를 하였고, 이 부분이 왜 중요한지에 대해 글을 남겼었습니다. 수많은 test를 해보았고, 이 지수들이 어디에 연관이 있는지 찾아내는데 시간이 상당히 소비가 된 것 같습니다. 도움이 되시길 바라며 공유 드립니다.

Core Web Vitals 왜 도입이 되었는가?

오래전 구글은 백링크와 트래픽 그리고 SEO를 이용하여 구글 순위에 반영을 하였습니다. 하지만 구글은 세상이 모바일 중심이 되어가고 있는 것을 빠르게 감지하였고, 많은 사람들이 구글 검색을 통해 웹문서를 검색하는것을 인지하면서 행동에 들어가기 시작합니다.

  • 사용자 중심 서비스

이 부분을 이해해야 합니다. 사용자 중심 서비스는 내가 아무리 문서를 좋게 만들고 빠르게 만들어도 사용자가 불편하면 검색 순위에 안좋은 영향이 갈 수 있다는 것입니다. 그래서 구글은 2020년 몇가지 발표를 하는데, 가장 큰 영향이 있는 것들이 아래와 같습니다.

  1. 100% Mobile Index
  2. Core web vitals를 구글 랭킹에 도입

구글은 사용자들이 웹문서를 볼때 불편해하는 것을 점수화하여 Core Web vitals를 만들었는데, 대부분 페이지 스피드와 JS CSS 최적화 이미지 압축 관련된 내용입니다. 기술적인 부분이 들어가게 되면서, 구글 순위를 위해서는 어느정도 IT 기술적인 부분을 이해를 해야 최적화가 가능해졌습니다.

2021년 6월 2일부터 위 부분으로 알고리즘 업데이트가 시작되었는데, 구글은 6월 7월 2번에 걸쳐 업데이트를 진행한다고 합니다. 이번 업데이트는 구글 업데이트 사상 큰 업데이트이고, 지금까지 SEO에 TTFB를 빼고 JS CSS 압축 관련하여 비중이 크지 않았지만, 이제는 상황이 변했습니다.

참고 자료 : https://searchengineland.com/googles-june-2021-core-update-was-slow-to-roll-out-here-is-what-the-data-providers-saw-349349

아직 Mobile Index 100%는 진행이 되지 않고 있습니다. M-dot형태의 서비스도 많기 때문인데, 서치콘솔에는 이미 반응으로 하고 있으며, 많은 쇼핑몰, 포탈 회사들이 M-dot형태를 탈피하기 위해 개선하고 있습니다.

M-dot : 우리가 흔히 보는 티스토리나 네이버에 보면 URL/m 형태나 m.domain.com 형태 URL을 보시는데 모바일에서 창을 열었을 때 저 URL로 redirect 시켜주어 모바일 환경에 최적화 시켜주는 것입니다. 구글은 M-dot 형태로 되어 있으면, bot의 충돌을 일으킬 수 있어 권장 하고 있지 않습니다.

참고 : https://itgit.co.kr/2021_google_seo/

개선을 위해서 해야하는 것들

상당히 어려운 부분입니다. Core Web Vitals는 FCP, LCP, CLS 를 중심적으로 반영이 되는데, 여기에 해당하는 조건들이 거미줄 처럼 엮여 있습니다. 그리고 이 세가지를 충족 시키기 위해서는 정말 많은 경험이 필요합니다.

  1. 이미지 최적화
  2. 타사 JS를 통한 광고 배치 조율
  3. JS CSS 최적화
  4. 서버 리소스 최적화 : PHP , WP cron (상황에 맞게 사용해야함)

위에 내용을 보면 간단한것 같지만, 내가 페이지를 어떻게 만드냐에 따라, 기술적 적용하는 범위가 틀려지게 됩니다. 예를 들어 광고의 경우 타사 JS Deley를 사용하게 되면, 광고가 늦게 뜨게 됩니다. 이럴경우 광고 배치를 다시해야 합니다.

또한 이미지 최적화를 할 경우 LazyLoad를 사용하시는데, 첫 뷰에 사용되는 이미지일 경우 Lazyload를 사용하게 되면 늦게 로딩이 되어 LCP CLS에서 좋지 않은 영향을 주게 됩니다. 그렇다고 Lazy load를 사용하지 않으면, 전체적 LCP가 올라가게 됩니다.

참고 : LCP는 전체 로딩 영향이 크며, CLS는 페이지 레이아웃 변동 관련하여 측정합니다.

그래서 이러한 부분을 개선하기 위해서는, 내 페이지의 상태를 잘 파악해야하고, 캐싱 플로그인 JS CSS 압축 이미지 최적화 플로그인은 반드시 사용을 해야합니다. (사용하고 개선점을 찾아내어 수정을 해야함)

제가 사용해본 플로그인 중에 가장 효과가 큰것은 WP Rocket 입니다.

Core web vitals 필수 플로그인 WP rocket

참고 : WP Rocket 최적화 내용

전에는 전자책으로 간단하게 설치법을 공유했지만, 생각보다 상황에 따라 설정해야하는 부분이 늘어나 시간적인 소요가 많아 전자책 판매를 중지하였습니다. 만약 설치하시는데 도움이 필요하시다면 아래의 링크를 통해 도움을 요청하시길 바랍니다.

PSI (Page Speed insights) 데이터 참고

많은 분들이 PSI 데이터를 보실 때 Lab Data를 보시는데, SEO에 영향이 가는 것은 Field data 입니다. 이부분을 꼭 확인하셔야 합니다. 이미지를 보시면 아래와 같습니다.

Core web vitals PSI
실험실 데이터가 Lab data 이고, Origin Summary가 Field data로 보시면 됩니다. 

Adsense를 하시는 분들은 CLS가 좋게 나오기가 힘이 듭니다. 그러므로 많은 경험을 통해 개선하시는 방법 밖에 없습니다.

그리고 구글은 앞으로 Mobile Index를 중심으로 하기에, 모바일 점수를 중점적으로 보시면 됩니다.

참고 : 서버가 안좋아서 그렇다고 하시는 분들 많은데, 서버가 어느정도 영향을 주는것은 사실이지만, 큰 비중을 차지하는 것은 아닙니다. 무조건적으로 서버를 증설하시지 마시고, 서버 리소스 사용량을 보시고 증설하세요.

참고 자료 : https://searchengineland.com/google-changes-core-web-vitals-metrics-how-to-use-lab-and-field-data-for-optimization-349184

이제 구글 SEO 관련해서 기술적인 부분을 어느정도 이해를 하시고, 진행을 해야합니다. 구글 노출을 원하시는 분들은 기본적인 Core Web Vitals의 기술 이해는 하시고 다가가시길 바랍니다.


* 본 컨텐츠는 출처(URL)를 남기신다면 마음껏 복사해서 사용하셔도 됩니다.

웹문서 배포 | 바이럴 마케팅 | 효과좋은 온라인 마케팅
온라인 생태계를 위한 링크쥬스 블로그