Core Web Vitals are three metrics that Google uses to assess the user experience of your website. Since 2021, they have been an official ranking factor for SEO. At Theory7, we help you understand what these metrics mean and how to improve them.

What are Core Web Vitals?

Core Web Vitals measure three aspects of user experience: loading speed, interactivity, and visual stability. Google collects this data from real users via Chrome and uses it to evaluate websites. Good scores help your ranking, poor scores can cost you positions.

LCP: Largest Contentful Paint

LCP measures how quickly the largest visible element on your page loads. This is often the main image, a video thumbnail, or a large text block. A good LCP is under 2.5 seconds. Between 2.5 and 4 seconds is moderate, above that is poor.

Improving LCP

Optimize your server response time. With LiteSpeed hosting at Theory7, you already have a fast foundation. Enable server-side caching via DirectAdmin.

Compress and optimize images. Use modern formats like WebP and ensure images are no larger than necessary. Large hero images are often the culprit of poor LCP scores.

Use a CDN for static content. A Content Delivery Network delivers images and scripts from servers close to your visitors. Cloudflare is a free option that works well with Theory7 hosting.

Preload important resources. Add preload hints for your LCP element so the browser gives it priority. Use the link rel preload tag in your header for critical images.

FID: First Input Delay (now INP)

FID measured how quickly your website responds to the first interaction from a user, such as a click or tap. Google has now replaced FID with INP (Interaction to Next Paint), but the principle remains the same: your site must respond quickly to user actions. A good score is under 100 milliseconds.

Improving FID and INP

Minimize JavaScript. Heavy scripts block the browser and slow down interactions. Remove unused plugins and scripts. In WordPress, you can disable plugins you are not actively using.

Split long tasks. JavaScript tasks that take longer than 50ms block the main thread. Modern caching plugins help by deferring scripts until after page load.

Use a caching plugin. LiteSpeed Cache for WordPress automatically optimizes your JavaScript and CSS, which directly improves your interactivity scores.

CLS: Cumulative Layout Shift

CLS measures how much the page layout shifts during loading. You probably know it: you want to click somewhere and suddenly the content jumps away due to a late-loading advertisement or image. A good CLS score is under 0.1.

Improving CLS

Give images fixed dimensions. Always specify width and height attributes on img elements. The browser then reserves space before the image loads.

Reserve space for advertisements. If you display ads, give the container a fixed height so content does not shift when the ad loads.

Load fonts correctly. Use font-display swap in your CSS so text is immediately visible with a fallback font while your web font loads. Consider system fonts for better performance.

Avoid dynamic content at the top. Banners or notifications that appear after loading push content down. Reserve space or place them at the bottom of the page.

Measuring Core Web Vitals

PageSpeed Insights

Go to pagespeed.web.dev and enter your URL. You see both lab data (simulated tests) and field data (real user data). Focus on the field data because Google uses that for rankings.

Google Search Console

In Search Console, you will find the Core Web Vitals report under Experience. You see which URLs score good, moderate, or poor, grouped by problem.

Chrome DevTools

Open DevTools with F12, go to the Lighthouse tab, and run an audit. You get specific recommendations per metric with estimated time savings.

Theory7 and Core Web Vitals

Our LiteSpeed servers are optimized for speed. With Brotli compression, HTTP/2, and server-side caching, you have an advantage over the competition. Combine this with the tips from this article for optimal Core Web Vitals scores.

Want to start with a fast website? Check out our hosting packages with LiteSpeed and give your website the speed it deserves.