How to Improve Core Web Vitals

This is not something that happened recently. It was quite a long time ago. I used to read some blogs after work. It was not something special for me. It was just a hobby after work. And then, I also had an interest in writing in detail about what I read. My blogs used to get decent traffic. Maybe around 15,000 visitors, and I was quite satisfied with that traffic.

I mostly read tech-related blogs. So, I read a blog related to Google Search Console and after reading it, I went to my own Search Console. I had read about Core Web Vitals in that blog. When I went to Core Web Vitals in Search Console and saw that almost half of my pages had been flagged, I was surprised.

At that time, I had no idea what this was. But I understood enough to know that it was not a good thing. I started searching for more information on Google and read many blogs. In these blogs, I saw words like Cumulative Layout Shift. But it was not explained what these words actually meant. So, I closed my laptop and started thinking more about it.

It took me quite a lot of time to understand and fix this problem, which included trial and error. So, all the blogs I read and the things I fixed, I have written this whole journey in this blog. And the amount of time I spent learning, I want to teach you in this blog in the same way I wanted to learn it myself.

What Is Core Web Vitals?

Basically, Google checks whether your website feels fast and works properly for a real visitor or not. For this, there are three things.

The first is Interaction to Next Paint. It means when someone clicks on something on your website or on a blog, how much time your site takes to respond.

The second is Cumulative Layout Shift. It means that when a page loads, whether the information that appears moves from its original position to another position after loading or stays in the same place. For example, an advertisement may appear, and because of this, you may accidentally click on something else.

And the third is CLS. This happens to check whether your website page opens quickly or takes some time to open, and whether it remains stable or not.

Then, when I saw these problems on my own site, different thoughts came to my mind. I thought this problem could also be because of my hosting, so I even spent money to upgrade my hosting. I also bought a paid tool to check my website speed.

Finally, I found out which thing was actually making my website slow.

What Actually Fixed Things (Step by Step)

1. Compress and resize your images before uploading them

This alone fixed most of my LCP issue. I was uploading 4-5MB photos straight from my phone without even thinking about it.

Now I run every image through TinyPNG or Squoosh (both free, both take like 10 seconds) before uploading. I also resize images to the actual size they’ll display at — no point uploading a 3000px wide photo if it only shows at 800px on the page.

If you’re on WordPress, plugins like Smush or ShortPixel can do this automatically going forward, but I’d still recommend manually cleaning up your existing image library once.

2. Set width and height on your images

This one fixed my layout shift problem almost completely. When you don’t tell the browser how big an image is going to be, it doesn’t reserve space for it — so when the image finally loads, everything below it jumps down.

Just adding width and height attributes (or using a theme that does this automatically) tells the browser “hey, leave this much space” before the image even loads.

3. Get rid of plugins and scripts you don’t actually need

I audited every plugin on my site and asked myself honestly: do I use this? Two of the six I had installed hadn’t been touched in over a year. Deleting them didn’t just help speed — my dashboard got noticeably snappier too.

If you’re not on WordPress and you’re using a page builder or lots of embedded widgets (chat widgets, review widgets, social feed embeds), do the same audit. Every extra script is one more thing your browser has to download and run before it can respond to a click.

4. Use a caching plugin or built-in caching

If you’re on WordPress, something like WP Rocket or the free W3 Total Cache stores a “ready-made” version of your page so it doesn’t have to rebuild everything from scratch every time someone visits. This made a real difference for LCP.

If you’re on Shopify, Wix, or Squarespace, a lot of this caching is handled for you already — but it’s still worth checking their speed settings, because some have optional features (like extra animations or apps) that slow things down if you turn them on.

5. Lazy load your images

Lazy loading just means images below the fold (the part of the page you have to scroll to see) don’t load until the visitor actually scrolls near them. Most modern themes and CMS platforms support this natively now, or you can add loading="lazy" to your image tags.

Be careful though I made the mistake of lazy-loading my main hero image too, which actually hurt my LCP score because that image needs to load right away, not later. Only lazy load stuff below the fold.

6. Minimize what happens when someone clicks something

This is the INP part. If your site feels laggy when someone taps a menu or a button, it’s usually because too much JavaScript is running at once.

For me, that fancy homepage slider I mentioned earlier was the culprit. I swapped it for a simple static image with a headline, and honestly, it looked cleaner anyway. Sometimes the “fancy” option isn’t even better for user experience it just feels more impressive to us as the site owner.

7. Choose decent hosting (but don’t overspend chasing this alone)

Hosting matters, but it’s not a magic fix. I want to be honest about that because I fell for the idea that better hosting alone would solve everything. It helps with server response time, sure, but if your page is loaded with unoptimized images and unnecessary scripts, good hosting just means your bloated site loads slightly less slowly.

Tools I Actually Use to Check My Progress

• PageSpeed Insights (pagespeed.web.dev) — free, straightforward, shows you exactly what’s wrong
• Google Search Console — shows real-world data from actual visitors, not just a lab test
• GTmetrix — good for a more detailed breakdown, especially if you want a waterfall view of what’s loading and when
• Chrome DevTools (built into Chrome, just hit F12) — has a Lighthouse tab that gives you a full report right in your browser

I’d suggest checking Search Console over PageSpeed Insights when in doubt, because Search Console reflects how real visitors on real devices are experiencing your site — including people on older phones or slower connections, which honestly is a huge chunk of internet traffic.

Mistakes I Made (So You Don’t Have To)

Mistake #1: Testing only on desktop. My site looked fine on my laptop but was genuinely slow on mobile. Most of your traffic is probably mobile too, so always check mobile scores separately.

Mistake #2: Chasing a perfect 100 score. I spent way too long trying to get a perfect green score across the board. Realistically, “Good” is enough. A 95 with a fast, functional site beats a 100 that took you three weeks of tweaking code you don’t fully understand.

Mistake #3: Adding a speed plugin and calling it done. Speed plugins help, but they don’t replace basic good habits like compressing images and not overloading your page with widgets.

Mistake #4: Ignoring third-party scripts. Things like ad networks, analytics tools, and embedded YouTube videos all add weight to your page. You can’t remove all of them (I still run ads, that’s how the blog makes any money), but it’s worth knowing they’re part of the equation, not blaming everything on your own content.

A Real Example That Made It Click for Me

One of my recipe pages had a huge step-by-step photo gallery. Beautiful to look at, terrible for speed — twelve full-size images loading immediately on page load.

I switched to lazy loading for everything except the first photo, compressed all the images, and added proper width/height tags. That single page went from an LCP of about 4.8 seconds to under 2 seconds. Same content, same photos, just handled smarter.

That’s when it actually clicked for me improving Core Web Vitals isn’t about ripping out your content or dumbing down your design. It’s about being intentional with how that content loads.

Technical SEO Checklist for WordPress Websites

Internal Linking Strategy That Improves Rankings

Final Thoughts

If your Core Web Vitals report looks scary right now, take a breath. Mine did too, and it wasn’t some deep technical failure it was a handful of small, fixable habits I didn’t know were causing problems.

Start with your images, check your plugins or embedded scripts, and actually look at what PageSpeed Insights is telling you instead of guessing. Fix one thing at a time, recheck your scores, and you’ll probably be surprised how quickly things improve.

It’s not glamorous work, but it’s genuinely one of those rare SEO tasks where you can see the real, measurable difference both in your Search Console numbers and in how your site actually feels to use.