Optimizing Your Niche Site For Core Web Vitals: Tools, Process, and Questions

Optimizing your niche website for Core Web Vitals (CWV) is a tactic to help improve a part of your users’ overall page experience. Google has already confirmed that page experience is a signal they use to determine search engine ranking. 

Back in May 2020, Google announced that CWV will eventually become one of the elements they assess as part of their overall page experience signals. 

The other elements of page experience being mobile-friendly, safe browsing, secure pages (HTTPS), and intrusive interstitials (think annoying popups that cover the screen and are difficult to close).

In this write-up, the following will be covered:

• What is CWV?
• Why care?
• Tools for testing CWV
• Optimization tips with and without display ads
• Common questions

I’ve invited Keith Mint to collaborate on this article. He runs a portfolio of websites and also blogs at Minted Empire. He has spent a good amount of time studying and improving his websites for CWV. I will provide any insights within the article as well.

Let’s get into it!

What Are The Core Web Vitals?

Google has broken the Core Web Vitals into three main elements:

1. Loading – Largest Contentful Paint (LCP)
2. Interactivity – First Input Delay (FID)
3. Visual Stability – Cumulative Layout Shift (CLS)

There are already a lot of definitions and explanations about the Core Web Vitals elements on the web. I’ll summarize them in non-technical language very quickly:

1. LCP – when a page loads, this is the time it takes for readable content to appear.
2. FID – when a page loads, how quickly can the user interact? E.g. click on a menu.
3. CLS – a measure of how the elements get pushed (usually down) the screen after another element has loaded. 

Here is an informative resource for further reading on these factors.

---

Why Bother Optimizing For CWV?

I see two important reasons why niche website owners should optimize their Core Web Vitals.

Firstly, as confirmed by Google, it’s going to be a ranking signal for the world’s most popular search engine.

Secondly, paying attention to and optimizing for user page experience can improve the conversion rate for that page.

---

How Do Ad Networks Complicate The Optimization Challenge?

Optimizing for core web vitals can be challenging. This is especially so if your site is integrated within a display ad network that employs its own site speed optimizations. 

When it comes to optimizing for speed, the biggest mistake I’ve seen website owners make is to use plugins that perform similar functions to the optimization technology being used by the ad network.

This often results in conflicts and it can manifest itself in very low site speed scores.

Depending on the configuration of your website and the various layers of technology deployed, optimizing can become a technical headache.

I recently spent some time optimizing my own sites for core web vitals. I was able to get very high scores for my website that doesn’t have display ads. 

As for my site that does run display ads, I had more work to do as you will read below.

---

Tools for Testing Website Page Speed

There are lots of tools available for testing the performance metrics of a web page. They include:

• Google’s PageSpeed Insights
• Gtmetrix
• Pingdom
• Catchpoint’s WebPageTest

While Gtmetrix’s waterfall report is nice to debug certain page issues, I instead mostly used Google’s PageSpeed Insights to run my speed tests. It made sense to optimize for Google’s tool because it’s their algorithm that we’re ultimately trying to impress.

---

My Approach to Optimizing My Niche Websites for Core Web Vitals

I have been optimizing for website speed for over a decade now. I’m aware that the optimization process can be incredibly nuanced.

So, I decided to take a very simple approach. 

Every website is different so there is little to be gained from me sharing the exact setting I used for every plugin or configuration setting. Blindly following that approach is highly likely to break some functionality on your website. Troubleshooting could prove difficult. 

Instead, I’ll describe the approach I took to achieve high scores. There is much trial and error involved.

I started by optimizing a non-niche website I own. It’s a lead gen business with low monthly traffic. It runs on WordPress. It doesn’t have display ads. It’s very minimal but still looks attractive to potential leads.

Before optimization, it was typically scoring between 40 and 50 on mobile and failing all of the Core Web Vitals.

After some tweaking, I achieved this:

That’s great but I didn’t get too excited about it because I knew it would be almost impossible to achieve the same result on a website that uses a third-party display ad network.

However, the result showed me that I was starting off on the right foot in terms of my choice of tech stack.

Before I get into the details of what I did to achieve that score, it’s important to note that each time I run Google’s PageSpeed Insights, I got different results.

I ran the PageSpeed Insights ten different times, always using the same randomly selected blog post.

Overall, using a simple average calculation, the site passes CWV. However, tests 2, 3, and 7 failed CWV because the largest contentful paint (LCP) was showing as greater than 2.5 seconds.

