Too often we see people who have a web agency or are running their own business try to get the most out of their website as site owners without understanding how important its core metrics are on Google Analytics. And if they don’t know about them beforehand, they usually find out when something goes wrong…
All websites have something in common, but every website is also unique. What we can do for you is resolve the issues you have. That includes common problems like:
- Images being too big or not properly optimized, causing LCP violations.
- Having popups, widgets, poor design, or layouts causing a page to have a bad or even frustrating user experience by being unstable and causing CLS problems.
Defining the Core Web Vitals
The Google Largest Contentful Paint allows you to see how long it takes for your phone or computer screen to load with the first content. This metric is important because if a website doesn’t show up, users will not stay on that site and continue browsing other web pages. The First Input Delay tells you how quickly someone can click something like links and watch what happens next without having any lags in between clicks. Finally, Cumulative Layout Shift evaluates whether there are changes made from one page of a website’s design onto another by comparing screenshots as they were originally designed versus their final loading time frame when no major updates happen during this timeframe
Following these established visitor metrics will make your user’s experience on the site a good one, and they’ll come back often. This is crucial for search engines as mobile optimization and page experiences are now being seen as factors in ranking sites with SEO standards– you need to follow them!
In order to rank well on Google, it is important that websites consistently update their page experience. This was what the tech giant told us when they announced plans for rolling out a new upgrade in June 2021. The middle of next month will see all compliant sites have an opportunity to beat those not up-to-date with search engine optimization requirements by ranking higher than them!
The following core web vitals break down into performance metrics to measure loading speeds, how easy it is to use the site, and what its visuals are like. All these factors contribute to an excellent user experience that will keep your visitors on their toes and ensure they have safe browsing too.
Largest Contentful Paint (LCP)
Google measures how well a website performs by measuring the time it takes for content to load. Larger elements take longer, so Google tracks this statistic in order that they can more accurately measure success and provide better service. There are other ways of assessing performance as well, but these options may be too complicated or difficult to understand for site owners.
The LCP core web vital will work by focusing on the basic content that appears in a screen’s viewing area, such as paragraphs, headings, images, and text. However, it picks up only one of those elements for its load time test- typically whichever has the largest representation across your site to represent most accurately how long page loading takes.
Avoid using banners that are flashy or too large and an image as your hero; not only will it annoy visitors with its excessiveness, they might leave without even clicking through. Larger items should be targeted first by design so make sure everything loads quickly for optimum results and experience!
A high LCP signal, caused by the elements that take up the most space on your screen to load slowly, can leave visitors with a bad impression. It makes it seem like the site is slow and takes longer for them to access the content. User’s perception matters when they come across an online resource; if users are not happy due to a bad experience then they will walk away from your website without stopping at all or making any purchases. Your ranking in search engines suffers as well because of this – you’ll get more traffic but no conversions which mean less revenue coming through every month!
When it comes to mobile devices, you need a website that loads quickly and is easy to navigate. If your site does not have these qualities, then you should work on that now. With the focus on core web vitals and LCP signal as an SEO ranking factor – there are even stricter ways now of measuring how well your site will rank for search engine optimization purposes
– if your metrics are not up to snuff in terms of loading speed or usability on most mobile platforms (as opposed to solely focusing on Google’s browser), chances are good users won’t be visiting much at all. So ensure you are keeping up with this measurement so your SEO does not get harmed.
As most of us are aware, the average website loading time is around four seconds on a mobile device. But what could account for such differences in how long it takes? For example: The median site takes six seconds to load, but this does not matter as much because there are fewer people accessing sites in the middle of these two numbers. Sites with more than seven-second loading times have 40% less traffic from phones and tablets compared to those who only take four seconds due to increased bounce rates when they don’t successfully render their content within that timeframe (even if it looks good).
The LCP signal is an essential part of a website’s user experience. A target metric for the LCP signal is 2.5 seconds or less, which can be measured by looking at page loads and dividing that into mobile and desktop times/page-load to get your FID score as well as CLS scores.
First Input Delay (FID)
The time it takes for you to see a response on your screen after one of your actions is important. If there’s any pause in the process (less than 100 milliseconds), users will be angry and less likely to come back again. This means that an efficient website needs short input delays so that users can quickly accomplish their tasks without problems!
The first input delay is used as a way to measure how well websites respond after someone does something with them (a user interaction) –so if they have long pauses between inputs or responses, then this could cause trouble among visitors because they’ll feel like nothing was accomplished and may not return at all. Therefore when creating sites it’s essential for efficiency purposes–having these shorter input/response times ensures happy customers.
To give you an idea of the effects of a bad FID signal, imagine visiting a poorly structured website – with sluggish performance. You try to sign up for the newsletter or add an item to the cart but get a delayed response. This page has high FID which means it will make you frustrated and leave without completing any tasks on this site that would benefit your goals! The number measures reactions by users when they first interact with content in comparison to all other interactions within their session (opening another tab).
If your site is loading slowly due to these metrics or the essential actions are poorly coded, you could be risking business. One way to assess whether this happening to you is if users report experiencing sluggish speed or bugs on your website. Ensure you are monitoring this measurement yourself and via CruX.
As site owners, missing a business opportunity is like missing your chance at getting a new customer. Without the opportunity, you might not get them as long as you don’t have them. The domino effect will also impact bounce rates, how well your site ranks in google search (SEO), and the conversion rate
Cumulative Layout Shift (CLS)
The worst thing that can happen to a visitor is having the layout of your site shift without warning. Cumulative Layout Shift will make sure this doesn’t occur by making sure text size and images don’t change during loading time, so visitors on your website are never frustrated with what they see when it’s finally loaded!
It’s moments like these when you feel as though time is standing still, your eyes darting from the top of the screen to the bottom in a frenzied search for an “OK” button. You’ve tried clicking on everything and it just won’t move! And then all of sudden this big box pops up that covers everything below it! Your heart sinks because now you’re back at square one with nothing more than an “OK” button in sight–and no matter how hard you try clicking first thing on top can’t budge either. This is a large change that can cause frustration and interest to be gone.
Websites can be so frustrating sometimes but luckily they have solutions like pop-up blockers which will prevent these pesky pop ups from popping up again anytime soon without permission.
Slow load times can happen when you are looking at a page. This happens when the browser is redrawing what is on your screen, and if elements move around without being prompted, users may think that website or app is slow or buggy. They might get upset and not want to use it again in fear of encountering more frustrating user experiences like this one time they were having trouble with their site’s performance which was probably no fault of theirs – after all, we’re only human!
The key point here boils down to keeping websites fast for optimal user experience; browsers work hard by updating pages every second so there should be very little movement (layout shifts) from page to page (unless absolutely necessary). Site owners need to be watching this signal and don’t forget about using CruX.
Be careful to keep your CLS score low. A higher than necessary number can mean that you might not be able to get a lot of traffic to your website, which will make it difficult for buyers and sellers alike. Is your CLS in compliance? If so, then you have no problem with getting as many people through your doors or on your website pages as possible—though only if the other core web vitals are healthy too!
Tools for Measuring Core Web Vitals
There are many tools that a webmaster can use to measure how the website is working and track related signals that impact your SEO. These tools include the Google Search Console, Page Speed insights, Chrome User Experience Report (CRuX), Web Page Test, Fast or Slow, and GTMetrix. Here’s some more detailed information on these three tools:
- CRuX is an insider Google tool that analyzes user behavior and measures a variety of metrics and signals over the website’s performance in Chrome. Consider this is where Google’s field data comes from.
- WebPageTest.org is a handy, open-source tool for evaluating web performance across many browsers and mobile devices.
- GTMetrix is also a free and detailed website that will test the performance of your website.
- Use the Fast or Slow tool to find out if your website is accessible on any desktop device.
- Google’s Search Console information has tools that can help you identify ways to improve website speed and show Google-collected data to help make improvements to your signals.
- The Page Speed Insights service is usually considered the authority for the core web vitals report and its signals.
However, if you want to do your own field research about how your pages are performing, then it would be best to use a Real User Monitoring solution. This will actively track where and when users are loading the site in order to discover web vital information and measure user interaction for mobile and desktop. Knowing this can help prioritize changes that need to be made for the update so your rankings don’t get impacted. This will effectively allow you to capture your own field data along-side Google’s as every signal matters for your SEO.
Improving Google Core Web Vitals For Your Business
Now that we have explained what the core web vitals are, how these page experience metrics, and every signal impact a user’s experience and the mobile-friendliness of your website, let us now talk about how it becomes an SEO ranking factor for your search rankings.
Now let’s talk about how to make your user experience better with each page experience signal we have discussed, ensure safe browsing, and website content faster.
This is especially critical for mobile devices since they are less capable of handling complex pages with the same level of success as desktop. The site’s ability to run best practices like Google’s page speed insights will have a direct impact on how well your website fares in today’s tech-driven world.
The goal is to produce lower LCP, FID, and CLS web vitals measurements. The reverse would lead to a higher score and page experience signal in these metrics which would negatively impact you, and risk interest to be lost.
Reducing Page Embeds
It is not practical for every business to remove these elements completely, but minimizing and being smart about when and how they are used can make a big difference.
Do remember that PageSpeed Insights will often tell you when it detects these embeds, especially if they are taking a toll on speed.
Minimizing Site Trackers and Analytics
While this can be similar to site embeds, it is also distinct. The internet is filled with vocal opinions on how to track every inch of your site to get conversions for your business. And these services will indeed work in many cases and boost your revenue as intended.
However, what is less talked about or sometimes even known, are the potential negatives. Many of these trackers can be poorly developed and continuously load from a slow server. Or if they are well made and run smoothly on your CPU, they may still be significantly CPU intensive for your mobile accessibility needs.
Sometimes, website monitors can take over a second to send data back from your visit. When using 3G or 4G on a mobile device, this is insane!
This can negatively impact your FID (first input delay) and CLS (cumulative layout shift) metrics and page experience signal, causing your pages’ experience to be slow and laggy, causing interest to be lost. This can also impact your contentful paint if bad enough.
In summary for this, be smart and selective with loading 3rd party services on your page. This alone can have a massive improvement.
Your images are probably the largest item in page size after videos or other embeds (may be a good idea to remove any that are not necessary). The most common mistakes made with using images on WordPress are:
- The images are too large for the page. On mobile and desktop, the images need to fit into a percentage of the screen’s real estate. The device’s CPU, or chip, has to download the image and then resize it for smaller screens. This can make slow connections or older devices really sluggish when viewing content on their screen as they struggle to process an irrelevant scaled-down version of a large graphic file that is needed for larger displays. This is a waste of resources, both processing, and connection.
- A real photo should be in JPEG format, while drawings, icons, or another type of illustration are better suited for PNG. Animations should be a GIF if they are more than five seconds long or a video file if the animation is long enough.
- The images can be compressed to save server space and download times, as well as rendering effort.
PageSpeed Insights will often tell you which images it considers an issue if not all. Image optimization is usually easy to perform, though, there are some catches and hiccups that can be tricky. This will help improve the LCP core web vital in many cases.
Modern pages now contain many more elements than they did a decade ago. The Internet has undergone rapid change. However, we don’t need to display so much on the page as soon as it loads up. Our screens cannot show all of that detail anyways! So for a better user experience, content should be loaded in just when needed and not before then.
To optimize your load time, you should reduce the resources needed to initially load a web page and gradually build up. This will allow for better navigation on mobile devices since the page loads in small chunks that are manageable.
It is great that Chrome now supports native lazyload in some cases for simpler elements such as images. This is also turned on by default in WordPress! You can also use Google’s plugin.
Lazy Loading Videos
Automatically loading videos is one of the most common actions done when a website owner lazily loads content. The most common scenario is having YouTube video embeds. To improve the page load speed, show a thumbnail that will automatically load and play the entire video on demand when clicked instead of just loading the embed which will cause a large penalty.
This can be implemented via one of many WordPress plugins, but not all are equal. Test these plugins to ensure your choice does not negatively impact the Google CLS metric and page experience signal and its page experience.
PageSpeed Insights can give you insight into videos performing badly.
In summary, lazyloading will ensure that you do not need to load what is unnecessary until it is needed on your pages. This should result in a better experience overall.
Optimize and Reduce Fonts
Common errors seen in PageSpeed Insights are related to how fonts are loaded on the page.
Fonts are often a large part of the webpage. They have to load before any text can be displayed, so they might impact your LCP and layout shift page experience signals. Fonts also tend to be heavy in file size, with fonts larger than 5 KB typically being considered heavyweight.
You have the option of using CSS to have a fallback font; however, this can be either not desired or bad in some cases. One example is icon fonts. These are popular as they are simple to use. But they can also be negative since icons rendered as text needs the loading of a font to be properly shown. Until then, you have something that looks ugly and breaks the page experience.
Fonts are an additional asset to load, which impacts users if improperly used. Font selection should make logical sense and each font should be used sparingly.
The web vitals update only plays a subset of the larger Google page experience update. Other parts which can be found in Google search console, include:
- Mobile-Friendly: Do your page design and page layout look and perform well on mobile? If a mobile page is sluggish or buggy, this will fail the page experience. Owners of a website need to ensure that their pages work as they are intended across all devices for this criterion to pass.
- Safe Browsing: Do you keep an eye on your pages to ensure there is no malware or malicious activity? This sounds like something that should not have to be done, but it is necessary for page safety.
- HTTPS: Ensuring the connection is encrypted for the URL, so users feel safe when they are in a public place.
- Intrusive Interstitials: these can simply be considered popups, and usually badly designed ones. Everyone finds them annoying, so if used, ensure they are not in the way and actually benefit the user, otherwise a page experience signal could be impacted. A common example of this is an ad that pops up on a page before you have finished reading it.
Page Experience Report
Google recently released a new tool to measure the page experience of users in their search console. It gathers live core web vital data as well as information gathered from other sources, like search results and CruX data which comes from searches made on your browser.
Your web performance is best measured by the LCP, FID, and CLS metrics. These three are also essential for SEO and page performance on key ranking tools such as Google PageSpeed Insights (PSI).
We have a Google PageSpeed score above. We want to show you what we can do for you and your search results. Feel free to use us as an example URL.
If you need assistance getting your web vitals data into compliance or if you have any questions about these important metrics, let us know! Our team is ready and waiting to partner with you to create a stellar user experience!
Which of these metrics do YOU monitor? If you need help with this, please fill out this form below!