Chapter 3 - Building a first rate User Experience and Page Experience

Ask yourself this question – is my site painful for its users?

Google wants to deliver the best experience for its users and that means serving them the most relevant, authoritative answers from trusted sources to the questions they need answering.

But what happens when it’s difficult to make a case for Page A or Page B to rank highest for a particular term?

As experienced SEOs, we’ve all seen rankings jump around from time to time outside of a widespread algorithm update and we know for sure that Google runs experiments and analyses vast amounts of anonymised user data to help it make the best decisions. These experiments or click-thru rates in either position might sway the top ranking in favour of Page A over Page B or vice-versa.

But when all other things are equal then the User Experience and Page Experience offered by Page A over Page B could prove to be telling.

Google has given us fair warning that this is important – announcing that page speed was a ranking factor back in Spring 2010. It went on to announce that it was introducing mobile first indexing back in March 2018 and recently announced that all sites were moving to mobile first indexing in September 2020.

Measuring your User Experience on Mobile

So we know Google uses the mobile version of a site’s content for indexing and ranking and places tremendous importance on ensuring users get a good experience.

For SEOs this means you have to test your mobile site’s usability and fix any issues that might impact mobile users enjoyment of your content. Typical problems include; huge image file sizes, content too wide for the screen, clickable elements too close together so buttons are hard to click, and text so small it’s illegible.

You can see some of these errors reported in Google Search Console. Fix them!

But don’t wait for Google to report these issues – especially as validating you’ve fixed some of these issues can take as long as 28 days. Use the following tools to help:

Google’s free mobile friendly test – https://search.google.com/test/mobile-friendly

Smart Bear – Cross platform browser testing – https://smartbear.com/ – to make sure your site loads nicely in all modern browsers.

And do your own usability testing to discover other issues that may not necessarily be reported on today, but are likely to turn real-users away (and one day search engines when they build a test for this too) such as sub-menus not being clickable, no search functionality, no contact details and so on.

Watch our Tea Time SEO session here:

Table of Contents

Can we help?

If you are looking for an easy way to automate much of the advice given in this guide, then please book a call with one of our platform experts to explore whether we have what you need.

Measuring your Page Experience on Mobile (and Desktop)

The other related aspect that impacts the overall user experience is Page Experience. e.g. How long does it take for your page to load and become interactive.

We refer to this as Page Experience, because it’s not just a single measure about how fast the page actually loads, it is this and more, as it includes a series of inter-related measures that attempt to measure how quickly a page is perceived to load.

What are Core Web Vitals? What is the Google Page Experience update and when is it coming?

In May 2020, Google announced that it will be rolling out the Google Page Experience update in 2021 and Core Web Vitals will be ranking factors next year.

Core Web Vitals is the new way to see (in real time) and measure the performance of a website. Some of you may already be familiar with the three elements you have seen in Google Search Console:

Largest Contentful Paint (LCP)
First Input Delay (FID)
Cumulative Layout Shift (CLS)

Core Web Vitals, also called Web Vitals are the performance metrics that affect User Experience including how fast the page loads, the visual stability (if the page jumps) and the interactivity. Google has introduced this as many sites are still loading incredibly slowly. The speed of a site affects bounce rates, time on site and conversions. So no more slow sites! If your site is still performing poorly by then, it will be harder for it to appear higher in the SERPs.

Making your pages load faster for users - Improving your Core Web Vitals

Take a few examples of some of the key pages on your site and check their performance using Lighthouse, GT Metrix or Google Page Speed Insights.

Tip 1 – Test your key Page Templates

Ideally you should select a number of page templates that cover a large proportion of your overall site pages. This way by fixing the obvious issues with a few templates you can have a positive impact on many pages. This is important as Google will use average Web Vitals data for your site if it doesn’t have data from enough real users for a specific page.

Tip 2 – Don’t focus on the overall headline score for mobile and desktop! It fluctuates!

Google recommends taking a couple of readings every time you make a change to get a more consistent view of progress. Honestly, if you focus on the overall score it will drive you mad, as you will make a change that you think improves the overall score and it will go backwards – or it will improve the Desktop score and make the Mobile score worse.

Instead focus on the key metrics for the Core Web Vitals:

  1. First Contentful Paint (FCP) is an important, user-centric metric for measuring perceived load speed because it marks the first point in the page load timeline where the user can see anything on the screen—a fast FCP helps reassure the user that something is happening
  2. Speed Index measures how quickly content is visually displayed during page load.
  3. Largest Contentful Paint (LCP) is a Core Web Vitals metric and measures when the largest content element in the viewport becomes visible. It can be used to determine when the main content of the page has finished rendering on the screen. The most common causes of a poor LCP are: Slow server response times
  4. Time to Interactive measures how long it takes a page to become fully interactive. A page is considered fully interactive when:
    1. The page displays useful content, which is measured by the First Contentful Paint,
    2. Event handlers are registered for most visible page elements, and
    3. The page responds to user interactions within 50 milliseconds.
  5. Total Blocking Time (TBT) metric measures the total amount of time between First Contentful Paint (FCP) and Time to Interactive (TTI) where the main thread was blocked for long enough to prevent input responsiveness.
  6. Cumulative Layout Shift (CLS) measures the instability of content by summing shift scores across layout shifts that don’t occur within 500ms of user input. It looks at how much visible content shifted in the viewport as well as the distance the elements impacted were shifted.

Then focus on solving the issues raised by your page speed reporting tool. I recommend using at least two tools.

Once you have found a friendly web developer and fixed all the obvious issues, then finally, think about what changes you could make that would create a better user experience – and by better, I mean making your page templates load faster and be ready for a user to interact with sooner.

Striving for 100/100 is not completely unrealistic, I have seen a few examples of sites with home pages that score this well, but it may not even be necessary to go to the nth degree.
Eventually the law of diminishing returns applies.

Google itself says that going from a score in the 90s to 100 can take a huge amount of effort and even Google’s own search page does not score top marks!

blank

Tip 3 – Benchmark against your competitors page templates or key landing pages and just focus on ensuring you out score your competitors!

Tip 4 – Use Google’s Lighthouse calculator to see the weighting of each of the Core Web Vitals and to work out how great an improvement you need to make to get everything in the green zone, scoring 90 – 100.

Set yourself a realistic goal of beating your competitors’ pages. Run a report first and then click on the ‘See calculator’ link below the Core Web Vitals in the Lab Section, as then the calculator will show your performance levels and it’s easier to drag and drop the sliders to see what you need to do to reach your goals.

blank

Tip 5 – Implement AMP to accelerate your mobile pages.

Tip 6 – Prepare for your performance to drop in the future!

I’m afraid you cannot just fix and forget this. You will do all this work and then someone will change something on your website and your performance levels and scores will drop again.

After all your website should be regularly updated with fresh content and features; so it’s highly likely someone will inadvertently undo your good work on improving the page experience for your users.

So either set yourself some alerts that automatically check your scores and performance levels against your attained benchmarks and/or use Lighthouse’s CI tool (or some cloud based tools that do the same) to set a Page Experience budget that is integrated as part of the cContinuous Integration and testing framework built into your development process. For larger sites, this should ensure that any future site changes do not cause a regression in your page experience performance levels.

Menu