A graphic showing a desktop computer monitor with a website. Positioned in front is a performance meter, with the needle point towards the right, orange-red section of the meter.

Using PageSpeed to Improve Site Speed and Accessibility

Written by


What is PageSpeed?

Google released PageSpeed Insights in 2010, with major updates and a switch to the Lighthouse engine released in 2018. It analyses the performance of a website on mobile and desktop devices, and provides suggestions on how to improve a site’s speed, accessibility, and SEO, as well as checking common best practices which challenge site security and quality against established web standards.

Why do I need it?

According to a Forbes Advisor survey from 2024, 53% of users won’t wait longer than 3 seconds for a website to load. If your website takes 4 or more seconds to load then you lose 53% of your potential users.

In addition to user satisfaction, a slow website might not attract users in the first place. Google ranks fast websites higher in search results than ones with poor performance, and so a fast website might increase your visibility on search engines.

Analysing your site’s performance with PageSpeed is one of the easiest ways to get your website on the map and looking professional.

How do I use it?

Using PageSpeed is easy and the recommended actions it generates are often straightforward to execute, especially if your website uses a common Content Management System (CMS), such as WordPress.

A Guide to using Google PageSpeed

Getting Started

  1. To start, head to pagespeed.web.dev.
  2. Enter your site’s URL and click “Analyse”. For this example, we’ll use example.com.
  1. After a short while, the tool will present mobile core web vitals first. If your site is relatively new, or has low traffic, the tool may not provide any web vitals information as this relies on data collected from real users.
  2. Switch to the desktop results. I would recommend fixing any desktop issues first as these are often easier to fix and are likely to also positively impact your mobile score. Your mobile score is almost always lower than the desktop score as the tool simulates a slow mobile data connection to mimic a user’s experience while they’re on the go.

Performance

  1. For our desktop performance test, I analysed bbc.co.uk. Enter your own website URL instead.

Here were BBC’s results:

Their accessibility and SEO score were perfect, which is what you would expect for a big corporation like the BBC.

Their performance score is very poor, however, so let’s take a look at what suggestions PageSpeed gave them, and what steps they would have to take to improve this score.

It is important to note that a very-frequently-updated and dynamic news website is likely to have performance issues that, if resolved, would end up worsening the user experience. This is because the more new data a browser has to fetch from a server, the more time it takes for that data to be received by the browser.

  1. Scroll to the suggestions.

Here were BBC’s:

Image Delivery

Once thing that the BBC has done right is that all their images are served in a .webp format. WEBP is an image format that takes a lot of the processing power off the web server, and the client does most of the heavy lifting instead. This means the image can be served to you faster, and often requires less disk space on the server, too.

The main issue here is that the image resolutions are higher than the dimensions they are displayed at. This can cause unnecessary data transfer from the server, thus increasing page load times.

To resolve this issue, the BBC would have to have copies of images at different dimensions and only display the one closes to the actual dimensions that the image is displayed at. Alternatively, they could dynamically resize each image at render-time, but this could have the contradictory effect of increasing processing times.

Cache Lifetimes

Cache lifetimes tell a computer how long it should cache (store a copy of a webpage, and assets on a webpage, on local storage) objects for. A long cache lifetime means a browser will keep a copy of an asset for longer, instead of fetching a new copy of the same assets from the server.

Setting long cache lifetimes for assets that aren’t frequently updated is a great idea, as browsers won’t need to constantly fetch information from the server that doesn’t change. You should always make sure, however, that more dynamic content, or content that updates more frequently, has short cache lifetimes so that users always see the most up-to-date information.

Other Suggestions

The other recommendations listed by PageSpeed can be just as important as image and caching recommendations. Go through each recommendation one-by-one, assess how much of an impact it’s having on load times and performance, and get in touch with us if you have any issues or need help resolving performance problems.

Don’t forget to head to the mobile tab too and fix any mobile-specific issues.

Accessibility and SEO

Similarly to the performance recommendation, go through the suggestions for your website’s accessibility and Search Engine Optimisation (SEO). Many of the suggestions listed under these categories require no more than basic Content Management System (CMS) knowledge to fix, but we’re here if you need help resolving more complex issues.

We’re Here to Help

Going through these issues can be daunting, but that’s what we are here for. Get in touch with us now to get your site running smoothly, and start impressing your users.