A Comprehensive Guide to Google Page Speed Insights (Nov, 2021)

Search engines and users alike do not like a slow website. If a web page takes too long to load, it is noticed by Google along with the users who shift to another website that will answer their queries faster. Slow page speed prevents users from staying on your website irrespective of how they came there in the first place. It could be through organic search,?paid ads using Google Ads Editor, or a link building activity. If you are looking to enhance your page speed for the users and your search engine, Google PageSpeed Insights can assist you.?

We have compiled a comprehensive guide on how Google PSI works, how to study the reports, and ways to enhance page load times across your web pages.

What is Page Speed?

Google identifies page speed in two ways:

• The time it takes to show content above the fold.
• The time it takes a browser to completely render the page.

A lot of factors may affect the speed of your web pages. The user’s internet speed, a domain’s web hosting facility, and cache clearance can affect the webpage speed. Hence, when there is a discussion regarding page speed, some factors are definitely out of the site owner’s hold. However, there are a lot of things that the website owner can optimize like images, videos, JavaScript etc.?

As page speed is so important to the user experience, Google thinks about the overall performance of a page when identifying whether to promote it in the SERPs. Investing enough time to optimize the content for speed proves to Google that you are looking to build a better experience for your website visitors.

What is Google PageSpeed Insights (PSI)?

PageSpeed Insights is a free tool that examines the content of a particular page and offers page speed scores for both the mobile and desktop variants of the page.

Source

It also determines the opportunities for optimization and makes particular recommendations for improvements. PageSpeed Insights is one of the page speed audit tools for site owners, but it is great for people interested in improving speed for SEO. Website owners can see a detailed view of how Google understands their website using the Google PageSpeed Insights tool.?

How to use the Google PageSpeed Insights tool?

In order to use the Google PSI tool, enter any URL in the toolbar, click analyze, and the tool will weave its magic.

Source

While you wait for your report, the Google PSI tool will do the following. First, it collects the page’s “Filed Data”, or the performance data in the Chrome User Experience report (CrUX). Next, it measures the page performance using the Lighthouse API. This is known as “Lab Data”, as it measures the webpage’s speed in a controlled manner using mobile networks and a mid-tier device. This removes some of the variables that can affect the webpage speed and performance.

1. Google PageSpeed Insights Reports Explained –?

The Google PSI tool will create a comprehensive report including the field data, lab data, opportunities, diagnostics, and audits. It will look something like the below image.

Source

In the Google PSI report, color coding makes it convenient to understand the areas where the page is doing well, still needs enhancements, or is not upto the mark. The color coding in the report means:

• Green – Good
• Red – Poor
• Yellow – Needs improvement

Now, let us understand the information relayed in the report.

2. Field Data –

Google PSI’s Field Data is divided into four main metrics. Each metric identifies a different aspect of speed and page load time. Google PageSpeed Insights Field Data is made up of the following metrics:

Source

• First Contentful Paint (FCP):?The total time taken for the first text or image to load.
• Largest Contentful Paint (LCP): The total time taken for the largest text or image asset to load.
• First Input Delay (FID): The time taken for the browser to respond to the user’s first interaction.
• Cumulative Layout Shift (CLS): It is used to measure the movement of the page in the viewport.

Each of these metrics is measured in seconds or milliseconds, apart from the Cumulative Layout Shift (CLS). The field data shown in the report is displayed from the previous 28 days and will always be presented with distribution bars. It is because Field Data is made up of aggregated data from the CrUX report, and the same webpage doesn’t perform in the same way for everyone.

3. Lab Data –?

Google PageSpeed Insights Lab Data comprises synthetic data from the Lighthouse API. Lighthouse measures FCP, LCP, CLS and other metrics.

Source

• Speed Index – The time is taken for the content to appear during page load.
• Time to Interactive – The time taken for the web page to be fully interactive.
• Total Blocking Time – The time between FCP and full interactivity.

Unlike Field Data, the metrics shown in Lab Data will not include a progress bar, but display the timestamps or results from the lab test.?

4. Passed Audits –?

Source

This part of the report simply allows site owners to know the current status of the webpage. A detailed list of passed audits is a positive sign and simply means that the page is following page speed best practices.?

5. Opportunities and Diagnostics –?

The Opportunities and Diagnostics sections offer particular recommendations to enhance page speed.

Source

The report also shows the approximate time that could be saved after following the recommendations. The Google PSI tool will offer detailed action items along with instructions to the content management system.?

In the same manner, the Diagnostics part of the report includes best practices that the page does not follow depending on the page analysis.

The number of opportunities and diagnostics that can be displayed in this part of the report is long and will vary on the particular issues that the Google PageSpeed Insights tool finds on the page.

Tips to Improve PageSpeed Insights:

For users not acquainted with SEO, the Google PSI report can be extremely overwhelming. However, Google is always concerned about the users and does a fantastic job of offering detailed action items in the Opportunities section of the report. Based on the Opportunities listed by the Google PageSpeed Insights tool, the further steps will differ for every site owner.

Though, there are some common things that affect page speed that webmasters always make. It is best to take care of some simple optimizations that can improve speed and load times for a lot of webpages.

1. Image Optimization –?

Apart from the content asset, images and videos are more important to create issues linked to a slow page speed. Proper image optimization can be beneficial for decreasing FCP and LCP times and avoiding CLS issues. Some of the best practices are:

• Resize and compress images.
• Select a particular height and width for all images.
• Make use of a content delivery network (CDN) to deliver the images.

2. Embedded Videos –?

If you have videos on your website of your products/services, try not to upload them on the website. They take a lot of space and can negatively affect your web server if there is heavy traffic at a given time. Instead, it is better to store videos somewhere else (for instance YouTube), and embed video content on your website to drastically enhance load times.

3. Eliminate Excessive Redirects –?

Redirects can significantly increase Time-to-first-byte (TTFB), or the time between the request to the server and when the first data is sent back to the requester. By eliminating redirect chains can assist you to enhance page speed and is a good option for your SEO too.

4. Select a Faster Website Theme –?

Some website themes are optimized for speed and can definitely enhance your page load times. There are some lightweight themes, which offer GZIP compression or have a responsive design. So, it is best to research some fast loading WordPress themes and update them to enhance your PSI scores and SEO.

5. Asynchronous Loading for JavaScript –

For ease of understanding, asynchronous loading enables the web browser to be a better multi-tasker. In this type of loading, the web browser stops all the other activities while the JavaScript file loads. Asynchronous loading allows the browser to fulfil other tasks, like painting a table or loading a CSS Stylesheet and downloading the JavaScript. The optimization needs more backend expertise, so please collaborate with a web developer to implement this strategy.

6. Browser Caching –

It is a simple optimization trick that allows your website to load faster for returning users. With the help of browser caching, images and videos will be stored on the user’s device and loaded from there for their next visit. To enable browser caching, you will need to edit a .htaccess file. If you are not sure, it is recommended that you take the help of an experienced?web developer.

Conclusion:

It is fair to say that improving the page speed has tons of benefits to your SEO performance and the digital experience of your website visitors. To do so, it is best to get used to Google PageSpeed Insights even if you are from a non-technical background. If you follow the recommendations in the report, you will definitely see the reward from Google in terms of higher SERP rankings and keyword ranking. Do you struggle with your website page speed or SEO? Contact Nimblechapps today for assistance and get a free quote.