What is Google Page Experience and Its Impact On Your Website

 

What exactly helps you rank higher in Google Search?

While there’s no straightforward answer, one thing is clear—Google rewards websites that follow best practices for:

• Helpful content creation
• Mobile responsiveness
• Security measures
• User experience

In the last four years, Google has rolled out numerous search updates aiming to constantly tweak (and improve) their search algorithms and ranking systems.

Arguably, one of the most impactful is the page experience update.

Read on to learn why it matters, how it’s evolved, and where to focus your attention to improve your SEO.

Check your site’s user experience with NitroPack’s free performance tester →

What is Google Page Experience?

Google page experience refers to a set of ranking signals that measure whether site visitors have a good experience when browsing a web page.

This concept started as a mobile-only initiative but later came to evaluate desktop websites, too.

 

Let’s look at a quick timeline of Google’s priorities when ranking your web pages in search.
 

Speed in Google’s ranking signals (brief history)

Site speed wasn’t always a factor in SEO.

In fact, Google went through a few iterations before cementing its intentions for the faster web:

• April 2010: Site speed was first prioritized as an aspect to determine ranking along with existing signals;
• January 2018: Site speed became an official ranking signal in mobile search;
• May 2020: Google announces new and updated metrics that, together with other user experience factors, will be forever known as the page experience update.
• May 2020: The launch of Core Web Vitals—the first set of standardized performance metrics that let site owners measure how users experience their websites.

Four years later, it is no longer enough to keep visitors waiting as little as possible; businesses today must pay special attention to real-user experiences on every web page.
 

How does page experience help your businesses?

Optimizing for a seamless page experience is essential for better SEO and business results. Numerous case studies and reports prove that fast, stable, responsive websites boast better user engagement and conversion rates.

Even a 0.1-second faster page load time will lead to:

• 8.6% more pages viewed in a session
• 5.2% increase in customer engagement
• 8.4% more conversions
• 9.2% boost in average order value (AOV)

According to Google’s search advocate, John Mueller:

 

 

What are the Google page experience signals?

To get a high page experience score, site owners must optimize their pages for four page experience signals:

• Core Web Vitals: A subset of metrics that measure the loading performance of a web page for users, including speed, responsiveness, and visual stability.
• Mobile usability: The convenience of accessing and using a web page on a mobile device.
• HTTPS security: The number of indexed HTTPS vs HTTP URLs.
• Intrusive interstitials: The presence of any pop-ups or ads that interrupt the user experience and block content from view.

 

According to Google, site owners should ask themselves some essential questions when attempting to self-evaluate page experience:

1. Do your pages have good Core Web Vitals?
2. Are your pages served in a secure fashion?
3. Does your content display well on mobile devices?
4. Does your content avoid using excessive ads that distract from or interfere with the main content?
5. Do your pages avoid using intrusive interstitials?
6. Is your page designed so visitors can easily distinguish the main content from other content on your page?

Let’s explore each page experience signal in-depth.
 

Core Web Vitals

Core Web Vitals is a set of performance metrics designed to assess real-world user experience. Introduced by Google back in 2021, CWVs allow site owners to see exactly how users experience their websites in terms of page loading speed, responsiveness, and visual stability.

The most important Core Web Vitals metrics currently are:

• Largest Contentful Paint (LCP) measures the time it takes for the main content of a page to load. To ensure a positive user experience, aim for LCP to occur within 2.5 seconds of the page load start.
   
• Interaction to Next Paint (INP) evaluates a page's responsiveness. Aiming for an INP of less than 200 milliseconds will help maintain a good user experience.
   
• Cumulative Layout Shift (CLS) assesses a page's visual stability. For a seamless user experience, aim to keep your CLS score under 0.1.

Site owners who optimize for Core Web Vitals are rewarded way beyond improved search results. Once they’ve captured new visitors, they can better engage them with a seamless user experience and not lose them to competitors.

Optimize your Core Web Vitals with 60+ advanced features by NitroPack →

Mobile-friendliness

Mobile-friendliness refers to how well a website is optimized for mobile devices in terms of usability and accessibility. As part of the Page Experience signals, it plays a crucial role in determining how a page is ranked in mobile search results.

Specifically, mobile friendliness includes aspects like:

