In May of 2020, Google announced that they would be shifting their focus to page experience when selecting the top sites to appear in search results. This updated search algorithm would introduce 3 important new metrics for site owners to incorporate into their SEO strategies.
This change reflects the evolving nature of Google’s Web Vitals, which are a set of “quality signals that are essential to delivering a great user experience on the web.” Web Vitals are essential metrics for all site owners to keep tabs on, and Google has created user-friendly tools to help make site maintenance a breeze. Google Search Console and PageSpeed Insights are just a few solutions that can quickly identify and resolve performance issues.
This year, Google has specifically addressed 3 Core Web Vitals (a subset of Web Vitals) that it will assess for every page: LCP, FID, and CLS.
Core Web Vitals
Google’s Core Web Vitals include specific metrics and recommended targets for each metric. These metrics are designed to measure user experience and give developers helpful data about whether their site’s performance is good, average, or poor.
LCP, FID, and CLS are the crucial metrics that Google will be looking for this year, and for the foreseeable future. These Core Web Vitals are defined as:
- Largest Contentful Paint (LCP): This factor measures loading performance of the largest item on the page. LCP should happen in 2.5 seconds or less to provide the best possible user experience.
- First Input Delay (FID): FID measures user interactivity on a page. A user should be able to interact with a page and have it respond to their actions in 100 milliseconds or less.
- Cumulative Layout Shift (CLS): This factor measures the visual stability of a page, or how much each component “shifts” around as the page is loading. The measurement of a good score is 0.1 or less.
To make sure site owners are reaching their targets, Google recommends measuring the 75th percentile of page loads for both mobile and desktop users.
How to Measure Core Web Vitals
If you already use Google’s tools for measuring other Web Vitals, you can easily add new metrics to analyze Core Web Vitals as well. Elizabeth Sweeny and Addi Osmani explain in a web.dev article that “…all of Google’s popular tools for web developers now support measurement of Core Web Vitals, helping you more easily diagnose and fix user experience issues.”
Sweeny and Osmani recommend using both lab tools and field tools to gain the most accurate insights. Lab tools show you how potential users might experience your site, whereas field tools analyze the experiences of actual users. You can use the following workflow to start using the latest capabilities of each Google tool:
- Start with Search Console by generating a new Core Web Vitals report. This function will analyze your pages and point out any areas of your website that should be improved
- Next, go to PageSpeed Insights to identify any lab or field issues on a page.
- Use Lighthouse and Chrome DevTools to measure your site’s Core Web Vitals and learn exactly how to fix any problem areas. You can even download the Web Vitals Chrome extension to view your site’s metrics in real-time.
- If you want a custom dashboard for the Core Web Vitals, you can use the new Chrome UX Report API for field data or PageSpeed Insights API for lab data.
- For additional guidance, head to web.dev/Measure. Simply enter a URL, hit “Run Audit,” and receive immediate advice for optimizing your site according to PSI data.
- Lastly, use Lighthouse CI to double-check your updates before you finalize your work.
Optimizing for Core Web Vitals
After you’ve added the new metrics for LCP, FID, and CLS to your analytics dashboard, the next step is to monitor your site’s performance over time. Philip Walton, an engineer at Google, recommends the following best practices to ensure that the Core Web Vitals updates are positively impacting your website:
- Create a unique version for every deployed change you make. If you simply update the production version, the metrics might not be represented properly due to the CDN layer, service worker, or caching at the HTTP.
- Try running experiments to see if a certain change makes a difference in user experience. You can compare the new version with the control version to see if any improvements can be found. If the new version performs better, then you can roll out the adjustment for all customers.
- Don’t track more data than you need. There’s no point in collecting data that won’t help you reach your goals.
For more optimization tips, you can check out our most recent blog posts about customer experience here!
