구글의 PageSpeed 메트릭에서 모바일에서 95점 이상을 받는 방법을 아시나요? AdSense 광고가 있는 상황에서도요. 많은 사람들이 이를 불가능하다고 말해왔지만, 저는 어떻게든 AdSense와 함께 PageSpeed에서 높은 점수를 받을 수 있는 해결책을 찾은 것 같아요.
당신이 저와 같다면, PageSpeed의 속도 지표와 Vitals에 대해 강박적인 고민을 하고 있을 것이며, Google Adsense 또는 ADX의 성가신 광고 때문에 모바일에서 95점 이상의 점수를 받지 못해 짜증이 났을 것입니다.
나는 좋은 점수를 얻기 위해 모든 종류의 캐시 플러그인을 시도했지만 사실상 아무것도 효과가 없었습니다. Hummingbird, PageSpeed Ninja, LiteSpeed, 심지어 몇 가지 프리미엄 플러그인도 테스트했지만 광고 때문에 모바일에서 80점에조차 가까워지지 못했습니다.
어느 날 WP-Rocket을 사용하는 중에 나는 모든 문제를 해결해주는 기적적인 기능을 발견했다. 이를 통해 얻는 결과를 봐.
Wp-Rocket가 없는 경우 Flying Scripts와 같은 기능을 하는 플러그인을 사용해 볼 수 있습니다.
모바일 페이지 스피드에서 90을 어떻게 얻었나요?
어떻게 내가 Adsense + ADX 광고가 가득한 상황에서도 이런 점수를 얻을 수 있을까? 그 답은 간단하다. 페이지가 상호 작용 가능할 때까지 광고를 로딩하는 데 시간을 늦추었기 때문이다.
나는 이것을 WP-Rocket와 JavaScript 실행 지연 기능을 사용하여 했지만 아마도 다른 플러그인으로도 할 수 있을 것이다. 나는 아래 이미지처럼 adsbygoogle와 gstatic을 포함하는 javascripts를 지연하도록 설정했다:
이 간단한 함수는 나를 짜증나게 했던 문제를 해결해 주었습니다. 물론 이 함수를 활성화하는 것의 결과도 분석해야 하지만, 개인적으로는 아무 문제가 없을 것으로 믿습니다.
나는 광고 외에도 푸시 알림 플러그인과 몇 가지 다른 스크립트 및 플러그인을 사용합니다. 이로 인해 웹 사이트가 무겁게 될 수 있습니다. 그럼에도 불구하고 내 최적화와 Google 광고의 지연 덕분에 높은 점수를 받을 수 있습니다.
JS는 광고의 로드가 지연될 경우 수익이 손해를 입을 수 있습니다.
저는 이러한 광고 발표가 AdSense의 규칙을 위반할 수 있다는 사실에 두려움을 느꼈지만, 그렇지 않다고 믿습니다. 워드프레스를 위한 광고용 프리미엄 플러그인이 있으며, LazyLoad를 제공합니다.
나도 몇 번이나 페이지를 새로고침했는데 항상 광고는 문제 없이 로드되는 걸 알았어. 가끔씩 로드되지 않는 경우도 있었지만, 내 브라우저의 문제인지 구글 스크립트의 문제인지는 확신할 수 없어.
사실 저는 이것이 클릭 수와 CPC를 증가시킨다고 상상합니다. 왜냐하면 광고가 갑자기 나타나서 방문객의 주목을 끌기 때문입니다. 때때로 방문자는 이미 페이지가 로드된 상태에서 주의를 기울이지 않기도 합니다.
사실 A/B 테스트를 하면서 광고를 늦춘 후에 내 애드센스 수익이 줄어든 것을 느끼지 못했습니다. 제가 사용하는 ADX 네트워크인 valueimpression도 같은 방식입니다. 물론 어떤 결론을 내리기 전에 직접 테스트해보는 것을 추천합니다.
사실입니다. 이것은 PageSpeed 점수에 영향을 미치는 것뿐만 아니라 실제로 웹사이트가 더 빠르게 로딩됩니다. 그래서 이 대안을 고려해보고 더욱 빠른 웹사이트를 갖게 되세요.
PageSpeed의 점수를 높일 수 있는 다른 방법
당연히 광고를 단순히 지연시키는 것만으로는 순위가 높아지지 않을 거에요. 웹사이트를 최적화하고 글꼴이나 아이콘과 같은 불필요한 로딩을 피해야 해요. 제 메뉴를 예쁘게 만들기 위해 이모지와 특수 문자를 사용했는데, 외부 로딩이 필요하지 않아요.
좋은 CSS 및 JS 최소화가 가능한 캐시 플러그인을 사용해야 합니다. 저는 또한 Cloudflare의 무료 CDN을 사용하고 있으며, 제 이미지와 javascript를 Jetpack CDN에 호스팅합니다. 저의 테마인 GeneratePress는 매우 가볍습니다.
사람들 중에는 매우 무거운 주제를 갖고 있는 사람들도 있습니다. 이 경우 수동으로 최적화하고 장식을 제거하는 것이 필요합니다. 메가메뉴와 같은 것들은 필요하지 않고 사이트를 무겁게 만들 뿐입니다. 80%의 방문자가 모바일을 사용하기 때문에 데스크톱 버전이 더 많은 것을 가지고 있어도 아무런 상관이 없습니다.
항상 web.dev를 사용하여 귀하의 사이트를 확인하는 것이 좋습니다. 단순히 Google의 PageSpeed만 사용하는 것보다 더 많은 흥미로운 정보를 제공합니다. web.dev와 vitals의 Google Chrome 확장 프로그램이 있으며, 이는 귀하의 페이지 로딩을 방해하는 문제를 구체적이고 상세히 지적합니다.
희망합니다. 먼저 완벽한 점수를 받기 위해 포기하지 않으시길 바랍니다. 이것은 일이 많이 들지만 매우 큰 만족감을 줍니다! 이 기사의 팁을 좋아하셨다면 친구들과 공유하고 댓글을 남겨주세요. 귀하의 웹 사이트를 최적화하기 위해 무엇을 하셨나요?