Page speed continues to be a buzz topic in both marketing and business circles, but it’s often left as the last initiative that is tackled because few people understand how to undertake this type of project. While sometimes large structural initiatives like server migrations or CDN implementations are required, frequently, smaller changes can make a large impact in your page speed.

 

 

3 Reasons Why Page Speed Is Important Now

1. Over 60% of online searches are done on mobile devices and most mobile pages load in three seconds or less.

2. In July 2019, Google switched to a mobile-first index meaning they index and rank your website based on the mobile version of your website – including your mobile site’s page speed.
3. Sites that load in five seconds or less have 70% longer sessions; on top of that, pages that load within two seconds have a low bounce rate of 9%, while sites that take at least five seconds to load have a bounce rate of 38%.

 

It’s clear that having a fast website is more important than ever, but where do you start tackling such a large optimization initiative? In this post, we’ll cover everything you need to know about website speed including changes you can make to impact your site speed in a big way. Let’s dive in!

What Constitutes a “Fast” Website?

When it comes to page speed, there are two entities whose experience you need to pay attention to: human users and website crawlers like Googlebot. As humans, we’re impatient people and with so much content online, we have a lot of choices to get our information from; if your site is loading slowly, visitors will bounce and visit your competitor, and they won’t even have the chance to see how amazing your content actually is. 

 

On the other hand, it’s just as important to pay attention to Google’s interpretation of your page speed. Google actually uses page speed as one of their ranking signals, so the faster your website is, the better chance you have of ranking well. This becomes especially important with highly competitive niches where every advantage you can get above your competitors makes a difference. 

 

However, humans and Google are going to interpret page speed a little differently because there isn’t a one-size-fits-all metric to describe page speed. While you may think your website is fast, Google is typically a harsher critic, which is why it’s so important to dive a little deeper into 

page speed metrics.

Metrics to Pay Attention to

The industry-standard tool for measuring page speed is a tool powered by Google in partnership with Lighthouse called PageSpeed Insights. This accessible tool is free and provides data in a visual and self-explanatory way. One thing to note however, is this data is not an aggregate view of your website’s performance, rather each time you submit the URL it pings your site, so it’s important that you take note of your scores on a regular basis so you can monitor trends. 

 

PageSpeed Insights scores your website on a scale of 0-100, for both desktop and mobile versions, with 0 being the lowest score and 100 being the highest. The scores are generated by comparing your site to similar sites within your niche. Typically speaking, your mobile score is going to be lower (worse) than your desktop score because historically developers and website owners have focused on the desktop experience. It’s only more recently that people have begun to stress the importance of the mobile experience. 

 

Diving further into the data, Google provides the following metrics: 

 

First Contentful Paint: The time it takes for the first site element to load; it’s the first sign to users that the page is actually loading. 

First Meaningful Paint: The time it takes for the primary content of the page to load. 

Time to Interactive: The time it takes for the page to actually have clickable content that you can navigate. 

 

Time to interactive is usually deemed as the most important metric to pay attention to, but the following suggestions for improving your website page speed will affect all of these metrics.

How to Improve Your Website Page Speed?

Now it’s time to cover some actionable steps you can take to improve your page speed. As we mentioned above, some websites will require larger initiatives to cover the page speed issues it’s facing. In this post, however, we will focus on slightly more accessible initiatives.

1. Optimize Your Images

Images can be some of the largest elements on your site and can easily contribute to loading lag. To ensure that your site’s images aren’t a sticking point for users or bots make sure that you’re resizing them before uploading them and compressing them for additional savings. In most cases, your images should be no larger than 500 KB; images this size will still be clear, without being unnecessarily large. 

 

To take your efforts a step further, before uploading your resized image, you should compress it. If you have a WordPress site, there are plugins you can add that will take care of this for you, but for other CMS users, you can take advantage of tools like ImageResize that will reduce the file size without reducing the resolution.

2. Minify Your CSS

Similar to a wordy book or report, your website’s code can also be considered too lengthy. To reduce load times, it’s a good idea to review your code and implement minification to improve your page speed performance. Minification involves taking multiple lines of code that are synonymous and reducing it to a single line. Of course, this isn’t always going to be possible, but you’ll be surprised how much time you can save by reducing even a few lines of code. 


CSS minification should be built into your site’s workflow; tools like
Gulp or Webpack are instrumental in making these changes.

3. Utilize Browser Caching

Browser caching is a technology that allows a user’s browser to store copies of your site so that when a visitor returns, the page can be called up from the cache instead of your browser having to reload the entire page. Because your visitors aren’t going to have to wait for the entire page to load every time the website loads, they will quickly notice large page speed improvements. 

 

If you have a WordPress site you can easily add a caching plugin, but non-WordPress sites can also take advantage of browser caching with the help of a developer to implement server-side scripting.

4. Organize Your Code

If this is your first time paying attention to page speed, you probably haven’t thought about the need to organize your site’s code to improve your page speed, but it’s definitely not something to be ignored. A good rule of thumb is to keep your CSS files at the top of the page and your Javascript at the bottom of the page. 

 

By placing your style sheets before your scripts your users will see the site loading as the CSS loads instead of having to wait for the entire site to load before they see anything – creating an illusion of a faster site to keep your visitors happy. 

 

While there are dozens of website improvements that can be made to improve your page speed, we hope this post has been helpful in giving you a starting point. If you’re looking for a more robust approach to your site speed however, look no further than our development and engineering experts at Inventive.

X