• Responsive layout design: The page adjusts smoothly to different screen sizes and orientations, providing a consistent user experience across devices.
• Text readability: Fonts and text sizes are appropriately scaled so that users can read content without zooming in.
• Touch elements: Buttons, links, and other interactive elements are sized and spaced appropriately to be easily tappable without accidental clicks.
• Loading Speed: Pages load quickly on mobile devices, considering the varying network conditions and processing power of mobile hardware.
• Avoidance of intrusive elements: The page doesn’t use pop-ups or other intrusive elements that hinder users' ability to interact with the content.

With more than 45% of global shoppers using their phones to make a purchase at least once a day, a positive mobile experience is crucial for maintaining good rankings in Google’s mobile-first index. Moreover, it’s a conversion-boosting strategy with a high success rate.
 

HTTPS

HTTPS refers to the use of Hypertext Transfer Protocol Secure. This ensures that a website’s connection is encrypted and secure. As part of the Page Experience signals, HTTPS plays a critical role in determining the trustworthiness and security of a webpage.

Here's how HTTPS helps you improve your site’s user experience:

• Secure data transmission: HTTPS encrypts the data exchanged between the user's browser and the website, protecting sensitive information from malicious actors.
• Enhanced user trust: Pages served over HTTPS display a padlock icon in the browser's address bar, signaling to users that the site is secure.
• Required for "Good" page experience status: A page must be served over HTTPS to achieve a "Good" status in the Page Experience report. Pages served over HTTP are categorized as "Failing" and are not eligible for this status.

Page experience status in Google Search Console
 

Intrusive interstitials

Intrusive interstitials are pop-ups or overlays that block access to primary content until the user interacts with them, such as dismissing an ad. While they might serve a purpose, like capturing leads or displaying important notices, they can frustrate visitors and disrupt their ability to engage with the page.

When used excessively or at the wrong time, intrusive interstitials contribute to a bad user experience, especially on mobile devices where layouts take up less real estate. As part of the page experience signals, it is recommended that intrusive interstitials be avoided or used in ways that don’t block the main content.

Did you know?

Intrusive interstitials include:

• Pop-ups that cover the main content immediately after a user lands on a page or while they are browsing.
• Standalone interstitials that the user must dismiss before accessing the main content.
• Layouts where the above-the-fold portion of the page appears similar to an interstitial, but the original content has been inlined underneath the fold.
   

How does Page Experience work?

The Page Experience assessment is performed on a per-URL basis and is reported in Google Search Console using specific criteria, such as:

• Are your web pages passing Core Web Vitals?
• Does your website offer a mobile-friendly user experience?
• Is your website served securely?
• Are you using pop-ups and overlays in a user-friendly way?

In Google Search Console, your page experience report is generated automatically based on the property and domains added to the account. However, there are several notes:

1. URLs without Core Web Vitals data will not appear in the Page Experience report. It's important to understand that the Core Web Vitals report focuses on actual URLs rather than canonical URLs to reflect real user experiences on specific pages.

In some cases, if the URL group (a set of similar URLs) appears in the Core Web Vitals, an individual URL without specific data might still be included.

 

2. If your site uses an HTTP URL-prefix, consider checking the Page Experience report under the corresponding Domain property or HTTPS URL-prefix property. Pages with HTTP URL-prefix will be flagged as “Failing” automatically.

For example, instead of using http://example.com, use https://example.com or simply example.com to access the appropriate reports. You can review your site's HTTPS status using the HTTPS report.

3. URLs must be properly indexed by Google and have appeared in Google Search results for them to show in your page experience report

Optimization Strategies for “Good” Page Experience

To achieve a “Good” status in your page experience report, you must identify areas for improvement and optimize using effective techniques. Focusing on the four main signals, you can leverage a combination of the tips below for your case.
 

Improve Core Web Vitals 

You can find specific instructions and examples in our guide on new optimization techniques for your Core Web Vitals strategy. Below, we flip through them briefly to give you ideas on where to start.

1. Optimize page load time (LCP)

• Use fetchpriority: Assign the fetchpriority attribute to key resources like images or fonts to prioritize their loading and improve the Largest Contentful Paint (LCP) score.
• Shorten request chains: To speed up loading, minimize the number of dependencies in resource requests, such as reducing redirects and avoiding unnecessary intermediate files.
• Avoid redundant server connections: Limit the number of connections to the same server using techniques like HTTP/2 or consolidating files, reducing latency.
• Don’t lazy load LCP elements: Ensure that critical elements, like hero images, load immediately rather than being delayed by lazy loading, which can negatively affect LCP.
• Beware progressive JPEGs: While progressive JPEGs show a low-resolution image first, they can delay LCP as the final quality loads later. Consider standard JPEGs if they impact performance.
• Use 103 Early Hints: This HTTP status code can hint the browser to start fetching critical resources early, even before the server fully processes the request, improving load times.
• Consider URL parameters: Be mindful of using URL parameters that can cause cache misses and lead to longer load times, impacting LCP.
• Leverage the Speculative loading plugin in WordPress: This plugin pretenders pages and resources in the background based on user behavior, improving load times by anticipating and fetching assets early.

