Sometime in May 2022, Google made an update to its search engine policy which resulted in beyond nothing .com losing all its traffic overnight. The update was focused on ‘user experience’, something we never knew we were failing at. After trying to fix this issue with SEO, content writing, and other irrelevant techniques, we found the dreaded Core Web Vitals section on Google search console and got introduced to CLS, LCP, FCP, and Speed Index with big red letters.
I then played around with new themes, image file sizes, and even considered upgrading my hosting plan from shared to dedicated. After everything failed and I was still facing CLS issues, I realized I started having this problem around the same time I got AdSense approved. Everything was fine before the google ads showed up!
So I turned off the auto ads from google AdSense and ran the performance tests again with page speed insights. Everything became green. No CLS, no LCP, no slow loading nonsense! I concluded that auto ads were causing CLS Issues because they inserted themselves wherever they wanted about a second after all other elements of my website loaded. So my website is fast, its google who is slow!
But I still needed the ads. So I manually inserted them at select locations using the snippets for responsive ads provided by adsense. The CLS and LCP issues returned. Placing those responsive ads in pre-sized containers or using fixed-sized ads did not help either.
Why the hell is google penalizing my website being slowed down by their own ads?! Do they want me to show their ads or not?!
Do Google AdSense ads cause CLS and LCP problems?
If other websites using google ads are performing way better than beyond nothing .com, it means i was wrong (for the most part).
While Google Auto Ads can contribute to Cumulative Layout Shift (CLS) and Largest Contentful Paint (LCP) issues, the main problem still lies with how your website loads as the CLS caused by Ads is minor. The CLS caused by ads can also be ignored by google if they happen ‘below the fold’.
How to optimize Auto Ads to reduce CLS
I once again implemented Auto Ads. But this time I added excluded ‘areas’ from the adsense interface. Notice in the screenshot below how I prevented auto ads from appearing in following layout elements in my website:
- Top Bar
- Header
- Before and after the menus
- Before the title
Notice how all these areas are ‘above the fold’ on the mobile version of my website. I replicated this for the desktop version as well.
This way, a user would only see my page’s content upon loading and see ads only when they start scrolling down. This is sort of a better user experience. Page Speed Insights sees my page the same way and therefore does not detect any CLS issues in the first instance. My score improved, but I was still failing.
Upon scrolling down, the auto ads insert themselves when they are ready to be loaded (in delayed fashion), again leading to CLS issues on overall the whole page. Back to the drawing board.
One day, finally, finally, I learnt the one thing that made all the difference and solved performance issues for good. And it was the moment I realized that my website was slow, not due to auto ads, but due to CACHING and CONTENT DELIVERY.
How to really solve CLS and LCP issues on your website
Now that we know that Google ads are NOT the real culprit behind CLS and LCP, lets focus on the caching and content delivery that makes all the difference in your website’s loading time. This article would become huge if I start talking about this here. So lets talk about Caching and Content delivery somewhere else.
However, on the topic of Google Ads and CLS, it recommended to use responsive and fixed ad units in manually selected areas on your website instead of Auto Ads. With proper caching and content delivery enabled, you can reduce your CLS score to ZERO as everything will load in predetermined fashion without shifting any elements. Click here to read all about the solution to CLS and LCP.