How To Improve Webpage Load Speed With HTTP/2: A Beginner’s Guide

To borrow the words of Pete "Maverick" Mitchell (from the 1986 hit film Top Gun) we all “feel the need, the need for speed” when we’re browsing the internet. Nobody likes to sit around and wait for a webpage to load.

We all know that faster websites are better. Faster websites make users happier, rank better on Google, and convert more visitors into customers. When it comes to making that a reality, there are a lot of best practices that you can implement to make your website load faster. One that’s a little more recent (in the last few years) is actually an entirely new protocol: HTTP/2.

What is HTTP/2?

Since its inception the early 1990s, the worldwide web has basically run on HTTP. Every cat video, fail video, Amazon product page, and news article you look at uses HTTP to travel from the website’s server to your computer.

In more technical terms, Hypertext Transfer Protocol (HTTP) is the protocol used to facilitate communication (viewing webpages, submitting web forms, etc.) between a user and a website. The first version of HTTP was created in 1991, and the rest is history – the world wide web exploded and the HTTP protocol became part of nearly every aspect of our lives.

While there were a few updates to the HTTP protocol over the years, it’s remained largely the same for over 2 decades, until 2015 when HTTP/2 was finalized by the Internet Engineering Task Force (IETF) HTTP Working Group.

What’s the benefit of HTTP/2?

In a word, speed. More specifically, HTTP/2 is optimized for handling multiple requests at the same time.

HTTP/1 has a key limitation: it can only handle one request at a time per connection. Any given webpage might include dozens or even hundreds of files (HTML, CSS, Javascript, images, and more). When using HTTP/1, browsers have to wait to download these files one at a time or open multiple connections (which triggers other issues).

When HTTP was first created, this wasn’t such a big deal. Back then, webpages tended to look like this:

Figure 1: Websites in the age of HTTP/1

That entire webpage consists of two files: the HTML webpage and a single image banner. With dial-up internet speeds being the fastest thing available, website creators couldn’t get very fancy. But with only two files, being limited to downloading one file at a time wasn’t a problem.

Today’s webpages are far more complex. For example:

• The homepage of amazon.com requires 315 separate requests/files.

• The homepage of cnn.com triggers 521 separate requests for files.

• The homepage of ebay.com makes 256 separate requests.

As you can see, it would be very inefficient to download these files one at a time, or even to download 6 at a time. That’s the problem that HTTP/2 fixes.

HTTP/2 allows browsers to simultaneously download multiple files over the same connection. This makes it a lot faster for the user to download all the files needed for a given webpage.

If you’d like a simple (but detailed) explanation of how HTTP/2 works, I recommend An introduction to HTTP/2 for SEOs by Tom Anthony. It’s even got great little illustrations using trucks that help make a intangible concept super-easy to conceptualize and understand:

How much faster is HTTP/2?

Great question. Knowing how much impact HTTP/2 has on your webpage speed can help you prioritize the effort required to activate it.

• Tests by Pingdom found that HTTP/2 reduced page load times by 13%.

• CSS Tricks found that an optimized HTTP2 setup can reduce page load times by up to 48%.

• A test of en.ryte.com on DareBoost shows that HTTP2 improves its load speed by 11%:
  

  

Figure 2: Graph that demonstrates how much faster HTTP/2 would be on en.ryte.com than HTTP/1

• A DareBoost test of cnn.com shows that HTTP/2 gives cnn.com a massive boost in page load speed:
  

  

Figure 3: HTTP/2 would clearly give en.ryte.com a speed boost

In other words, switching to HTTP/2 can improve your page load speed by a significant amount. The exact amount varies a lot depending on how your website is structured. Will HTTP/2 replace other optimizations? No. But it’s a powerful tactic to add to your speed optimization toolbox.

HTTP/2 support

In order to get the speed benefits of HTTP/2, both your web server and your website visitor’s browser need to support HTTP/2. The good news is that HTTP/2 support is widespread, with adoption growing every month (according to data from w3techs.)

• Browser support: All major browsers, including Edge, Firefox, Chrome, and Safari have full support for HTTP/2.

• Server software support: Most major server software supports HTTP/2, including Apache, IIS, nginx, and Tomcat.

• Content delivery network support: Most CDNs, including Akamai, Cloudflare, AWS, and more support HTTP/2.

Not only is HTTP/2 support widespread, but there’s full backwards compatibility also. So you don’t need to worry about your website being inaccessible to users with outdated browsers. Once you enable HTTP/2 on your web server, any user whose browser doesn’t support HTTP/2 will simply use HTTP/1 to communicate with your website.

HTTP/2 requires HTTPS

In addition to speed improvements, HTTPS introduces an important security improvement – all connections in HTTP/2 must be encrypted and use HTTPS. In other words, your web server must have an SSL certificate installed and correctly configured in order for HTTP/2 to work.

Don’t have SSL/HTTPS setup on your site? Here’s what you need to do:

• Install an SSL certificate. Some web hosts provide SSL certificates as part of hosting packages, otherwise, you can get one from a trusted certificate authority such as Sectigo (formerly Comodo CA). You can then install the SSL certificate via cPanel or whichever web hosting control panel you use.

• Force HTTPS. Once you’ve installed the SSL certificate, you’ll need to configure your website so all your webpages use HTTPS instead of HTTP (sometimes this is called “Always On SSL”). If you’re not sure how to do this, see these guides on switching WordPress from HTTP to HTTPS and redirecting HTTP to HTTPS in .htaccess.

How to check if HTTP/2 is enabled

Your website may already support HTTP/2 if your web server and/or web hosting company enables it by default. HTTP/2.Pro is a free tool you can use to check your website for HTTP/2 support. For example, here’s the report for our website SectigoStore.com:

Figure 4: Use HTTP/2.Pro to check if your website is HTTP/2 enabled

How to enable HTTP/2 for your website

Enabling HTTP/2 requires administrator-level access to your web server software. Most website owners don’t have this level of access, because they have a shared hosting account, and only the hosting company has admin access.

If you have a shared hosting account, contact your web hosting support. Ask them to enable HTTP/2 on your server or to migrate your account to a server with it enabled.

If you have root-level access to your web server, you can make the changes needed to enable HTTP/2 yourself. Here are guides for each of the most popular web server software:

• How to enable HTTP/2 on Apache

• How to enable HTTP/2 on nginx

• HTTP/2 on IIS

• LiteSpeed HTTP/2

How to test how HTTP/2 impacts your website speed

Once you’ve enabled HTTP/2 on your website, it’s pretty easy to test how it impacts your website’s page load speed. You just need to load your website over HTTP/1 and HTTP/2, then compare the times. Fortunately, there’s a free tool from DareBoost that makes that easy to do. Enter your website URL and you’ll get a report like this showing how load times for your website differ between HTTP/1 and HTTP/2:

Figure 5: Compare your HTTP/1 and HTTP/2 load times

Conclusion

HTTP/2 is one of several tactics that every website should implement to maximize page load speed:

• Server optimizations (increased resources, caching, g-zip compression, etc.)

• Back-end code optimizations (code and database optimizing)

• Front-end code optimizations (minification, etc.)

• Image compression and optimization

• HTTP/2 enabled

Together, these tactics optimize all factors that determine web page load speed, ensuring that your website loads as quickly as possible for users.