Preparing for Google's Page Experience update

What is Google's Page Experience update and why do we care about it? How will it affect your site and what do you need to do now to plan for it.

What is "Page Experience"?

This is how Google themselves describe Page Experience:

The page experience signal measures aspects of how users perceive the experience of interacting with a web page. Optimizing for these factors makes the web more delightful for users across all web browsers and surfaces, and helps sites evolve towards user expectations on mobile. We believe this will contribute to business success on the web as users grow more engaged and can transact with less friction.

What this means, is that Google are looking for a smooth experience.  Slow pages, with barriers or obstacles that block or interfere with the usability are a bad thing and Google wants to help promote sites that offer a better experience.

We all know how frustrating it is when you're trying to interact with a site but the page is jumping around due to ads loading or slow items on the page appearing unexpectedly.

This is all about UX (User Experience) and making sure your site offers the best UX possible.

So what is Google's "Page Experience" update?

When talking about Page Experience, Google cites it's core signals:  Loading, interactivity, page stability.

Two seconds is the threshold for ecommerce website acceptability. At Google, we aim for under a half-second.

In terms of loading, Google recommends a page loading time that is under 2 seconds.  At Google, they actually aim for under half a second!  This is very fast, but it's amazing how fractions of a second really add up.  Modern websites are very complex, there is a long list of different stylesheets, script files and images that add to the total page loading time.

Signals for page experience, include mobile-friendliness, safe-browsing, HTTPS-security, and intrusive interstitial guidelines. Intrusive interstitials, are essentially pop up ads that cover parts of the page and generally lead to a poor experience.

Why is it important?

A poor page experience prevents users finding what they are looking for.  Remember, Google is an answer-finding service.  We, as users, enter a question and Google provides pages of answers, with the best match appearing at number one in the search results. 

Google are constantly striving to provide the best answer in the number one position. So anything that detracts from that goal needs to be downgraded and that includes pages with a poor experience.

When will it happen?

The update will go live in 2021.  That's all we know at the moment.

Content will still be king

Your content will still be king and will be a more important ranking factor than what is introduced in the Page Experience Update.  Google have made it clear that great content will still rank highly, even with a poor page experience.

How are AMP pages affected?

AMP will not automatically reign as master of the Top Stories section of Google, but will have to compete with other pages.  However, AMP is still capable of high-speed, "fantastic" page experience and if AMP pages are still served to users then these are the pages that will be judged by Google when it works out it's rankings.

What can you do to improve your page experience?

To assess your current site you can use Google's Pagespeed Insights tool to measure your current websites performance.  The tool gives you a lot of information, here are some of the key areas for improvement:

Deal with 400 errors

Check Google Search Console for pages that are not found and put in place 301 redirects to send users to the correct page.  You can't expect users to go hunting on your site for the correct page, so it's critical to put the 301 redirect in place to send them there automatically. Also Google will love this, a 301 redirect is how you tell Google that a url has moved from one place to another and everything is ok.

In terms of individual files, 404 errors can absolutely KILL the page speed.  Try adding a few missing images and see the affect.  These are really easy to deal with.  Use your browsers console to find the errors in the Network pane.

Improve server response time

Server response time is the amount of time it takes for the web browser to receive a response.  You need to make sure your server response time is not too slow. 

It doesn't necessarily mean buying more expensive hosting, you can ensure you have up to date code that runs on newer, faster versions of PHP (assuming you are using PHP).  You can also use Opcache and optimise your databases.  Using a CDN like Cloudflare can also help.  We tend to recommend Litespeed web server and Litespeed cache for the ultimate in fast server response. 

Optimise your Javascript

Your first port of call is to try to and minimise javascript files.  For this you can use a compressor like this.

Also run your site through Pagespeed Insights and look for Javascript related results which are more tricky to deal with.  One of these you may see is "Minimise main-thread work".  

There is an interesting thing to notice here.  The main thread is where the browser processes user events and paints the page, so if it is busy it will prevent the user being able to interact with the page.

