No history yet

Technical Site Health

Beyond the Basics of Site Health

Technical SEO isn't just about fixing broken links or ensuring your site is crawlable. It's about performance engineering. To rank well today, your site needs to deliver a superior user experience, and that starts with how quickly and smoothly it loads. Google quantifies this experience using a set of metrics called Core Web Vitals (CWV). Mastering these is non-negotiable for serious SEO.

Think of it this way: a technically sound website is like a well-built shop. The doors open easily, the aisles are clear, and customers can find and interact with products without frustration. Core Web Vitals measure just how pleasant that shopping experience is.

Mastering Core Web Vitals

Core Web Vitals consist of three specific measurements that gauge your site's loading performance, interactivity, and visual stability. They aren't abstract numbers; they reflect how real users experience your pages. Let's break them down.

Largest Contentful Paint (LCP) measures loading performance. Specifically, it marks the point when the largest image or block of text in the viewport becomes visible. A good LCP score (under 2.5 seconds) tells users the page is useful and loading properly.

To diagnose LCP, you can use the Performance tab in Chrome DevTools to see a visual filmstrip of your page loading. For a broader view, Google Search Console’s Core Web Vitals report aggregates real-user data from the to show you how your pages perform in the wild.

Interaction to Next Paint (INP) measures interactivity. It assesses how quickly a page responds to user inputs like clicks, taps, or typing. A low INP (under 200 milliseconds) means your page feels snappy and responsive.

High INP is often caused by heavy JavaScript tasks blocking the main thread. When a user clicks a button, the browser can't immediately paint the visual feedback if it's busy running other code. INP measures this entire delay, from input to the next frame being painted.

Cumulative Layout Shift (CLS) measures visual stability. It quantifies how much unexpected layout shifts occur as the page loads. A good CLS score is below 0.1. Think of when you try to tap a link, but an ad loads above it, pushing the link down and causing you to tap the ad instead. That’s a poor user experience caused by a high CLS.

Common causes include images or ads without specified dimensions, dynamically injected content, and web fonts loading and causing a flash of unstyled or invisible text.

From Diagnosis to Optimization

Knowing your scores is just the first step. The real work is in the optimization. This involves digging into how a browser renders a page and strategically managing your site's resources. At the heart of this is the —the sequence of steps the browser must take to convert HTML, CSS, and JavaScript into pixels on the screen.

Optimizing this path is crucial for a fast LCP. A key factor here is your server's Time to First Byte (TTFB). This is how long it takes for a browser to receive the very first byte of data after making a request. A slow TTFB means everything else is delayed, no matter how optimized your frontend code is. Improving TTFB involves optimising your server application, database queries, and using a Content Delivery Network (CDN) to serve content from a location closer to the user.

For interactivity (INP), the primary culprit is almost always JavaScript. Modern websites are feature-rich, but this often comes at the cost of large JavaScript bundles. When the browser has to parse, compile, and execute a massive JS file, it can't respond to user input. The solution is bundle splitting and deferral.

Instead of sending one giant app.js file, you can split your code into smaller chunks. Load only the essential JavaScript needed for the initial page view, and then defer or asynchronously load the rest. For example, the JavaScript for a video player in the footer doesn't need to be loaded until the user scrolls down to it.

<!-- Standard script blocks render-blocking -->
<script src="large-bundle.js"></script>

<!-- Defer attribute tells the browser to download the script
     in the background and execute it only after the HTML
     parsing is complete. It does not block rendering. -->
<script src="non-critical-feature.js" defer></script>

<!-- Async attribute downloads the script in the background
     but will execute it as soon as it's ready, which can
     still interrupt parsing. Use for independent scripts. -->
<script src="analytics.js" async></script>

Finally, caching is your best friend for performance. Going beyond simple browser caching, modern sites use multi-tier caching. This involves multiple layers of caches between your server and the user.

  1. Browser Cache: Stores assets on the user's machine.
  2. CDN Cache: A global network of servers caches your content close to your users. This is crucial for reducing TTFB.
  3. Server Cache: A cache on your origin server (like Redis or Memcached) can store results of expensive database queries or pre-rendered page fragments.

takes this a step further, allowing you to run code directly on the CDN's servers. This can be used to handle tasks like A/B testing, authentication, or personalization without a slow round-trip to your origin server, dramatically improving both TTFB and INP.

When it comes to improving web performance, the journey usually looks like this:

Identify where the problems are Diagnose why they’re happening Fix the issues Validate that the fixes worked

Enterprise sites often face a trade-off between feature-richness and performance. A complex e-commerce site with personalization, live chat, and detailed analytics will naturally have more JavaScript and a more complex rendering path than a simple blog. The key is strategic optimization. Use the techniques above to ensure the core experience is fast, and progressively enhance the page with richer features after the initial load. A user will wait for a feature if the page itself feels fast; they won't wait for a blank screen.

Quiz Questions 1/6

What is the primary purpose of Google's Core Web Vitals (CWV)?

Quiz Questions 2/6

A user reports that your website feels 'laggy' when they click on buttons. Which Core Web Vital is most likely poor, and what is a common technical cause?

Building a high-performance website is an ongoing process of measurement, diagnosis, and optimization. By focusing on Core Web Vitals and the underlying systems that affect them, you create a foundation for both excellent user experience and strong search visibility.