Patience is NOT a virtue when it comes to your website visitors.
As little as a one-second delay in your page load time is likely to cost you:
- 11% fewer page views
- 16% decrease in customer satisfaction
- 7% loss in conversions
In fact, as many as 47% of customers expect your website to unfold before them within the first two seconds. To add to this, around 40% people will bounce from a page that takes them three or more seconds.
This means that if your site takes over 3 seconds to load, you’ve lost almost half the visitors before they even arrive on your site. This is a huge figure and can cause a definite blow to your potential conversions.
If you get lucky and your visitor decides to stay, despite the slow loading speed, the chances that they return back are really, really slim. In a survey, 79% of the people surveyed mentioned that they’d never return back to a site with poor loading time.
These statistics reiterate the point we all are aware of, but not really do much about – improving the website speed enhances performance!
Talking of enhancing the performance, there are a lot of items for you to consider, beyond just the page speed. What we mean is a full-blown technical SEO audit to find and fix the pain points of your website.
Getting back to our topic of discussion, let’s quickly look at an example to help you understand the effect of page speed on performance.
Walmart, the American MNC, during their initial analysis found that the visitors who converted were the ones who received pages twice as fast as the leads that didn’t convert.
If you’re good at reading graphs, you already know what the image says. The faster a page, the more likely a visitor was to make a purchase from the website.
Post this, Walmart obviously went ahead to optimize their website. What followed was something along the lines of:
- For every one-second increase in speed, they observed up to 2% more conversions.
- For every 100ms of improvement, their revenue grew by up to 1%.
The example discussed above alone should be enough to make you realize the importance of improving your website loading speed.
If you’re still not convinced, let’s talk more:
- An organization as huge as Google suffered a 20% drop in traffic simply because of an extra 5 seconds load time.
- Amazon once ran A/B tests by delaying the loading of their pages in a progression of 100ms. According to their findings, even such small delays can result in a substantial loss, financially.
At this point, all of us can agree on the fact that people don’t like to wait! If they didn’t wait for Google / Amazon, you can be sure that they aren’t waiting for you.
“Okay, I like customers and all. But why does Google care?”
Short answer: Google takes the user experience very, very seriously.
They’ve proved it time and again, and this fact got cemented late last year when they rolled out their mobile-first index.
What the heck is mobile-first index now?
As of December 2017, Google started ranking the websites based on their mobile versions.
The reason? Mobile searches outnumbered desktop searches for the first time back in 2015, and ever since, their share has only increased. What this means is that it is in Google’s best interest to prioritize the mobile users and not redirect them to sites that won’t perform well on their device.
In essence, this is EXACTLY the opposite of how the indexing used to work.
UX has always been a priority, both for the businesses and Google, but prior to this release, Google only took the desktop sites into consideration. Even the sites that provided subpar user experience had a shot at ranking good.
But not anymore.
So, it’s imperative now more than ever to know how to improve your website’s loading speed to provide a better user experience – on any browser, on any screen.
How fast is fast enough, though?
While 1-second load time is perfect, you’re still doing well if you manage to keep it under 3 seconds. If it’s under 7 seconds, it’s still okay (although you need to work on it), but hit the 10-second mark and watch yourself lose clients (and money), in noticeable quantities.
According to Google, the ideal load time should be around 3 seconds. Unfortunately, according to their recent findings, most of the sites are nowhere near that mark.
Google analyzed more than 900k websites to find out that more than 70% of these websites took nearly seven seconds for the visual content above the fold to display.
None of the industries they surveyed had an average anywhere close to Google’s definition of an ideal load time.
Another insight from the survey was that as page load time goes from one to ten seconds, the probability of a mobile user bouncing increases by 123%.
This means that all the site owners, in general, have to work a lot in order to get their sites appreciated by Google.
However, there is an upside to this. It clearly means that if YOU put in the required work to speed up your website, you’re already well ahead of your competitors in terms of user experience.
For exactly that, let’s look at some low-hanging fruits that you can use to turn the game around.
Improving website load time: the checklist
#1: Switch to a Content Delivery Network (CDN)
CDN’s carry a significant portion of the world’s internet traffic. They are ubiquitous in their presence and can mitigate the challenges of supplying the content over the internet.
CDNs have become an essential tool to improve a business’ online presence. The reason behind it is pretty simple: the Internet wasn’t architectured to do all the wonderful things it does today.
It simply wasn’t built for handling the massive amounts of data, including HD videos, flash sales, and whatnots! CDNs were specifically built to make the Internet work better, deliver media at scale, and enable all the connected experiences that you can imagine.
If you have a decent amount of traffic, switching to CDN should be the most logical step towards increasing the pagespeed. Being widely used, CDNs also cache most of the resources on your user’s browser, enabling the website to load faster on their devices.
Check out the following free CDN tools:
- MaxCDN
- CacheFly
- Cloudflare
- Incapsula
#2: Host all of your static files in the cloud that uses a CDN
All your static content should be served from a cookieless domain that is powered by a CDN. The reason for emphasizing cookieless domains is simple.
Every time a browser requests for the resources, it has to send all the associated cookies that have been set for that domain and path along with it. Images, JS files, and CSS files, along with other static content do not need to be accompanied by cookies. By serving them from a domain that doesn’t serve cookies, you can drastically decrease the latency.
For the same, you have two options at your disposal:
- Rackspace files
- Amazon CloudFront
#3: Set up and install Google Pagespeed on your server
Take the help of your web hosting guys if you’re confused here, but you’ll definitely love the results.
Google PageSpeed changes the resources on your web page to implement best practices, thereby improving your latency and bandwidth usage. Installing PageSpeed will ensure that all the recommended practices have already been applied to the associated assets (CSS files, JS files, images, etc.)
It will also ensure that you don’t have to modify or update your existing content or workflow. Simply plug’n’play.
#4: Install caching
Memcached is one of the most widely used tools for this. It is an open source, high-performance caching system that is intended to speed up dynamic web applications by reducing the database load.
It will be a better idea to consult your system admin to figure out exactly what you require. But more often than not, Memcached will do the trick for you. Otherwise, you can also look at Redis.
Unlike PageSpeed, though, this tool doesn’t do anything just upon installing. So, you are required to configure the sites in order to implement it. If your website is built on WordPress, you can simply use the W3 Total Cache plugin and let Memcached handle the rest.
#5: Optimize and scale your images
Images, however important to maintain the interactivity with your users, often act as a major deterrent in letting you speed up your website. You need to reduce the image sizes by optimizing them in order to ensure they load quickly.
The good news – there are numerous free tools available to help you do just this. And that too, without compromising an iota of the image quality. Imageoptimizer, Optimizilla, and the tool by Kraken are just to name a few. If you’re a WordPress user, it’s even easier. Plugins like Smush Image Compressor and EWWW Image Optimizer work seamlessly and even allow you to bulk optimize your images from the Media Library.
But optimization alone doesn’t completely help it. Imagine an image that is 300px wide being rendered on your website in an area that is just 100px wide. All of the extra pixels are basically useless in this scenario.
The way out? Scale the images!
Ensure that all the images you have on your page are precisely of the size at which they’re being rendered to notice a massive improvement in the loading time.
#6: Minimize RTTs
RTT, or Round Trip Time, refers to all the requests that are required to access your website. Here we are not talking about the size of the requests as much as about the number of them.
Every single asset that requires loading – media files, script files, stylesheets – is requested individually by the browser. So, in essence, your browser sends a request to the server for EVERY ONE of your assets. That’s why one obvious strategy for speeding up your website will be to reduce the number of round trips needed to load all the assets.
Google has a handy manual to help you minimize the redirect. Here’s a quick summary of that:
(a) Combine all your script files into one to reduce the number of round trips. Check out Google Closure Compiler if you’re technically inclined.
(b) Combine images with CSS sprites. The number of round trips increases with the number of images on your page. Ideally, all the tiny background images should be merged into one, and then displayed using the magic of CSS. Compass and Spritepad are two tools to help you create CSS sprites.
(c) Instead of @import(ing) the assets, try using a <link> tag for each stylesheet. This allows the browser to download the stylesheets in parallel while loading the webpage, thereby reducing the load time.
(d) Reduce the number of DNS lookups by avoiding multiple domain names while loading a site.
(e) Minimize redirects, and always use HTTP redirects instead of javascript.
The above-discussed points are valid for sites working on the HTTP protocol. In case you’ve already jumped to the HTTP/2 or plan on doing it, it is actually recommended to have multiple smaller script files and stylesheets instead of one large file.
The reason for this is the HTTP/2 protocol serves all the files coming from one server over a single TCP connection.
#7: Compress your website with gzip
Like we mentioned earlier, the browser calls the server as soon as a user hits your website. This is done to deliver all the requested files.
The bigger these files, the longer it’ll take to get delivered, and therefore appear on your user’s screens. Gzip compresses your website in terms of stylesheets and scripts BEFORE sending them to the server.
Doing so, it drastically reduces the transfer time, obviously, since the files are much smaller. Gzipping generally reduces the response size by about 70%, which is huge, in terms of speeding up your website.
If you’re a WordPress user, you can use one of the many plugins to achieve the Gzip compression. Otherwise, you might need to set it up manually at the server level. Here’s one of the many manuals on how to go about this.
#8: Add an Expires header
While browsers use caching in order to ensure a faster page load time, a web server uses Expires header.
Using the Expires header in the HTTP response, the server informs the browser regarding how long a particular asset can be cached.
The whole idea behind Expires header is not only to reduce the load of requests from the server but also to reduce the number of HTTP requests altogether.
When your client visits your website, their browser communicates with the server to fetch all the requested files. Then, it arranges those files to display the exact web page. As the pages become richer in content and assets, the number of files being transferred increases.
The days of having a few images on the web page are long gone. Today, websites have more than 50 files per page to transfer. The files can themselves be huge, and add to that the fact that each of the files require a separate request. A time taking task, we’d say.
Expires headers save the day!
For static components, it is recommended to implement “Never Expire” policy by setting far future Expires header. On the other hand, for dynamic components, use an appropriate Cache-Control header to help the browser load the page faster.
#9: Switch off all the plugins you don’t need or use
This essentially goes out to you if you’re on WordPress. Many a time, you install a plugin and figure out you don’t really need it – or find a better alternative for it. What do you do then?
If your answer is not “uninstall and delete them”, you’re wasting your user’s valuable time.
These plugins require a number of CSS and JS files, which are loaded during page load if the plugin isn’t uninstalled. All of this increases your page load time for obvious reasons.
It is therefore recommended to conduct a full-fledged plugin audit and do away with the plugins you don’t need / use.
In conclusion
Getting your web page to load in the timeframe suggested by Google is indeed challenging, but the rewards are huge, too.
Something as basic as a fast loading website goes a long way towards improving your user experience, and ensuring more people visit you. It’s also important to remember that while all of the tips discussed above can help you overhaul your website’s speed, you don’t need to go all guns blazing.
Take your time, analyze your website properly, look at the speed test results, and find out the issues that are greatly impacting your load time. Work on those items to ensure a rapid decrease in your website’s loading time.
From there, move to the other items that might not harm you adversely, but harm you nonetheless. Most of the fixes discussed above can be easily done by anyone having a basic understanding of things. For others, though, you might need someone with a technical bent.
Although some of the fixes may seem extremely minuscule to you, you should remember that every small step you take can make a huge difference, considering the negative impact of even a one-second delay.
Follow the list we discussed to see yourself rank higher in Google, and close more leads. If you have any doubts or concerns, do drop us a comment below. And if all of this felt alien to you, just reach out to us – we know what is best for you.
