11 Low-Hanging Fruits for Increasing Website Speed (and Conversions)

Website speed matters. Fast-loading sites perform better on all fronts: better user experience, higher conversions, more engagement, even higher search rankings. If you’re after mobile traffic (everyone is), site speed becomes even more important. No one wants to download a 4MB website on their smartphone, but most sites are that way. Your website can be different.

How fast is fast enough?

While one-second load time would be nice, if you manage to get a load time under three seconds, you’re doing fine. If it’s under seven seconds, it’s okay too (but you have to try to improve it). Over 10 seconds and you’re losing money in noticeable quantities.

A while ago, Strangeloop tested the load times of the top 2,000 retail websites. They saw that web pages keep getting bigger, and the average site takes 10 seconds to load. The average load time for retail websites is between 8.3 and 10.3 seconds.

So how fast should your site be? While Jakob Nielsen says people can handle up to 10 second load time, consider this:

• Some 45% of people are less likely to make a purchase when an ecommerce site loads slower than expected.
• Pages that load within two seconds have an average bounce rate of 9%, while pages that take five seconds to load have a bounce rate of 38%.
• According to this scientific study, tolerable waiting time for information retrieval is approximately two seconds. Adding feedback, like a progress bar, can push tolerable waiting time to 38 seconds (so if your site is slow, add progress bars or equivalent).
• A one-second delay in mobile load times can impact conversion rates by up to 20%.
• 8% of people cite slow loading pages as a key reason for abandoning their purchase.

Only 25% of the Alexa 2000 uses a CDN. A fifth of sites fail to implement relatively simple performance-enhancing techniques. Of course, some sites are fast. The fastest of them (according to Strangeloop study) were CVS.com (1.02s), Polo.com (1.9s), eCrater.com (1.95s). Amazon’s page load time was 3.26s.

Tools to analyze your site speed

• Pingdom tests the load time of that page, analyzes it, and finds bottlenecks.
• Google PageSpeed insights analyzes the content of a web page, then generates suggestions to make that page faster.
• YSlow tests web page performance against 23 rules they’ve identified as important.
• WebPageTest uses real browsers at consumer connections speeds and provides optimization recommendations.

A thing to remember here is that scores don’t matter—it’s how fast your site is that makes a difference. These scoring tools let you look at potential issues and advise on best practices, but they will not solve your site’s problems for you.

One more thing to keep in mind is the geolocation of your server and your target audience. Tools like Pingdom let you choose between multiple locations, make sure you choose the one closest to your audience.

How to make Google Analytics speed tracking more accurate

You’ve probably seen that Google Analytics will tell you your site speed, page speed, etc. Pretty useful stuff. I urge you not to just look at average page load time, but go deeper (e.g., look at the Distributions tab to see page load speed distributions). ‘DOM Timings’ reports are useful as they show how long it takes for your pages to become usable.

Its’ pretty accurate since all load speed data in Google Analytics is taken from users’ browsers. The problem is that it only takes in data from about 1-5% of the visits, meaning it’s often not a statistically valid sample size. Instead of 5%, you could store it for 100% of visitors without any downsides. You only need to modify the create method of your Google Analytics script:

ga(‘create’, ‘UA-XXXX-Y’, {‘siteSpeedSampleRate’: 100});

Make sure you don’t break your Google Analytics code when adding this :)

Note that not all browsers support it (Safari), you will never see a 100% sample rate, but this will increase it significantly. There is also a 10,000 hits/day limit and if that is an issue, you could overcome this with a workaround using events.

Impact on conversions

Main point: faster sites get higher conversions.

Check out these studies:

• Making pages two seconds faster led to a 66% conversion boost.
• One guy got an 8.47% conversion rate improvement by moving his landing page onto a faster host.
• AutoAnything increased sales by 13% and conversion rate by 9% when they cut their page load time in half.
• Shaving 2.2 seconds off Mozilla’s landing pages increased download conversions by 15.4%, which they estimate will result in 60 million more Firefox downloads per year.
• Amazon reported already in 2006 that they got 1% revenue increase for every 100ms of improvement.

What will a one-second delay cost you? Find the answer on the image below:

Are you thinking about mobile users? Here’s why you should

Let me say that I have Google Analytics access to hundreds of sites across the world. I see how many mobile users there are on these sites, and I always look at the growth rate.

In my experience, for most sites in the US mobile visitors add up to around 50-60% of total viewers. The trend is up everywhere. Back that with the fact that 52.2% of all website traffic worldwide is generated through mobile phones, and you have a serious case on your hands.

Mobile users usually have slower connections, but they expect sites to load just as fast. To be precise, 53% of mobile site visitors leave a page that takes longer than three seconds to load (while the average loading time of a mobile landing page is 22 seconds).

Here are three high quality articles on improving mobile site performance:

• How To Create High-Performance Mobile Websites
• How To Make Your Websites Faster On Mobile Devices
• Are you making any of these 8 common (and wrong) assumptions about mobile performance?

If you want to take optimizing your website for mobile users to a whole new level, there are two projects by Google that you should consider implementing.

Progressive Web Apps (PWA) offers a way to deliver amazing user experiences on the web, it does so by combining the best aspects of both browser and native applications. Alibaba.com increased conversions on the mobile web by 76% when they implemented their PWA.

The second project is called AMP or Accelerated Mobile Pages, which allows you to build a light version of your website that would load in a blink of an eye, even on slower connections. Myntra, the largest ecommerce store for fashion in India, reduced their page load time by 65% when implementing AMP.