Ignore UTM parameters automatically with NitroPack. Get started today →

2. Improve page responsiveness (INP)

• Reduce DOM Size: Simplify your HTML structure by removing unnecessary elements and nesting to decrease the overall size of the DOM.
• Remove unused plugins: Deactivate and delete unnecessary plugins to reduce the number of scripts and styles loaded on the page.
• Consider the number of ads: Limit the number of ads on your pages to minimize the impact of external scripts and improve loading performance.

3. Stabilize your page (CLS)

• Take care of the fallback font: Use font face descriptors to make the fallback font better match the web font.
• Don’t lazy load above-the-fold CSS: Ensure that critical CSS for above-the-fold content is loaded immediately to avoid delays in rendering important visual elements.
• Reserve space for lazy-loaded images: Predefine dimensions for images that will be lazy-loaded to prevent layout shifts when the images load.

Optimize font delivery for faster load times with NitroPack →

Design responsive mobile pages (8 tips)

1. Use a responsive framework

• Choose a responsive CSS framework like Bootstrap, Foundation, or Bulma. These frameworks provide pre-built responsive grids and components.
• Ensure your website's layout adjusts smoothly across different screen sizes (desktops, tablets, smartphones) without losing functionality or readability with a Viewport Meta Tag in your HTML head to control the layout on mobile browsers:

2. Ensure adequate spacing for touch targets

• Buttons, links, and other interactive elements should be large enough to be tapped easily without zooming in. Aim for a minimum touch target size of 48x48 pixels.
• Maintain enough space (at least 8-10 pixels) between touch targets to prevent accidental clicks.

3. Use responsive images

• Implement the image element or the srcset attribute to serve appropriately sized images based on the user's device.

4. Use a mobile-friendly navigation menu

• Implement a responsive, collapsible navigation menu (often called a "hamburger menu") that adapts to smaller screens.

5. Implement sticky navigation

• Keep important navigation elements visible as users scroll using CSS

6. Use readable font sizes

• Ensure font sizes are at least 16px for body text to avoid users needing to zoom in.

7. Set appropriate line heights

• Set a comfortable line height (usually 1.5 to 1.75) to improve readability on small screens

8. Use mobile-optimized input fields

• For forms, use appropriate input types (e.g., type="email", type="tel") to trigger the correct keyboard on mobile devices.
   

Implement an SSL certificate

The good news is that all reputable hosting providers offer SSL certificates as part of their services or in partnership with Certificate Authorities.

Three popular types of SSL services come with your hosting:

• Free SSL certificates are usually domain-validated (DV) and provide basic encryption for your website.
• Paid SSL certificates come with additional features, such as Wildcard SSLs, Multi-Domain SSLs, or higher validation levels like Organization Validation (OV) or Extended Validation (EV).
• Managed SSL services where installation, renewal, and management of SSL certificates are handled for you. This is especially convenient for non-technical users.

For most hosting providers, once you select and purchase the SSL certificate, the installation is automatic. The hosting provider will handle the CSR generation, domain validation, and installation process.

Important: 

After the SSL certificate is installed, ensure your site is configured to use HTTPS by default. This often involves:

• Updating any hardcoded URLs from http:// to https://.
• Setting up 301 redirects from HTTP to HTTPS.
• Updating your website’s CMS (like WordPress) settings to use HTTPS.

Run a quick Google Search Console HTTPS report to confirm everything is set properly.
 

Implement interstitials in a non-intrusive manner (9 tips)

Adopting a content-first approach (especially on mobile) is the fastest way to a happy site visitor. Let’s dive right in!

1. Use top or bottom banner ads

Use less intrusive banner ads that don’t block the main content. Place them at the top or bottom of the screen, keeping them small and easily dismissible.

2. Try inline banners

Use inline banners that are part of the content flow rather than overlays that obstruct content. Ensure they are easily scrollable and do not cover the main content.

3. Leverage browser permission-based notifications

