How can you make your webpage faster? Find out!

As a producer and consumer of web content, you certainly know that page speed is important. But do you know how important?  

Firstly, it’s good to know that nearly half of web users, 47%, say they expect a web page to load in two seconds or less. But on top of that, Amazon noticed that every 100 milliseconds of latency cost them 1% in sales (equivalent to $1.6 billion in sales over the course of a year!).   

Basically, web users are an impatient bunch. If you want to keep them on your site, clicking links, and buying your products, your page has to be lightning fast. 

What is a good page speed?

Let’s start with identifying your goal. What is a good page speed to aim for? 

The ideal page load time is three seconds or less, according to Google. That’s because mobile users abandon 53% of searches that take longer than that amount of time to load. 

However, the vast majority of sites and pages are far slower than that benchmark. In fact, Google analyzed 900,000 mobile landing pages around the world and found that 70% of them took seven seconds to load the visual content above the fold. 

This is a problem, and not just because it could reduce your conversions and increase bounce rates. It might make it harder for customers to find your site in the first place. Google uses page speed as one of its ranking factors. So, if you want your site to turn up on page one of the SERP, we need to get your page speed up to 3 seconds or less. 

The good news is, this is absolutely doable. 

How to enhance page speed

Let’s get down to the nitty gritty. Here are a few tips and tricks for enhancing your page speed.

1. Minimize HTTP requests.

80% of a web page’s loading time is spent downloading all the different components of the page. An HTTP request is required for every image, style sheet, and script. Having fewer components on each page means fewer HTTP requests and faster loading time. 

2. Combine some files and “minify” as many as possible.

Look through all of your site’s files. Very likely, there are some that are candidates for combining files. Start with your HTML, CSS, and JavaScript files.

While these are all important files, they require a huge number of HTTP requests. You can reduce these requests by minifying and combining files.  

“Minify” your files by removing unnecessary formatting, code, and whitespace. Take out extra spaces, line breaks, and indents. This will make the files smaller. (Or mini.)

Combining files means taking two or more files of the same type and combining them into one. It can be fairly simple with plugins.

3. Use asynchronous loading for CSS and JavaScript files.

CSS and JavaScript can be loaded in two different ways: synchronously or asynchronously. 

When scripts load synchronously, this means that they load one at a time. Asynchronous loading, in contrast, means that some scripts will load simultaneously. 

When a browser loads a web page, it moves from top to bottom. When it gets to a synchronous script file, it stops loading the other scripts until it has finished with that particular script. But if the script file is asynchronous, the browser is able to continue loading the other scripts on the page simultaneously.

4. Defer JavaScript loading.

When you defer a script file, you tell the browser not to load that particular file until after the other elements have loaded. It’s smart to do this with larger files, like JavaScript, so that they don’t slow down the rest of the page’s load speed. Furthermore, Javascript can be intense for the browser, since it needs to be downloaded, parsed and then run, before it will start to influence the content on the page. 

5. Choose the right web host.

It might be tempting to go with the cheapest host you can find, especially if your budget is tight. But it’s just now worth it in the long run. Cheap hosts often host too many sites, and their servers are overcrowded. As a result, your site gets less bandwidth and your page speed slows way down.

6. Repair broken links.

Not only do broken links annoy your site visitors, they stress your bandwidth too. You can fix broken links easily with tools like Siteimprove, which crawl your pages regularly to ensure all your links are working correctly.

7. Reduce redirects.

This is a bit of a catch-22. The easiest way to repair your broken links is often with redirects. And sometimes, you just have to use them, like when you move or delete a page.

But they also create a lot of extra HTTP requests. As we’ve already learned, these can slow down your page speed considerably, so keep them to a minimum as best as you can. 

Start by using a broken links tool, then run a site scan and search for all 301 redirects on your site. Look over your list. Do they all serve a purpose? Do they accomplish something? If you find one that doesn’t, eliminate it. Be sure to look for request chains, which are redirects that lead to more redirected pages. If you find a chain, you can edit all redirected pages so that they lead straight to the most recent version of that page.

8. Optimize images.

Optimize your images by balancing their file size with their resolution. You want your photos to be as high-res as possible without creating an enormous file. There are tools that make this easy, like:

• ImageOptim
• ShortPixel
• TinyJPG
• TinyPNG
• Kraken
• ImageOptimizer 

Google recommends that the total size of your web page shouldn't exceed 500 KB on mobile, but the average is well above that (around 3 MB). Images will contribute to the size of your page significantly, so do everything you can to keep file sizes small. 

9. Optimize your web fonts

Web fonts are an important part of branding, readability, and accessibility—but they can also have a big impact on your site speed. Fonts are part of CSS files, and CSS files are on the “critical rending path,” meaning that the browser won’t show the page until those elements are rendered.  To help the page load faster, you can reduce the number of files that are on that critical render path. You also load fonts asynchronously—meaning specialty fonts will load in the background while a basic font is rendered immediately, making the page readable to users much quicker. 

Other than asynchronous loading, you can also optimize your font files by compressing them and use fewer stylistic font variations to speed up rendering times.

10. Storing your own videos

Web users love video content, and marketers use this medium more and more. But uploading a video directly to your site is a big mistake. Videos take up a ton of space, more than 100MB easily. One video alone could slow down your site. 

On top of that, if more than one user tries to watch the video at the same time, your server works overtime to deliver that huge file to multiple places. Since your server probably has a limited amount of bandwidth, this means that the user experience will be very bad.

Instead, host your videos somewhere else and embed them on your site. Some good options for third party video hosting sites are YouTube, Vimeo, and Wistia. It’ll save you space and speed up your load times. 

You know that page speed is important. Slow web page loading times cause lower conversions and higher bounce rates.  

If you want to keep your visitors on your site, clicking links, and buying your products, your page speed has to be fast. If you're interested in learning more about how to make your website faster, read more about Siteimprove Performance.