Core web vitals & ways to improve on WordPress

Enhance user experience

You already know to put more focus on UX for better Google rankings of your web pages. Now, that’s more important than ever as Google prepares its May 2021 update for measuring Core Web Vitals. With this new Google update, web pages that fall within a specific classification for three metrics that enhance user experience will get a ranking boost.

 

What are Google’s Core Web Vitals?

Those three Core Web Vitals are:

  • Largest Contentful Paint (LCP)
  • Cumulative Layout Shift (CLS)
  • First Input Delay (FID)

The Three Core Web Vital Signals

The addition of the three Core Web Vitals means that there will be a change in how search engine optimization ranking works. The three metrics measure loading, interactivity and visual stability. And while they don’t override the necessity of having relevant content, Google is quick to point out that, for multiple pages that have similar content, user experience becomes much more important for visibility in Search. Here’s what you need to know about those three metrics:

Largest Contentful Paint (LCP)

Largest Contentful Paint (LCP) Is all about loading speed. Google knows that users typically leave a website if it takes more than two seconds to load. LCP measures how quickly a page loads and is ready for a user to interact with it.  With the new Core Web Vitals, if your 75% of your website’s content loads in less than 2.5 seconds, Google ranks that as good.

Cumulative Layout Shift (CLS)

As pages load, users get frustrated if or when the layout shifts during the loading  process. Google ranks Cumulative Layout Shift (CLS) on a scale of 0 to 1. If your pages have no shifting, you get a “0.” To be rated “good” you should have a score of 0.1 or less.

First Input Delay (FID)

First Input Delay (FID) is all about how long pages on your website take to become interactive after they load. For instance, this metric measures how quickly your pages are ready for a user to type into a login box, click a link or select from a drop-down menu. A good Google FID score is less than 100 milliseconds.

How to Check Core Web Vitals

When you add a site to The Hub in GoDaddy Pro, you can activate and run a Performance Check, which will scan the site for anything that’s causing slow load times. This is a great way to  tune up your site so it aligns with Google Core Web Vitals. To more thoroughly check Core Web Vitals, you can also try these tools:

Google Search Console

Google Search Console (GSC) is another free Google tool to monitor, manage and improve your website by checking Core Web Vitals. To use this tool, simply sign in to your Google account, then open up GSC. Add your website as a property to GSC and verify your account. Open the Core Web Vital report to see how your pages perform grouped by status, metric type and URL group (groups of similar web pages) or the newer Page Experience Report. When you see pages that need attention, use the PageSpeed Insights tool to diagnose issues by page.

PageSpeed Insights

PageSpeed Insights (PSI) from Google analyzes a web page’s content on mobile and desktop devices then provides suggestions for making the page faster. PSI is powered by another Google tool, Lighthouse, and will convert performance scores per page into a score of between 1 and 100. Scoring between 90 and 100 rates you a “good” indicator by Google. To use PSI, navigate to the PSI tool, enter the URL of the web page and you’ll receive your performance scores.

Chrome DevTools

Use the Chrome DevTools built into the Google Chrome browser to help monitor Core Web Vitals. The Performance Monitor can deliver a real-time view of load and runtime performance. The Core Web Vitals Overlay gives you at-a-glance insight into page performance for LCP, FID and CLS

Lighthouse

Lighthouse, available in Chrome DevTools, is an automated auditing tool that simplifies the job of diagnosing issues and improving user experience by web page. To use Lighthouse, navigate to the Lighthouse tab and click Generate Report. You’ll see the page’s score for LCP, FID and CLS.

Web Vitals Extension

When you install the free Web Vitals Extension for Chrome, you can measure the three Core Web Vitals metrics. You can drill down into the individual metric values, which can be especially helpful when developing a website on a desktop.

How to Improve Core Web Vitals on WordPress

Ready to pass the Core Web Vitals test for your WordPress site? Here’s what you need to do:

How to Improve Largest Contentful Paint on WordPress

One of the three metrics Google wants your WordPress site to excel in is Largest Contentful Paint (LCP), or the time it takes for the largest content element on a page’s viewport to become visible. If benchmark testing shows you need to improve in this area, try these tips:

  • Optimize Images

Images attract attention and they can be the largest element on a page. To help them render quickly (and improve your LCP rating), make sure your images are optimized. Resize and compress your page images. In addition, try serving adaptive images so that someone using a mobile device would get lower resolution images than someone using a desktop.

  • Upgrade Website Hosting

A hosting service with a fast server response time can make the difference in faster rendering and improve your LCP score. Check out how GoDaddy Managed WordPress Hosting can help with fast and secure hosting.

  • Set Up Page Caching

To help your server deliver content faster, enable page caching. Your site’s pages will be stored as HTML files after the page is loaded the first time, displaying content faster.

How to Improve Cumulative Layout Shift on WordPress

If your WordPress site’s CLS score isn’t helping you achieve a good rating from Google, you can improve your score by trying these solutions:

  • Optimize Fonts

Custom fonts can cause your layout to shift. Default fonts won’t cause CLS. Sticking to just two or three fonts native to your WordPress theme can help reduce CLS. However, if you need to use custom fonts, you can preload the font file for the content at the top of your web page. You can also host Google font files locally and preload that way.

  • Resize Images

If you use CSS to resize images, the browser will start downloading images to determine sizing and to allocate space. This can create CLS. To avert the shifting problem, resize images using aspect ratio. This will allow the browser to calculate the spaces needed for images and reduce the risk of CLS.

  • Steady Animations

Animations are a prime reason page layout can shift while loading. When adding animations to WordPress pages, be sure to use the CSS transform property to transform scale and move animation elements  around.

How to Improve First Input Delay on WordPress

To improve FID scores on your WordPress site, you want to make sure the browser quickly responds to a user’s interaction. Try these options:

  • Optimize JavaScript

JavaScripts can get in the way of user interaction. To improve FID, remove any unwanted JavaScripts and keep only what is essential. For example, if you don’t use page builders, disable loading their JavaScript. You can also stop render-blocking JavaScripts.

  • Clean Up Plugins and Themes

If your site has unused plugins and outdated themes, those will affect FID. Improve your site’s speed and performance by cleaning up plugins and removing unwanted themes.

  • Async or Defer CSS

The main thread is where the browser processes most of the tasks required for page load. To improve FID scores, minimize main thread work by deferring the CSS files.

Other Ways to Improve Core Web Vitals

There are other ways to improve your WordPress website’s performance and enhance Core Web Vitals:

  • Mobile Friendliness

Fully optimize your site for mobile. The usability of your site on a mobile device is key for UX – and improved Core Web Vitals scores.

  • Make Sure Your Website is SSL Secure

Google has always placed a high premium on sites that are safe for users to browse. Security gaps like malware or not serving content over HTTPS can impact your Core Web Vitals. Make sure your website is SSL secure.

Successfully Improve WordPress Core Web Vitals with GoDaddy Pro

Meeting Core Web Vitals standards can help your site better rank organically. Make sure your sites deliver a faster and more enjoyable UX. To learn how GoDaddy can help you optimize for better Core Web Vitals and save you time in managing your work and delivering results to clients, check out the Hub by GoDaddy Pro.