Since Google announced that pagespeed is a minor ranking factor, webmasters have been striving to make their pages faster and faster in a bid to serve users as quickly as possible. In addition to this, the recent rollout of Google’s Mobile First Index also places a focus on the experience of browsing websites on mobile devices, with speed and load times coming into play as a ranking factor more than ever.
With this focus on speed, Google have recently made some further updates to their Pagespeed Insights tool. In this post I take a dive into the tool, reviewing the main features, and discuss whether the changes are an improvement on the previous version.
At first glance, the interface of the tool appears to be pretty much the same as before, albeit with a ‘friendlier’ look.
Type in the URL you want to test and hit the ‘Analyze’ button; this is where the similarities end:
We can see that we have a colour coded score out of 100, with this traffic light score being ‘based on the lab data analyzed by Lighthouse’.
What is Google Lighthouse?
Google Lighthouse is a speed testing tool, that can be accessed through the Chrome Web Browser Developer Console. You can also run Lighthouse through Command Line, or through a Node module (but just a warning – this is usually reserved for the more confident developers & technical SEOs!)
Lighthouse runs a series of tests against the webpage, creating a number of in-depth reports on the page’s performance, before providing detailed recommendations on how to improve the performance.
However, using Lighthouse was always a little bit more complicated than putting a URL into a tool and hitting enter. There are numerous options to select, and as previously mentioned, required using Chrome Developer Tools, which isn’t particularly user friendly. On the positive side, the insights that Lighthouse provided were more in depth than PSI, and arguably more useful.
With the latest update to Pagespeed Insights, Google have integrated Lighthouse into it, giving users a more in depth page speed report, with more ‘real world’ insights and recommendations.
The Main Features
When first looking at the ‘Mobile’ tab we are presented with the following view:
There is a ‘colour coded’ score out of 100 at the top, with a number of fields below.
We can see the Field Data tab has data from the last 30 days, pulled directly from the Chrome User Experience Report. By conducting some “Googling”, we can see that “The report is a public dataset of key user experience metrics for top origins on the web”. So Google are presenting us with real user data for pages, which is pretty cool!
We can see that this page is presented as ‘Slow’ when compared to other pages in the Chrome User Experience Report. We can see First Contentful Paint (FCP) and First Input Delay (FID) data, that again is traffic light colour coded
Previously within Google PSI, we had First Contentful Paint and Dom Content Loaded data.
What is FCP & FID?
FCP – stands for First Contentful Paint, which measures the time it takes for a user to see a visual response from the page. Understandably, “Faster times are more likely to keep users engaged”. This is especially true, as I prefer to see a website ‘do something’ rather than me just stare at a blank page that is supposedly “loading” for a few seconds. Seeing the browser start to ‘do stuff’ is generally more reassuring for users than seeing no activity at all.
For both of these metrics, the faster the better. Unfortunately though, Google do not immediately display recommendations for speeding each of these numbers up.
Below these two metrics, we can see a tab for an Origin Summary:
Expanding this tab we can see the same metrics being used, but directly relational to all pages that are served from the same domain, so in this case from https://webmasters.googleblog.com. Interestingly, even one of Google’s own websites looks to be in need of some improvement!
We then can see the more important stuff – what that page looks like right now, with real ‘lab data’:
We get a number of deeply technical sounding terms & metrics presented, all appearing as red ‘warning’ signs, or orange ‘information’ signs.
Hovering over each of these areas provides you with a quick explanation of each term, which really helps in understanding the data:
Below the lab data, we can see a timeline of the page loading:
If you were to load the page on a mobile device, this would be very similar to how the page loads for you. The process would essentially follow:
- Inputting the URL, hitting ‘Go’
- Wait a couple of seconds before content displays
- Wait a couple more seconds before you can actually use the page properly
As with older versions of Pagespeed Insights, we then get a list of issues or ‘Opportunities’ that are flagged as needing attention, as well as recommendations as to how we can fix these items.
Each of these opportunity areas can expand to display a list of affected resources, as well as links to more detailed information. Recommendations are also highlighted; in the case of Deferring Offscreen Images, PSI recommends implementing lazy loading (which means loading the images as and when they are needed/scrolled to, as opposed to loading everything all at once.)
We can then see more in depth diagnostics about the webpage. These are more in depth recommendations, and take a bit of extended reading and dedicated research to fully understand. These are probably areas that you can be forwarded on to your developers and they can get cracking straight away.
Again, each of these areas drops down to present you with further information, linking to official Google resources.
As with previous versions of PSI, we can also see ‘passed’ audits, which shows that although there are a lot of issues flagged, it is not all bad. If you want to read up on each of these areas, each line expands into a drop down menu, linking to more official Google documentation.
With this update, Google are providing users of Pagespeed Insights with more in depth data, particularly with real world performance of tested web pages. This makes a lot of sense; webmasters are now able to see how real users see their sites, providing more concrete evidence into why and how they should apply changes to speed up their sites.
With page speed affecting ranking on mobile devices (arguably more important than on desktop devices, where users tend have more patience), webmasters have more data to improve mobile performance.
However, there are now only very minor differences between Google Lighthouse and Google’s Pagespeed Insights, save for a pretty interface. Google have deprecated the old Pagespeed Insights Tool, with one less feature available to use to test page speed. True, the recommendations that Lighthouse provides are arguably more ‘real world- focused’, but a lot of people preferred the simpler interface and recommendations that traditional Pagespeed Insights offered.
Ultimately though, these changes demonstrate that Google seem to be pushing more and more for SEO’s to understand the deeper technical explanations of issues, meaning that we need to take more time to dive deeper into these areas to gain a better understanding of the technical side of the web.