What is PageSpeed Insights?

PageSpeed Insights, or PSI, is a tool by Google that helps determine whether a page is “fast” or not. What Google determines to be fast can vary greatly and is dependent on factors such as load time, image types, content delivery, and device.

In November 2018, Google took a much more “mobile first” approach, releasing version five of PSI, which defaults all settings to mobile. When this release happened, several sites saw dips in the PSI score (sometimes down to single digits) as Google began evaluating websites primarily on mobile performance.

This can damage a site’s SEO ranking as Google ranks sites based more on mobile speed and usability.

Common Problems and How to Fix Them

Some of the most common PSI related problems come from a site’s assets, such as image size, and JavaScripts and how they’re being loaded or used. Certain problems such as “Serve images in next-gen formats” and “Properly size images” are easy to fix.

For example, converting a regular JPG image to a JPG 2000 image usually decreases load times because the image is smaller. Properly sized images will decrease load times further, since unneeded sections of the image are removed.

One of the more difficult issues to fix is the infamous “Eliminate render-blocking resources” problem. This happens when a web browser needs to load either a CSS file or JavaScript file during the loading of the page. To load the files, the browser must stop rendering the page to get the files; then it may continue rendering. Sites can typically get away with 1-5 small rendering blocking items, but items greater than 10KB will typically add longer load times and lower PSI.

To fix the “Eliminate render-blocking resources” problem, load CSS in with HTML rather than the more typical “” tag. This forces the website’s server (which is typically faster) to load the resources instead of the user. To do this, we recommend Hummingbird Page Speed Optimization for WordPress and JCH Optimize for Joomla!. Both tools will load all registered CSS files and place them in the HTML of the site automatically.

After adding the plugin, the site will need to be checked for styling errors, as optimization plugins sometimes cause styles to conflict (both plugins allow for disabling of certain CSS files).

Fixing JavaScript files is normally easier. Adding an “async” attribute to any “<script>" tag will cause the browser to load that script while it is loading the rest of the page. For some scripts, like the jQuery library, this can sometimes cause issues, requiring the site to load those scripts without “async”. 

One of the broadest changes that can be made is increasing the amount of server resources. This will normally increase a site’s performance across the board because the site will load faster and each CSS file, JavaScript file, and each image will also load faster. 

PageSpeed Insights in Review

PageSpeed Insights can be a time-consuming tool used to measure a website’s speed. Large portions of time can be devoted to improving a PSI score, only for Google to change its rules and cause PSI scores to fall again. However, it is important to stay up to date on your site’s PSI score to ensure Google is fairly and accurately ranking your website.

Need help with your website’s page speed? WebArt’s team can help improve your site’s page speed, keyword rankings, and other aspects to improve SEO. Contact us today to see how we can help.

 

Written by
Published in SEO
Zak Payne

As a full stack developer, Zak focuses on enhancing the functionality of a website’s software. Even the smallest changes can make a big difference and Zak loves uncovering these improvements for clients.

Leave a comment

Make sure you enter all the required information, indicated by an asterisk (*). HTML code is not allowed.