Google Web Vitals

What are Core Web Vitals?

Trish Manrique Ad Ops

You’re probably familiar with Core Web Vitals and didn’t even know it. If you own a website, you’ve most likely visited PageSpeed Insights to see how your website’s page experience is performing according to Google’s standards. PageSpeed Insights (PSI) reports on the performance of a page on both mobile and desktop devices, and provides suggestions on how that page may be improved — part of the metrics they use are Core Web Vitals.

In May 2020, Google announced that page experience signals will be included in Google Search Ranking. The new page experience signals combine Core Web Vitals with their existing search signals of mobile-friendliness, safe-browsing, HTTPS-security, and intrusive interstitial guidelines. Rolling out in May 2021, it’s important that you assess your website to align with Core Web Vitals. These new signals include:

Largest Contentful Paint (LCP)LCP is the time it takes for a page’s main content to load. This content could be the largest image, video, or text in the viewport. According to Google, an ideal LCP measurement is 2.5 seconds or faster. 


Source: Google Developers

Cumulative Layout Shift (CLS)CLS refers to the time it takes for a page to become interactive and stable. You may have come across a site and as soon as you start interacting with the page, the page layout shifts — this is considered a poor user experience.

Source: Google Developers

First Input Delay (FID) – The third signal Core Web Vital measures is FID, the time from when a user first interacts with your site (i.e. when they click a link, tap on a button, or use a custom, JavaScript-powered control) to the time when the browser is actually able to respond to that interaction. An ideal measurement is less than 100ms.

Source: Google Developers

Suggested Post:   What is Ad Blindness and How Can We Stop It?

How do Core Web Vitals impact publishers?

The purpose of page experience is to create a better web. If publishers choose to not follow the new page experience signals, it’ll impact their Google Search ranking, overall page speed and in turn, their ad revenue. So, how can publishers minimize the impact of these signals? Let’s take a look at each Core Web Vital.

See our Core Web Vitals report in action

Take a deep dive with our team in how you can analyze your Core Web Vitals with page-level data.

To optimize LCP, you can address:

  • Slow server response times: The longer it takes a browser to receive content from the server, the longer it takes to render anything on the screen. Fix this by optimizing your server, implementing a content delivery network (CDN), and caching assets more efficiently. 
  • Render-blocking JavaScript and CSS: To simplify it, render-blocking Javascript and CSS are files that prevent a website from displaying a web page before loading these files. Defer any non-critical Javascript and CSS to increase speed of the main content of your web page. You can do this by minifying CSS, and deferring non-critical CSS and in-line critical CSS.
  • Resource load times: Resource load time looks into the time it takes to load many other types of resources that can affect paint times aside from Javascript and CSS. Tactics to reduce resource load times can include optimizing and compressing images and text, caching assets, and preloading important resources.
  • Client-side rendering:When building a client-side rendered site, it’s important to have optimizations in place or users may not see or interact with any content on the page until all the critical JavaScript has finished downloading and executing. Optimize client-side rendering by minimizing critical Javascript, and using server-side rendering and pre-rendering.
Suggested Post:   Short-form and long-form content monetization

For CLS, look at optimizing:

  • Image dimensions: It’s vital to include height and width for images to ensure that the browser can allocate the correct amount of space in the document while the image is loading.
  • Ads, embeds, and iframes dimensions: Similar to images with dimensions, ads, embeds, and iframes should each include height and width to ensure the browser can allocate space and reduce shift.
  • Dynamically-injected content: According to Google, publishers should avoid inserting new content above existing content, unless in response to a user interaction. This ensures any layout shifts that occur are expected.
  • Web fonts causing FOIT/FOUT: To minimize any layout shifts caused by web fonts, publishers should use a preloaded font to have a higher chance of meeting the first paint.

You can address FID by: 

  • Breaking up long tasks: Break down long-running code into smaller, asynchronous tasks to reduce input delay on your site.
  • Optimizing your page for interaction readiness: JavaScript size bloat, heavy execution times, and inefficient chunking can slow down how soon a page can respond to user input and impact page experience. 
  • Using a web worker: A blocked main thread is one of the main causes of input delay. Prevent this by using a web worker, which makes it possible to run JavaScript on a background thread. 
  • Reducing Javascript execution time: Limit the amount of JavaScript on your page to reduce the amount of time that the browser needs to spend executing JavaScript code. This speeds up how fast the browser can begin to respond to any user interactions. You can reduce Javascript execution time by deferring unused Javascript and minimizing unused polyfills. 
Suggested Post:   Top Four WordPress Site Speed Plugins for 2021

What can you do to get ready for Core Web Vitals?

To get ready for these changes, publishers can use a variety of tools provided by Google to start improving their page experience. 

  1. Create a site-wide audit using Search Console’s report for Core Web Vitals to give you an overview of how your site is doing and a deep dive into issues. 
  2. Fix issues uncovered by PageSpeed Insights and Lighthouse. Head over to web.dev/vitals-tools for a round-up of all the tools you need to get started.
  3. Consider implementing AMP to achieve great page experience outcomes that have been proven by Google’s AMP team.

Conclusion

At Sortable, one of our key focuses for 2021 is Core Web Vitals. Sortable will be incorporating Web Vitals metrics into our analytics platform, enabling you to see how your pages are scoring and compare them against a benchmark score across properties on Sortable’s network. In addition, Sortable will be working to ensure that the files and scripts required for monetization are optimized for size and speed, giving you a head start for SEO.If you have any questions about Core Web Vitals and how it’ll impact you, feel free to contact our team at team@sortable.com. Are you a Sortable publisher? Your Account Manager or our Publisher Operations team would be happy to walk you through these changes. Get started by contacting your AM or emailing success@sortable.com.