What’s interesting is that the page being tested doesn’t change dynamically in any way. There are no third-party connections being made from the page. There are no externally hosted fonts being loaded, for example.

Delving into the exact whys and hows as to why these results might be different is beyond the scope of this article. Admittedly, it’s also beyond my comprehension. Frankly, when a page is scoring that high, it probably doesn’t matter why the scores vary like that.

However, as the complexity of the tech stack grows, varying test scores can make optimizations even more nuanced. 

I’ve run hundreds, if not thousands, of tests. Mobile always scores lower than Desktop. Now, I don’t even look at the Desktop score when I’m testing. To me, it doesn’t matter. I’m hoping Google feels the same way given that they switched to a mobile-first index some time ago.

Let’s dive into the steps I took to achieve this average PageSpeed Insights score of 97.4 on mobile.

1. Use Fast Hosting

The site was originally hosted with SiteGround. I migrated it over to my CloudWays account where I have a Vultr High-Frequency server running. It’s minimum spec, the lowest option you can currently choose when signing up.

I kept the original site files and database on SiteGround as a backup. I can’t stress enough the importance of taking backups at various stages of an optimization process.

Mushfiq’s notes: I also use Cloudways on a Digital Ocean server. Cloudways, in general, is amazing so whatever backend server you use, whether Digital Ocean, AWS, Vultr, etc., will not make a difference.

2. Use a Lean Theme

I changed the WordPress theme to GeneratePress Premium (GP). 

GP is nicely modularized. I only enabled the particular modules I needed to rebuild the look to be very similar to the original design.

Mushfiq’s notes: I am also a strong proponent of GeneratePress Premium partnered with GenerateBlocks. Every site I purchase gets redesigned using GeneratePress.

3. Plugins – Removing Bloat

I thought about each plugin before I enabled it on the website. It had to be essential for the website to function properly or an essential part of my sales funnel.

I got rid of Google fonts and kept GeneratePress’s default system fonts. I like and appreciate design. I didn’t expect to like the look of system fonts, but they’re surprisingly clear and they look good to my fussy eyes.

If a plugin was “fluff”, I removed it.

I enabled Rank Math SEO and only enabled the modules I wanted. I turned off Rank Math’s Google Analytics module because even though I do own the premium version, I could not get their ‘load ga.js locally’ functionality to work correctly. It kept requesting the analytics Javascript file remotely no matter what I tried. More on this later.

Mushfiq’s notes: If you acquire a site or have built a site over many years, plugins get added and never removed. Do a plugin audit! Remove any plugins that have no value and consolidate where possible. For example, many site owners add a social sharing plugin. First, most niche sites will not get shared on social media so it’s worthwhile to remove it until the site is a true brand.

4. Plugins – The Needle Movers

All of the website speed experts will preach about the importance of optimizing images. I completely agree with them.

There are many plugins available to optimize images. I’ve tried a few of them and settled on ShortPixel.

I use ShortPixel with lossy settings to also serve WebP images. If using CloudFlare, pay attention to which method you use for serving WebP images. The .htaccess redirect method does not work with CloudFlare.

PerfMatters Plugin

Perfmatters is an excellent plugin for controlling which scripts and CSS files get loaded to each category, post type, or individual page/post on your website.

For my site, I was able to use the majority of the optimizations. The PerfMatters plugin also allowed me to load Google Analytics’ script locally whereas RankMath Pro’s local GA functionality didn’t work correctly for me. Perhaps this has been resolved in a later update.

PerfMatters’ Script Manager is an amazing tool. To get the most out of it, you’ll first need to understand what scripts and CSS files are actually needed to make your website function as it should.

It’s important to look at how all the individual JS and CSS scripts load BEFORE you go combining and minimizing them. This makes it easier to handpick the individual scripts that you need to disable/enable on certain pages/posts/sections/custom posts etc. from the Script Manager.

So just as an example, I now have my form script loading ONLY on my contact page. As a local business, the contact page is essential for my business in terms of gathering leads.

As another example, I have a custom post type section that was loading scripts and CSS files SITEWIDE. Thanks to Perfmatters, this now only gets loaded on the section of the site that actually needs them.

After a bit of tweaking with enabling and disabling the individual CSS and JS files, the focus here was to make sure that the site looked and worked correctly.

Speed is not a concern yet.

Once I was happy I had the correct settings, the next step was to enable and configure Breeze which is CloudWays’ caching program. It has similar functionality as WP Rocket, WP Super Cache, W3 Total Cache, SG Optimizer, etc.