11 low-hanging fruits for improving site speed

#1 Start using a CDN (Content Delivery Network)

It’s so worth it, especially if you have a decent amount of traffic. Your audience will thank you with extra dollars.

Check out these options:

• StackPath. Lots of people say good things.
• CacheFly. Another trustworthy provider.
• Cloudflare. Part CDN, part security tool. I use it on CXL.
• Imperva. Similar to Cloudflare, with fast and effective protection solution.

Here’s a great article on how to pick a CDN.

#2 Host your static files in the cloud that uses a CDN

Serve static content from a cookieless domain, backed by a CDN. Why cookieless domains? Every time a browser sends an HTTP request, it has to send all associated cookies that have been set for that domain and path along with it.

Static content, such as images, JavaScript, and CSS files don’t need to be accompanied by cookies. You can decrease latency by serving static resources from a domain that doesn’t serve cookies.

Check out these two options:

• Rackspace files
• Amazon Cloudfront

#3 Install Google PageSpeed on your server

Tell your web host guys to set it up, you’ll love the results.

PageSpeed improves web page latency and bandwidth usage by changing the resources on that web page to implement web performance best practices. It will automatically apply web performance best practices to web pages and associated assets (CSS, JavaScript, images) without requiring that you modify your existing content or workflow. Plug and play.

#4 Tell your hosting provider that you want caching installed

Memcached is an open source high-performance distributed memory object caching system. It’s used for speeding up dynamic web applications by alleviating database load.

Consult with your system admin first about your particular setup, but in most cases Memcached will be a great help (alternatively, look at Redis).

Unlike PageSpeed, this doesn’t do anything upon installing, so you need to configure your sites to use it. If you use WordPress, it plays nicely with W3 Total Cache plugin, and you can set Memcached to do the caching.

#5 Optimize your images

Images can be large, and make your website slow to load. That’s why you need to reduce the file size of your photos that you use on your blog posts and other content, logo files, graphics, etc. The good thing is that you can significantly reduce image size without compromising quality.

If you use WordPress, use a plugin like EWWW Image Optimizer which optimizes your images as you upload them (can also optimize them in bulk in Media Library).

If you’re not on WordPress, check out Kraken as a great image optimization service.

#6 Use a fast web host

Not all web hosts are made equal. In fact, your web host makes a huge difference.

If you have a decent amount of traffic, you should not be on hosts like Bluehost, Hostgator, GoDaddy, and other low budget web hosts like that.

• WP Engine. Web hosting made for WordPress. Blazing fast, fanatic support, stuff that dreams are made of. If you run WordPress and want a fast site, this is it.
• LiquidWeb. Shared hosting, dedicated hosting, cloud hosting, CDN. They have it all.
• INAP. Best dedicated server host I’ve come across.
• Hetzner. Best deals on dedicated servers.

#7 Minimize round-trip times (RTTs)

RTT refers to all the requests required when a user accesses your website. This is not a size of file issue, but a number of requests issue. Each asset that needs loading—CSS files, JavaScript files, images, files, etc.—is requested individually.

Your browser sends a request to the web server, which sends information back. The same for each file. That’s why an important strategy for speeding up web page performance is to minimize the number of round trips that need to be made.

Google has a handy manual for doing it all. Here’s a quick summary (have your web guys take care of it):

• Combine all your JavaScript files into one to minimize requests. If you’re technically inclined, check out Google Closure Compiler.
• Combine images with CSS sprites. The higher the number of images used on a page, the more roundtrips there are between visitor’s browser and the web server. Ideally you merge all tiny background images into one, and use CSS to show them. Your front-end developer (CSS guy) should take care of it. Check out Compass for creating CSS sprites.
• Avoid CSS @import. Instead of @import, use a <link> tag for each stylesheet. This allows the browser to download stylesheets in parallel, which results in faster page load times.
• Minimize DNS lookups. Avoid using multiple domain names when loading a site.
• Minimize redirects. If needed, always use http redirects instead of JavaScript.

The aforementioned is valid for sites using HTTP, in case your site has already switched to HTTP/2 or you plan to do so anytime soon, it is actually better to have multiple smaller JS and CSS files rather than one large file. This is possible because HTTP/2 leverages the option of serving all the files coming from the same server over a single TCP connection.

#8 Use caching (plugins)

Many caching tools will already take care of the issues mentioned in the previous step. If you use WordPress, you should really take a look at W3 Total Cache plugin.

 #9 Compress your website with gzip

Compression reduces response times by reducing the size of the HTTP response. Gzipping generally reduces the response size by about 70%. Some caching extensions and plugins do it automatically, sometimes you need to set it up manually at the web server level. Here’s one of many millions of manuals on how to do it.

#10 Add an Expires header

Browsers use cache to reduce the number and size of HTTP requests, which makes web pages load faster. A web server uses the Expires header in the HTTP response to tell the browser how long a component can be cached. For static components, implement “Never expire” policy by setting far future Expires header. For dynamic components, use an appropriate Cache-Control header to help the browser with conditional requests.

While most caching systems take care of it, you need to look into it.

#11 Switch off all the plugins you don’t need or use

I see a lot of WordPress and other sites that have a ton of plugins and extensions installed that are actually not used. Many of them require loading different CSS and JavaScript files. All that can significantly slow down your site. Perform a plugin audit and switch off all the plugins you don’t use.

Conclusion

Improving site speed is part of conversion optimization. It’s often the low-hanging fruit that you can get done right away—improving user experience and revenue at the same time.

Featured image source