Almost all technical sides can impact the site and its performance, making it harder for you to identify the root cause. Core web vitals are the crucial performance-based metrics that measure how your site is performing in terms of loading, interactivity, and visual stability. Ads can Affect Core Web Vitals on an integrated website.
While there are speed analysis tools available to help you get the recommendations, you must be wondering if by any chance you would know how Ads Affect Core Web Vitals and what you as a publisher can do about it.
Impact of Ads on Cumulative Layout Shift (CLS)
Ads may cause layout shifts on the web pages because they load asynchronously. That means the user’s browser fetches the ads while the rest of the page continues loading the content.
If your webpage will be left without sufficient space for ads, they can shift the content on the page, resulting in a bad user experience.
On the other hand, a responsive web page helps you to avoid invalid clicks and keeps you away from a double click penalty.
Shifts in the layout (of content, images, or any other embedded element) can happen due to various reasons. Let’s discuss some of them here:
How to reduce the impact of CLS?
Before reducing the impact of CLS, you’ll need to find out what’s causing it. Here are a few reasons for CLS and how to resolve them:
1. Expanding or collapsing an ad slot (based on its configuration) when displaying the ad. Many publishers use the collapseEmptyDivs () function to collapse the ad slots when there is no ad to display. This results in layout shifts when ads appear on the page. To reduce CLS due to collapsed slots, use the Google Ad Manager Historical report to know the fill rate of ad slots. Once you know when your slots get filled, you’ll need to arrange the ad slots in a certain way. The ad slots that are more likely to be filled should always start out ‘expanded’ and the ad slots that are unlikely to be filled should start out ‘collapsed’.
2. Adding fluid ad slots on the webpage can also cause shifts in the layout. Fluid ad slots don’t specify a fixed set of ad sizes and therefore automatically resize to fit the ad creative. So, ad space can’t be reserved for the fluid ad slots prior to requesting ad content. So, mitigating layout shift due to fluid ads can be done by using the fluid size for ad slots that are below the fold and fetching the fluid ad slot as soon as possible so that by the time users view the ad slot, it is already resized.
3. Since layout shifts can be voided by reserving enough space for an ad slot, this method doesn’t fit the multiple-size ad slots. Adding multi-size ad slots on the webpage works well with the static ad slots. For multi-size ads, it is recommended to reserve space for the largest ad size and for the ads that most likely to be served.
Impact of Ads on First Input Delay (FID)
FID measures the interactivity of the web page. Every publisher has the basic interactive elements on their website to interact with. The interactions could be anything like scrolling, a drop-down menu, or zooming in and out.
Display ads can be responsive static ads, animation ads,s or video ads. Such ads require user interaction. When the third-party ad codes block the rendering of your web page or take more time to render the ad, the website FID score results in a poor score.
How to reduce the impact of FID?
Your FID scores can be affected by the delay in the third-party JavaScript execution. Interaction latency is one of the major causes of poor FID. Here are a few solutions to help you reduce the impact of FID due to third-party JavaScript:
1. Remove unused JavaScript codes – Serving ads includes third-party ad tags which can keep your website’s network busy resulting in the execution delay of third-party JavaScript. This leads to an increase in the interaction latency and hence unresponsive pages. To mitigate this, you’ll need to remove third-party JavaScript. Among the hundreds of JavaScript libraries on a website, you’ll find some unused JavaScript. In order to improve your FID score, reduce latency by removing unused JavaScript codes. You can use Page Speed Insights to identify the opportunities and find out unnecessary elements contributing to the latency and remove them.
2. Lazy loading optimization – Lazy loading is one of the proven methods to improve page speed and core web vitals. Lazy loading allows loading of the interactive part of the web page on the screen and reduces the loading of the off-screen hidden elements. By implementing lazy loading, you can prioritize the loading of the ads. That means the ads below the fold will load after the ads in the visible area of the screen.
3. Load ad tags asynchronously – Synchronous loading of ad tags doesn’t allow faster loading of both ads and content. Thus, it is always recommended to load third-party scripts asynchronously. To do this, you can use the “async” attribute to load Google publisher tags
Read Also: 7 Effective Techniques to Speed Up WordPress Website Instantly
Impact of Ads on Largest Contentful Paint (LCP)
LCP is the core web vital that measures the time taken by the largest element of the web page to render. This metric will be affected if any of your display or video ad ATF takes more time to render. For instance, if an ad will be placed above the fold of a webpage having a size larger than other elements, then the LCP of your web page will be affected. Moreover, publishers try to make sure their ads must load as fast as possible so that the visitors can view or click on the ad before any other element on the page.
However, if the website has a header bidding auction, this will lead to higher LCP with an increase in the loading because some resources of your website’s network will be occupied with the auction. As a result, loading of the more important content of the page will be affected, increasing the LCP.
How to reduce the impact of LCP?
If a website has a large ad appearing above the fold, move it to below the fold to ensure it loads faster. Make sure your header bidding auction doesn’t increase the response time. You can find solutions to ensure fast page loading while running your header bidding auctions.
Conclusion
As you have seen how site speed scores and core web vitals get affected by the ads. To optimize Ads that Affect Core Web Vitals, you’ll need a better understanding of the user experience and ads. The provided suggestions and solutions can only be done through well-versed technical knowledge to obtain the required results and maintain core web vital scores.
If you still aren’t able to pass the core web vitals assessment or you don’t have the required knowledge to do so, get in touch with w3speedup to help you out.
FAQs
1. What are Core Web Vitals?
Core web vitals are the performance metrics to measure user experience in terms of loading, interactivity, and visual stability which contributes to the ranking signals of search engines. There are 4 core web vitals including LCP, FCP, FID, and CLS in order for you to maintain high performance.
2. Why should publishers care about Core Web Vitals?
Core web vitals not only affects the rank of the site but also its page speed score. Thus, the faster a website will load, the more ad revenue will be generated. According to a survey done by AdSense, the website with 5 seconds or less loading generated more revenue than the website with 19 seconds of loading time.
3. Do Ads affect SEO?
Display ads can disrupt the user experience if the quality of the ads appears poor. Also, pop-up ads can harm your site when they appear too frequently or are designed in a way that the visitor can’t close them easily, this can hurt the user experience and your SEO. Intrusive interstitial ads are one of the factors considered by Google which could potentially lower the ranking of a website.
