Google PageSpeed Insights: How to Improve Performance

You just built a new website for your company. You spent days laboring over the design and weeks in production with countless hours of edits. But there’s a problem: You find that your new, beautiful website isn’t as fast as you need it to be.

If your site is slow, you are losing business. It is as simple as that.

In Google’s own words, “speed equals revenue.”

The speed of your website has a direct impact on SEO and conversion rates. Not taking the time to make improvements can be a costly mistake.

Optimizing your website’s performance is crucial. A slow site can drive visitors away – research shows that people are more likely to abandon a page that takes longer than three seconds to load. With Google putting an emphasis on high-quality content for users in the last few years, there’s been a big push to focus strictly on content marketing. Where the first optimizer started off by taking advantage of search engine algorithms through pure coding, nowadays, producing high-quality content has been the primary goal.

Fortunately, you can diagnose your site’s current performance by using Google’s PageSpeed Insights tool, one of the most popular speed-testing services. This tool enables you to improve your site’s performance optimization by identifying common problems and helping you resolve those issues.

In this article, we’ll talk about what PageSpeed Insights does. Then we’ll offer a few tips to help you increase your score and keep your site loading fast. Let’s get going!

1. What is Google PageSpeed Insights?

Google PageSpeed Insights is one of the best tools to help fix your website’s speed. This tool helps you pinpoint exact issues with your site and enables you to make the changes to improve your site.

With PageSpeed Insights, you can test the speed of your pages from the mobile and desktop perspective. Your PageSpeed Insights report will then provide recommendations for improving your Google page speed.

2. How to use Google PageSpeed Insights

When you first enter PageSpeed Insights, you’ll see a bar where you can enter your website URL. You’ll want to type your homepage URL into this bar and click “Analyze.” Google will take a few seconds to scan over your site.

Once the next page loads, you will see the results of your site. You’ll see two tabs on the screen where one is for your mobile site and the other for your desktop site. Within each tab, you will see your score and recommendations.

3. Inside the Google PageSpeed Insights scorecard

When you get to the Google PageSpeed Insights results screen, you will see two ratings. One is your page speed rating and the other is your optimization rating.

Page speed rating

Page speed is indicated as fast, average or slow. Your optimization is calculated as low, medium, or good.

First, look at your page’s speed. As you know, this is a crucial part of your website. If you have a “fast” rating, your site won’t need many changes, if any.

With your page speed, you will see two different numbers:

First Contentful Paint (FCP): FCP measures how long it takes for users to see a visual response from your page. In the example photo used above, users see a content response in one second.

DOM Content Loaded (DCL): DCL measures when your HTML documents are loaded. You want this number to be low (like 1.2 seconds in the example photo) as it leads to a lower bounce rate. As we discussed earlier, a lower bounce rate is a sign of maintaining your leads and will increase your SEO ranking on search engine results pages.

Optimization score

Next, you’ll want to look at your optimization score. This score is rated out of 100.

This score follows how well you implement common practices to improve your site’s performance. We’ll discuss how you can use some of these common practices to improve your site speed in the next section.

Your optimization score mainly focuses on two areas:

1. The time it takes to load content above the fold.

2. The time it takes for the page to load fully.

When you use PageSpeed Insights, you’ll get optimization suggestions. These are things you can do to improve your page to provide a better experience for your audience.

You’ll receive suggestions such as avoiding redirects, leveraging browser caching, and eliminating render-blocking above the fold. You can fix the issue using a separate link that is provided by Google.

4. How to Improve Your PageSpeed Insights Score

Try the recommended actions (or best practices) and starting points below; they are the most commonly seen issues and have the biggest impact upon improvements.

Optimize Images

Image optimization is perhaps one of the most common reasons why a web page has a slow load time and is often the best place to start making improvements, as the increases in both load time and PageSpeed can be significant. Especially when there is a number of people responsible for uploading content or adding products, it is hard to maintain strict standards for images, and problems can quickly mount up.

Images take a lot of resources to download, and they are often not properly optimized. The two main areas where you can make improvements by optimizing images are:

