Optimizing WordPress for the Google Core Web Vitals

The Google Core Web Vitals update from Google is coming. With this new algorithm update Google will also pay more attention to the page experience of all your pages when indexing. While this update was initially planned for May, it has recently been pushed back to June. So you still have some time to optimize your website for this update. What exactly are these Core Web Vitals and how can you make your WordPress website as efficient as possible? We’ll explain it all to you in this article!

What are the Core Web Vitals?

The Web Vitals were created by Google to measure the user experience of web pages. To measure this user experience, we look at the following three factors: load time, interaction & visual stability. To make this measurable, Google uses the following 3 measurement techniques:

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

These 3 ‘measurement methods’ will also be central in Google’s new algorithm update that will be released next month. They say that if you don’t score well on these 3 points, your website will automatically rank lower in the search results. So it’s definitely a matter of getting this right before Google rolls out this update!

The Google Core Web Vitals. Source: Web.dev

But what do these three ‘core vitals’ mean exactly? We’ll go into a little more detail to make it a little clearer. In addition, we will also provide solutions so you can make sure you score well with your WordPress website!

Largest Contentful Paint (LCP)

LCP is also known as the load time score. It measures when the main content of a page is loaded in the way a user would normally see it. So when a page is almost fully loaded, but there is for example a video on your page, the LCP will count until it is also displayed correctly.

Google has clear guidelines for the LCP score. These are as follows:

  • 0-2.5 seconds: Good
  • 2.5 – 4.0 seconds: Needs improvement
  • 4.0+ second: Bad

How do I optimize my WordPress website for LCP?

You have several options for optimizing your WordPress website for LCP. We have listed 6 tips for you that are essential for a good loading time!

  • Upgrade your web hosting: Your web hosting can be seen as the backbone of your website’s load time. If you have a slow hosting, it is almost impossible to get a good score. So choose Managed WordPress Hosting for example. This involves the use of servers that are only set up to run WordPress sites. So you always get the optimal loading time.
  • Choose a lightweight WordPress theme: A lot of loading time often goes into fetching unnecessary code from your WordPress theme. Therefore, before you start building a website, always choose a theme that does not load unnecessary libraries and code. A good example of this is GeneratePress.
  • Use only essential plug-ins: We see that many WordPress websites are built from different plug-ins all with their own function. This can be very convenient, of course, but it can greatly reduce loading time. You should therefore carefully weigh up in advance what the plug-in will bring you and compare it to the costs involved.
  • Choose to use a CDN: A CDN ensures that your images, videos and for example texts are loaded easily and faster. Using a CDN service such as CloudFlare can provide significant changes in load time.
  • LazyLoad Images: LazyLoading means that your images will not be loaded all at once. This way, they are only retrieved once they are actually displayed in your image. So do you have images at the bottom of your web page? Then they will only load as soon as you start scrolling.
  • Caching: A good caching plug-in makes sure your browser stores information about your page so it doesn’t have to be reloaded by your web server. This can result in a lot of speed gains! Highly recommended!

Want to know if your website is ready for the new Google Core Vitals update? We are happy to advise you on this. Please contact us via one of our website creation or Search Engine Optimization pages!

First Input Delay (FID)

The FID looks at how quickly a website responds to a user interaction. For example, how quickly does your website respond by expanding the menu when a user scrolls over a menu item? The First Input Delay is the trickiest Google Core Vitals to understand and also certainly to optimize. This is because it’s pretty deep in the core of the website. For example, after clicking a button, it may take a while for an item to load because there may be a large JavaScript file behind the button.

Google has also defined clear guidelines for the FID. These are as follows:

  • 0 – 100 ms: Good
  • 100 – 300 ms: Needs improvement
  • 300 ms+: Bad

How do I optimize my WordPress website for FID?

To optimize the FID score of your website, it’s best to start with checking what your current score is. You can do this easily via Google’s Chrome User Experience Report and PageSpeed Insights. If you are not satisfied with your result, there are the following possibilities to improve it. These fortunately have a good overlap with LCP!

  • Minimize Javascript: Loading Javascript simply takes time. It is not possible for users to interact with a website while parallel Javascript is loaded. Therefore try to keep your Javascript as small as possible. There are several Minify plugins for this!
  • Remove Third-Party Script that you don’t use: By removing Plug-ins that you don’t use or hardly use, you also directly ensure that less JavaScript is used. Therefore, try to keep your plug-ins as minimal as possible.
  • Browser Cache: When you have enabled Browser Cache, you make sure that your browser loads Javascript a lot faster. Turning on browser caching for your website can be done easily via your .htaccess file or via various caching plug-ins.

Cumulative Layout Shift

Nothing is more annoying than when you are reading an article and text and buttons jump all over the place. This is exactly what CLS (Cumulative Layout Shift) is trying to measure. So it looks at how ‘stable’ a web page is. Google has the following guidelines for this:

  • < 0.1: Good
  • 0.1 – 0.25: Needs improvement
  • > 0.25: Bad

How do I improve my CLS Score?

Here, too, it is important to first measure which improvements are needed. You can use the Chrome User Experience Report for this. Often the following are the things that will make sure your CLS score is as optimal as possible.

  • Make sure your media has fixed attribute values: Your images and videos should have a preset size to make sure they don’t jump. This allows browsers to properly determine where the various elements are placed on a page. So always try to use your width and height elements!
  • Provide ‘reserved’ spaces for your ads, embeds & frames: This is a problem that often occurs on news websites, given the fact that these parties always load a lot of ads. Therefore, when designing your page, try to determine how much space you want to use for your various ads & frames. This way you can be sure that nothing crazy happens on your ‘canvas’.
  • Optimize your font delivery: If you make sure that your fonts are loaded properly beforehand, you can be sure that they won’t slip over time. Therefore try to preload your fonts with font-display:optional.

Need help improving your Core Web Vitals?

Need advice or help optimizing your website before Google rolls out the latest algorithm update? Our team is ready to help you in the field of Core Vitals. Do you already have your pages in order, but are you looking for other services such as search engine optimisation or seo copywriting? Then be sure to contact us and we’ll get back to you as soon as possible!

Want to know what we can do for you?