How to Optimize Your WordPress Website for Google Core Web Vitals
Leave it to Google to keep the SEO crowd on its toes. The biggest search engine in the world is well known for releasing updates that range from small tweaks that go under the radar to rank-shattering, substantial changes. In the summer of 2021, the update is a core one and its main features include adding Core Web Vitals to the roster of official ranking factors.
What does this mean for WordPress website owners? Most importantly, it means there are a couple of new metrics that should be front and center for search engine optimization. In this article, we’ll break those Core Web Vitals down, and give you a couple of tips on how to optimize your website to get them just right.
You’ll learn:
Best Themes for Marketing
View Collection
Core Web Vitals are a group of metrics Google has deemed especially indicative of the quality of user experience. There are three of them, and each one is used to measure specific areas of website performance in a way that’s most meaningful from the standpoint of user experience.
The Core Web Vitals are:
-
Largest Contentful Paint (LCP) – a metric used to measure loading performance, the LCP measures the time that passes from when the page starts loading, to when the largest block of content on the page, be it text or image, has rendered. You should aim for an LCP time of 2.5 seconds or less.
-
First Input Delay (FID) – a metric used to measure the website’s interactivity, the FID measures the time that passes from when the user performs the first interaction with a page on your website, to when the browser responds to that interaction. Ideally, the FID of your website should be 100 milliseconds or less.
-
Cumulative Layout Shift (CLS) – a metric used to measure the visual stability of a page, the CLS is the sum of all unexpected layout shifts that occur while the page is open. It tells you how many different elements on your pages change their position while the page is open. The CLS should be 0.1 or less.
Simple enough, right? Some of these metrics have been around for a couple of years. Others are fairly new and are still evolving based on user feedback. Still, whether you’ve heard of them before or just become familiar, you should take note of them because they’ll become a lot more important.
The metrics Google uses to determine the rankings of a page have always been a topic of many debates in the search engine optimization community. Google has a good reason for keeping its cards close to its chest – people try to game the system all the time. We’ve seen this before with practices such as keyword stuffing – people will try to get an advantage any way they can.
Still, it makes perfect sense that Google will give some clues on what to aim for in terms of website performance. It’s useful for both Google and webmasters, as both benefit from websites providing a good user experience. We’ve known that search ranking signals for page experience include mobile-friendliness, HTTPS, meeting safe-browsing guidelines, and the lack of intrusive interstitials.
Near the end of 2020, Google announced that it will add the Core Web Vitals to the page experience signals. It was supposed to happen during the springtime of 2021, but the update was pushed back to roll out over the summer months of 2021. So starting in August or September of 2021, websites that want to optimize for Google search results would do well to take note of LCP, FID, and CLS.
It’s also important to note a couple of things about these Core Web Vitals. You’ll be able to see the performance of your website regarding the Core Web Vitals in a report that’s compiled using field data. In case there’s not enough field data – which might happen with FID, for example, if there are no elements with which the visitors should interact – then those metrics will be omitted from the report. Finally, you should keep in mind that these metrics are evolving – the CLS has already changed to consider that some pages need to be open for longer.
LCP isn’t the only metric used to measure the loading speed of page elements. First Contentful Paint, or FCP, measures how quickly a page loads any content. That result, however, might not be useful for determining user experience, because the first content that loads isn’t necessarily indicative of the page’s usefulness. The main piece of content – an image, video, or a big chunk of text – should be, so we focus on LCP and getting it below that threshold.
If you want to improve your pages’ Largest Contentful Paint, you could try:
-
Using a content delivery network (CDN) to speed up content delivery.
-
Eliminating any render-blocking JavaScript and CSS.
-
If removal is impossible, minifying JavaScript and CSS is the next best option.
-
Optimize elements such as images for the web.
This is not a complete list, but it should point you in the right direction. Generally, you should do what you otherwise would for increasing page loading speed. The only difference is that you’ll use the LCP to measure your success.
When you create a website and optimize it to work as quickly and efficiently as possible, you’ll have to do a bit more than just ensure quick delivery of assets. If your website has buttons, links, or JavaScript-powered controls with which a user might interact, you’ll want those interactions to be as smooth as possible. It wouldn’t hurt if they were quick, either.
With FID, you’re measuring how quickly a visitor’s browser starts responding – processing event handlers – to the very first interaction they make with your page. The usual culprit for this part going slow is code – specifically JavaScript. To get it out of the way, you could try:
-
Breaking up longer tasks into smaller ones to create space for processing user input.
-
Run JavaScript on a background thread using web workers.
-
Defer unused JavaScript.
-
Optimize polyfill usage on your website.
If you’re not sure how to implement these optimization steps, you might need help from a skilled computer programmer. Still, if there are call-to-action buttons you want to see pressed, it might be best to make sure they start doing what they should as quickly as possible.
No one likes to see a website with content that jumps around as different elements come in and out of their virtual existence. This might cause people to miss buttons, important ones like “add to cart” or “sign up for our newsletter,” and you don’t want that. You also probably don’t want to make it harder for visitors to read your content, which is what layout shifting will do.
There are more than a few reasons why layout shifts happen. Many of them are fairly easy to fix, too. You can, for example, try:
-
Making sure you include width and height size attributes with all your images.
-
Using the proper steps to avoid ad shift.
-
Using a sufficiently big placeholder for embeds and iframes.
-
Making sure new content is added below existing content.
You can try other things, too. For example, you might also ensure that you avoid flashes of invisible or unstyled text when loading web fonts.
Let’s Wrap It Up!
When it comes to optimizing your website for the best possible user experience, relying on metrics such as Core Web Vitals is a great choice for two reasons. The first is that these metrics have been included in the group because they are telling of specific traits that affect user experience greatly.
The second reason you should take note of Core Web Vitals is that they’re a verified Google search ranking signal. So while you might not tinker with them for no reason, any dips into the “needs improvement” value range should warrant an investigation and probably some website optimization.