• The disk size of an image.
• Displayed size vs. the actual image size in pixels.
• Deferring offscreen image loading.
• Use a content delivery network (CDN).
• Using next-gen images.

Optimizing Image Size

A 1MB image will take longer to download than a 100KB image. To tackle this, work to compress images without losing quality. You can use tools such as TinyPNG to achieve this, or take a look at Google’s recommendation, ImageMagick.

Size Images at Their Display Size

Another common issue is images are unnecessarily much larger than they need to be. Imagine your page displays an image of 250 by 250 px. If the original image is actually 1000 by 1000 px, yet it is styled to display smaller with CSS, you can make your load time quicker. As it stands, the browser would need to download the original (larger) image to display at the smaller size.

Use a Content Delivery Network (CDN)

Be sure to upload images that are sized correctly ;

otherwise, you will, without a doubt, run into speed issues. WordPress handles this automatically by creating multiple versions of an image when uploaded, but if you are using another CMS, you may need to manually resize images.

Using a CDN essentially spreads the server load across a number of different locations and uses that closest to the user to serve the assets. The closer the data, the quicker the load time. Sound good? Check the must-know SEO practices for CDNs before you try it.

Defer Offscreen Images

You could also look at deferring offscreen images, meaning that they’re downloaded only as a user scrolls. It does risk not all images will be visible when required. However, it is often a compromise worth making to improve load times. You can find a number of WordPress plugins that can help, or Google has its own advice about offscreen images.

Use Next-gen Image Formats

Lastly, consider using next-gen image formats such as WebP. It has been demonstrated that WebP images can result in an 85.87% decrease in average image size compared to JPG and a 42.8% decrease against PNG.

They are not supported by all major browsers, but some applications can handle WebP.

Improving Server Response Time

The reality is that making improvements to your server’s response time isn’t something that most have the ability to do, given that the two real areas of impact are either reducing the load or improving the hardware. Improving server response time really comes down to making sure your site is hosted on a great server. Publisher TechRepublic has a cheat sheet for choosing the best web host.

If you see recommendations that relate to either the server response time or TTFB (time to first byte), have a chat with your hosting provider or consider hosting solutions better suited to your site.

Minification

When writing code, it is common for this to be done so in a way that uses spaces to keep it easy to read. Simply, minification removes whitespace and comments to optimize CSS and JS files and can be done using a simple copy-paste tool such as Minify.

Browser Caching

If you are using WordPress as your CMS (which an estimated 35% of the web does), it couldn’t be easier to use browser caching, with popular free plugins including W3 Total Cache and WP Super Cache.

Caching works by creating and quickly serving a static version of your site to users, as opposed to a page being dynamically generated every time it is accessed. If you are not using WordPress, it is still possible to set up browser caching manually.

Clear Up Redirects

Over time, multiple redirects can build up and result in a slowed page load speed, as browsers are forced to make additional HTTP requests, adding to the load time. PageSpeed Insights will highlight these issues. Finally, when you’re done implementing the various optimization suggestions, try scanning your site again. This way, you’ll be able to see if your changes have made an improvement to your scores and loading times, or if you still have work to do.

It’s also a good idea to perform this check periodically – at least every six months. Your page speeds can fluctuate over time, but this way you’ll know if performance starts to slip (and be able to address it right away).

Your site’s loading speed is a key metric affecting its success. Pages that are too slow may cause users to abandon your site. Fortunately, you can diagnose performance problems easily by using PageSpeed Insights. This tool identifies areas for improvement in speed optimization and helps you make key changes to your site.

CONCLUSION

You can optimize your site using PageSpeed Insights by following these four simple steps:

•  Scan your site.
•  Review your scores and opportunities.
•  Implement the suggested improvements.
•  Re-scan your site, and continue to check back periodically.

Do you have any questions about using PageSpeed Insights to improve your site’s performance? Let us know in the comments section below!

Check out the following article to learn 7 Tips to Get Your Website Indexed by Google.