Mushfiq’s notes: I have not personally used Perfmatters (but have good things). I use the free Asset Cleanup Plugin. This plugin allows you to remove scripts of specific pages.

Breeze Caching Plugin

I used Breeze because it is developed and designed to run on CloudWays servers. SiteGround uses SG Optimizer. They’re both decent plugins. WP Rocket is also good.

However, for my current stack, Breeze was my plugin of choice.

I turned on all of Breeze’s optimization settings. Gzip compression, full minification with JS and CSS files both grouped together.

Next, I tested the site incognito with all caching cleared. Everything looked good and works as expected. My contact form generates leads. That’s the most important thing!

Varnish is another server caching level and this is enabled and configured via Breeze.

Your mileage may vary in terms of which files you can minify or include in the grouping. Certain functionality on the website may break. It’s important to test and see what you can get away with. 

I was lucky that everything worked the first time for me. That’s one advantage of going for a simple design with minimal functionality.

Mushfiq’s note: I am a strong proponent of using WP Rocket. It’s a paid premium plugin and it gets installed on all of my sites. At the end of the day, any plugin that does website caching will do the job.

5. Integrate a CDN – CloudFlare

Finally, I added CloudFlare (their free version).

I activated CloudFlare’s APO which uses their edge network to cache a WP site. I’m not sure this actually moved the needle for my particular setup. Maybe it would have done more if I was trying to load several remotely hosted Google fonts.

Mushfiq’s note: Cloudflare is a must. I integrate it on all of my sites. I only use the free version; you do not need the paid version for content sites.

---

How To Optimize Niche Sites For Display Ads

This is where the fun starts!

My next task was to see how I could implement my speed improvements on one of my niche websites that display third-party ads. 

I use Ezoic. It’s a simple fact that display ads from any provider will slow down a website. Period. All we can hope for is to optimize the site as best as we possibly can. A perfect score is unlikely in this scenario.

First, I followed my techniques above, almost to a tee. Same hosting setup, same WordPress theme, and a very similar plugin stack.

Next, with Ezoic temporarily disabled, I ran a speed test ten different times. I allowed one minute to lapse between each run.

Here are the speed test results:

I’m not sure what happened with test result 6 above. A CLS of 0.1 or less is considered good. So, my average CLS of 0.1 just passes. 

Purely out of curiosity, I later refreshed test 6’s result and it showed a CLS of 0. Perhaps it was a glitch in the matrix. I’ve left the test results unmodified though.

Bottom line is that overall, without ads running via my integration with Ezoic, my niche site passes Core Web Vitals based on lab tests.

Enabling Ezoic And Assessing The Impact of Display Ads on CWV

Next, I re-enabled Ezoic on my site and turned on their new Leap optimization tool. Leap will be replacing Ezoic’s Site Speed Accelerator toolset. 

Leap is currently in beta and after many hours of tweaking, these are the best scores I was able to achieve:

The average score for Largest Contentful Paint (LCP) is 2.6. It needs to be 2.5 seconds or faster to be considered a pass. 

It’s disappointing to be so close but perhaps when Ezoic’s Leap comes out of beta, it will have further optimizations that will allow my site to fully pass Core Web Vitals.

From my testing, the opportunities listed on the analysis page of Google’s PageSpeed Insights testing tool always relate to scripts being loaded by Ezoic in order to display the ads.

It’s not perfect, but I consider it good enough for a website that loads personalized display ads.

---

Common Questions about CWV

---

Wrapping Up

We’ve known for a long time that a faster website increases conversions and improves the overall user experience.

It’s worth investing a bit of time into optimizing your niche site for Google’s upcoming Page Experience Update expected in mid-June. Core Web Vitals will be an essential component of the Page Experience although nobody knows for sure what impact the update will have on the SERPs.

As it can be incredibly nuanced, the easy wins will be to focus on the optimization basics. These basics include:

• Fast hosting with a decent Time To First Byte (use Cloudways)
• Image and font optimization including next-gen images and lazy loading (use Shortpixel )
• Minification and grouping of CSS and JS files (Use WP Rocket, Breeze, or other caching plugins)
• Loading external script files locally where possible
• Prefetching DNS
• Appropriate expires headers

The 80/20 rule applies here for sure. You’ll probably achieve 80% of the optimization benefits in the first 20% of the time spent. Google has acknowledged that this is an evolving area and future additions to the Core Web Vitals can be expected.

Mushfiq’s notes: Google also likes to remind publishers that a good page experience doesn’t override the importance of having great content. Perform the easy wins and publish great content!