Use browser-based notifications that users opt-in to receive rather than using pop-ups. These are triggered by user interaction rather than automatically.

4. Consider timed interstitials

If you must use interstitials (e.g., for age verification or legal requirements), ensure they appear after a reasonable delay (like 10 seconds), allowing users to interact with the page first.

5. Use exit intent pop-ups

Use exit intent technology that triggers a pop-up when the user is about to leave the site rather than upon entering. This is less disruptive since it doesn't interfere with their access to content.

6. Redesign your cookie consent

If you need to implement a cookie consent pop-up due to GDPR or other regulations, make it a small banner at the bottom of the screen that does not cover the content. Ensure it’s easily dismissible.

7. Opt in for simple age verification

If required, use a simple, full-screen overlay with a straightforward "Yes/No" question, ensuring it’s dismissible after a single interaction.

8. Design clear close buttons

Ensure all interstitials have a clear and easily accessible close button. Avoid hiding the button or making it difficult to click, particularly on mobile devices.

9. Don’t use delayed dismiss

Avoid using timers or delays before the user can dismiss the interstitial. Users should have immediate control over closing the interstitial.
 

Measuring page experience

To effectively measure page experience, you need to monitor several key performance indicators (KPIs) that reflect how users interact with your website.

Start by focusing on Core Web Vitals, which include Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS). These metrics are crucial for assessing loading performance, interactivity, and visual stability.

Additionally, user-centric metrics such as mobile-friendliness, HTTPS security, and the absence of intrusive interstitials should be considered for maximum SEO gains.

You can use several tools to assess and offer a high-quality user experience.
 

Google Search Console

To get started, log into Google Search Console and navigate to the "Experience" section in the left-hand menu. There, you can switch between three helpful instances for measuring user experience and page quality:

• Page experience report
• Core Web Vitals report
• And HTTPS report

The reports are designed to provide an overview and recommendations for improvement so that you can offer the best possible user experience.
 

Google PageSpeed Insights

Google PageSpeed Insights is a powerful tool for analyzing and optimizing your website’s performance. It’s completely free to use; simply enter your site’s URL into the tool, and it will generate a comprehensive report on both desktop and mobile performance.

The report includes scores for the Core Web Vitals, along with specific suggestions for improving your page load times, such as optimizing images, minifying CSS and JavaScript, and leveraging browser caching.

For a comprehensive breakdown of how to read your Google PSI reports, head to our Google PageSpeed Insights guide.

Fix all Google PSI warnings with a single tool. Get started with NitroPack today →

Custom web performance budget

A web performance budget sets thresholds for various performance metrics, such as page load time, total page weight, and resource sizes (e.g., images, scripts, fonts).

This approach helps maintain a consistent and optimal user experience as your site grows. The best part is that you have full control over potential performance regressions.

To develop a custom performance budget, analyze your current site performance using tools like Google PageSpeed Insights and Lighthouse. Based on these insights, define specific, measurable targets for each key metric.

For example, you might set a maximum page load time of 2 seconds or a total page weight limit of 1 MB.

Once established, continuously monitor your site against these targets and ensure new content or features do not exceed the set thresholds.
 

FAQ

My website doesn’t show Core Web Vitals data. What should I do?

If your website doesn’t show Core Web Vitals data, it’s likely because there isn’t enough traffic to generate it. Core Web Vitals metrics are based on real user data, known as field data, collected through the Chrome User Experience Report (CrUX). To start seeing this data, you’ll need to increase your site’s traffic, particularly from users on Chrome browsers. In the meantime, you can use lab data from tools like Lighthouse or PageSpeed Insights to simulate and analyze your site’s performance.
 

Why am I getting a “failed Core Web Vitals” assessment?

A “failed Core Web Vitals” assessment indicates that one or more of your pages are not meeting the recommended thresholds for key performance metrics: LCP, INP, and CLS. This failure could be due to slow server response times, unoptimized images, render-blocking resources, excessive JavaScript execution, or unstable layout shifts during page load. Check your reports to identify areas for improvement.
 

How do I optimize ads on my website for a good page experience?

To optimize ads on your website for a good page experience, focus on minimizing their impact on loading performance and layout stability. Ads should be properly sized with defined width and height attributes. Use asynchronous loading for ads to prevent them from blocking other critical resources during the page load. Limit the number of ads per page and prioritize lightweight ad formats. Avoid using intrusive interstitial ads that block content, especially on mobile devices, as these can significantly harm the user experience.