You may also see "Reduce JavaScript execution time".   This is saying that large scripts take a lot of time to execute which slows the page down.  Because Javascript is executed in the main thread, this also delays the Time To Interactive (TTI) which is a measure of when the web page will respond to user interaction.  It's especially frustrating if a page has appeared and fully rendered yet you still can't click links or scroll down the page because it is not yet interactive.

Minimise http requests

An easy win for page speed and thus making your site load faster is to reduce the http requests.  So imagine you have a lot of scripts, you could roll them into one which will mean the page loads quicker.

Four scripts...

<script type="text/javascript" src="myScript1.js"></script>
<script type="text/javascript" src="myScript2.js"></script>
<script type="text/javascript" src="myScript3.js"></script>
<script type="text/javascript" src="myScript4.js"></script>

...Can be combined into one http request:

<script type="text/javascript" src="all.min.js"></script>

Optimise images

This is normally an easy one, but it can take some time.   First of all configure your CMS to reduce full images if possible to their correct size.  Concrete5 has an option to do this and also addons to optimise images in the future too.

If you need to do this manually you can use a site like TinyPNG to reduce the file sizes for you.

Remove Intrusive Popups

It's no secret that users hate popups.  I never heard anyone say "I love it when what I am reading suddenly becomes completely obscured by a popup containing something I'm not interested in".

Avoid popups!  The Page Experience Update is going to penalise you for having it, but actually do you know if your popups are annoying your users and causing them to leave your site anyway?

If you really need popups then consider making them appear after a long delay or as "exit modals".

Avoid jumping content

There is a local news site I know (I won't name whom it is) who have the worst page experience I know about.  The site is full of ads and things that load after the main content.  Not only is the Time to Interactive poor, but when you do start reading their articles the whole page jumps around so badly you completely lose where you are.

Sometimes this can't be helped and is an entirely unexpected development, especially if your site uses Ajax to asyncronously load content onto you page. If so, check out this article.

Compare your Experience to your competitors

Visit their top pages.  You can use Neil Patel's great free SEO tool called Ubersuggest to do this, simple:

1. Go to Ubersuggest
2. Type the name of your biggest competitor
3. You'll see a report of their pages
4. Check the Top Pages report and go through the first 50

What are they doing that you are not doing?  How can you improve your site to be better than theirs?

Make it secure

If you are not running https you really should be by now.  You'll need an SSL cert and 301 redirects in place to make sure your site is using https and Google knows that's how it now should be.

In certain CMS's it's best to also force SSL, otherwise you could be serving both http and https pages and the http ones could still be getting found by Google or cached leading to more problems.

To force SSL you can use a simple redirect in your .htaccess file like this:

RewriteEngine On 
RewriteCond %{SERVER_PORT} 80 
RewriteRule ^(.*)$ https://www.madesimplemedia.co.uk/$1 [R=301,L]

Check your websites mobile friendlyness

A big part of Page Experience is how friendly the page is for all visitors.  We may spend all day on a PC, so we need to be especially vigilant to make sure we take time to fully check our websites on mobile devices too.

So check to make sure your website is fully mobile responsive and there aren't any issues.  One thing to remember is mobile devices may be running on a slower network, so we need to make sure the page loads quickly enough.  The hardware is also going to be not so powerful, so this can affect page experience because Javascript can use the CPU quite heavily which may mean it is fast to render and become interactive on a desktop computer or laptop, but has issues on a mobile.

Conclusion

This is certainly a good update from Google.  No one likes a bad experience, it's like having our time wasted and it great that quality user experience is being rewarded in the search results.

There's no reason to panic here if your web pages need work, you can consider making improvements and have it ready for next year. 

It's good that this update is coming so we can all think about the UX of our sites, we may even find some big issues to fix that will greatly reduce our bounce rates before Google's update comes along.

Sources

https://searchengineland.com/live-with-search-engine-land-googles-page-experience-update-335684
https://neilpatel.com/blog/google-page-experience/
https://webmasters.googleblog.com/2020/05/evaluating-page-experience.html
https://developers.google.com/search/docs/guides/page-experience 
https://developer.mozilla.org/en-US/docs/Glossary/Main_thread
https://css-tricks.com/content-jumping-avoid/