The Importance of Page Load Speed & 4 Ways to Improve it

The world is getting smaller every day. People get things faster.

When Apple is launching their new iPhone, people start getting in lines days before the launch. They literally camp outside the Apple store.

Whenever there is a breaking news, you find yourself glued to your TV screen. And behind the scenes, the reporters are scrambling to deliver that fresh report to their network.

Everyone wants to be the first. And everyone wants to get there as quickly as possible. And the same thing applies to the websites that people visit and to the internet as a whole.

Don’t you just hate it whenever you see that buffering icon on YouTube?

So imagine how your visitors might feel if they have to wait even more than a millisecond for your website to load.

With the overload of information, people have no patience with websites these days. And they are right to be impatient. Because there are hundreds of other websites where they can access almost the same information as you were going to provide them.

So why not go to a website that loads much faster and overall, gives them a better user experience.

Every internet user expects any, if not all the websites they visit, to load within 2 seconds. And if the website has not finished loading within 3 seconds, they abandon the website. This is according to a study done by KISSmetrics.

But that’s not the worst thing.

If you are in the eCommerce business, you will have a harder time sustaining your business than in any other industry out there. Because almost 64% of the shoppers, that experience longer loading times usually go for an alternative website. Even if that means paying more for the same product.

So because of slow loading speeds, you might not just lose random visitors. You might actually start losing actually, loyal customers that once purchased from you.

This is mainly because when a website takes a lot of time to load, the trust on that particular website goes down. Because in this day and age, if you are a thriving business, you ought to have lightning fast page loading speed. And that’s what your visitors/customers expect.

So the trend that we’re seeing here, is not that it is okay if your website takes a couple more seconds to load because you have a ton of images on that page.

That’s unacceptable.

You just cannot have your website slow down because you have a ton of images, or maybe there are some unoptimized files on that page. You have to take care of that right now if you want to stay in business a year from now.

And on top of all of that, Google had also announced that the loading speed of your website will now be considered as a ranking factor.

So, don’t think that you are in the clear if you’re not the eCommerce industry. You will still need to optimize your website for speed.

But the good thing is, Google compares your website with your competitors. And whoever has the lowest load time, will win that competition. But don’t be a happy duck just yet if your website is very fast. Because Google also considers a couple different factors like the device, the network, the country, etc.

Now that we understand how important the loading speed of a website is, let’s jump into some of the ways through which you can improve it.

1. Minimizing HTTP Requests

HTTP requests are used whenever a browser wants to fetch a file from a particular web server. If this does not happen, then your website won’t load (obviously).

Yahoo conducted a study recently and found out that more than 70% of the time is taken by these HTTP requests.

On top of that, every browser is only limited to have 4-8 simultaneous connections per domain.

So if you have 30+ files that need to be fetched by the browser, then good luck with that. Might as well get some popcorn because your website is going to be loading for a while.

But this also gives us room to improve. If you have a ton of HTTP requests, you need to lower them.

How Do We Decrease the Number of HTTP Requests?

Great question. Very relevant. I love it!

There are several things that you can do to reduce the number of HTTP requests. Here are some of them:

• Use queries only to load what’s needed –

  You can use specific conditional statements to do this. Let’s say that you know that you only need to load specific images on the desktop version of your site. And you only need to load a specific number of images on the mobile version. So, instead of loading them on both, you can add conditional statements. These are scripts that take the load off the browser and will also improve your website’s loading speed.

• Combine CSS and JS files –

  If you have a ton of CSS or Javascript files that are being loaded on a page. Rather than keeping them separate, you can combine them. This will prevent the browser from using a separate connection to load a specific CSS/JS file. Instead, it will be able to load them together. But this can also be a challenging thing for you if your website varies from page to page.

• Reduce how many images you use –

  I’ll put it this way. Only use images if you think that they will improve the overall user experience of your visitor. If you find some images that are heavy, then it probably a good idea to get rid of them. If not, you can try some image size reduction websites or plugins. WP Smush is a well-known plugin that does that.

2. Start Using CDNs and Get Rid of Unused Scripts

It is very possible that most of the visitors coming to your website will not be in a close proximity to your web server. And the greater this distance is, the more time it will take for the web server to transfer information.

So, it makes sense if you were to spread out your content across a huge number of servers throughout the globe. But that will be a bit too complicated for people like you and me.

That’s where these CDN, aka, Content Delivery Network companies come into the picture. These companies own a ton of web servers across the globe. Once the files of your website are uploaded to their servers, they can then take advantage of the location to load your website quicker.

A ton of businesses just use a CDN provider like EdgeCast or some other provider to get this done for them. This reduces the headache that they would have to go through by owning all those servers.

Other smaller businesses might even think that having a CDN is unnecessary or maybe out of their budget. So they choose to go for resourcefulness to get the same quick loading effect. Websites such as CNDjs can help you with that.

They have a library of CSS and JS files that you can utilize and not host on your own servers. This will reduce your load time.

3. Use Browser Caching

This is a nifty little trick that everyone should use. Through browser caching some of the files of your website can be downloaded to the hard drive of your visitor in a cache. A cache is a temporary storage space.

Once these files are downloaded in the cache, it drastically reduces the load times of your website. Because essentially it can just pull all the files from its cache instead of downloading them each and every time.

The best part about this is that whenever the visitors visit your website, if the first page loads quickly enough, certain files of your website can be downloaded into their cache. And if they decide to check out the other sections of your website, they will experience even faster load times.

But there is a catch to this amazing method.

All CSS, JS, images and media files that are being cached on the visitor’s computer must comply with the expiration times of the RFC. Ideally, people prefer to have the expiration of one year because anything more than that will violate the guidelines. So basically, you can choose something between a week and a year.

If you are interested in learning more about enabling browser cache and improving the page load speed of your website, you check out this article.

4. Compressing Images and Files

If you didn’t realize it already, your images take up 60% of the average bytes that are loaded per page, if not more. And it makes sense that images take up a huge amount of HTTP requests to load.

And as I mentioned earlier. If you want to have faster load times, you want to lower your HTTP requests. If you find any images that do not fit the context of your content, get rid of it.

If it does not improve the user experience, get rid of it.

This also includes icons.

Now that you have gotten rid of all of the unnecessary images. Now it’s time to take a look at the images that you have left. You want to make them as light as possible. Because majority of the people that use images, they directly download these images from the stock photo websites and upload them without even thinking about reducing the size of those images.

Let’s be honest, even you have never thought about making your images “lighter” until you started reading this article and realized how important it was to have your website load faster.

Assuming that you have a lot of large images, you want to run them through different image optimization software like Compressio.io or the Image Optimizer. It depends on which one you prefer. Just choose one and go with it.

How small should be the size of your images?

A good rule of thumb is to have them below 150KB for all the images that are at or below 1920px in width. This means that you will get the 72dpi quality which will be more than enough quality for these images to look good on most devices.

If the images go above 150KB, they will take more time to load and will also eat into the page rendering time as well. Not only that, large images also make the response times a lot slower. So your visitor might think that your website is broken. But in reality, you might just have a large image messing it all up.

So what file extensions you should use for your images?

Here’s a list of the file extensions that you should use:

• SVG for vector images. Because you want to see more detail in vector images.
• PNG for the images in which you want a transparent background.
• JPG for the rest of the images. These will be the images where you don’t have to focus on the fine detail.

Here’s the reality, images will still take up majority of the HTTP requests. But if you optimize them and reduce the number of images you use, along with optimizing the other aspects of your website, you can improve the overall page load speed of your website.