7 ways to improve page load times
No matter if you're a consumer or a business owner, when you use a search engine, you want to find the answer to your question and solutions to your problem as soon as possible.
A recent study has shown that even as little as a one second delay in the page load time of a website can result in up to 11% fewer page views, and a 7% loss in conversions. Around 40% of people actually abandon most webpages completely if they take more than three seconds to load. This implies a staggering loss of traffic for many websites when you consider that the average page load time is typically longer than five seconds.
On top of this, page load speed is just one of many factors that affect the SEO rankings of your website, a good ranking being required if you want more people to see your site.
Ultimately, the main factor governing page load speed is page size. Intuitively, a larger file size will take longer to load. So, with that in mind, we’ve put together 7 simple ways to decrease the page load time of your website, answering the common question; "how to make my web page page load faster?"
1. Optimise your images
Images and visuals are a great way to display information to your visitors, but they’re larger in space and size than plain text, increasing your page load time if not optimised correctly. There are a few good ways to ensure that the images you use on your page aren’t weighing your site down.
Firstly, you can optimise your images by ensuring that they're scaled appropriately. If the original image is 500x500 pixels, but you resize it with your CSS to display as 250x250 pixels, the browser still downloads the image in its original size and loads the CSS. This means that the browser is loading an image four times the size of what it needs to be.
Alternatively, if you were to resize the same 500x500 image with CSS to show as 50x50 pixels on your webpage, then the image you originally used would be one hundred times bigger than it needs to be!
Always ensure that you resize your images using appropriate software before you integrate them into your website. Software such as Resizing app and Adobe Photoshop are very popular choices and deliver high-quality graphics.
As well as resizing you site's images, another good way to improve page load performance is to use an appropriate file format. JPEGs are considered the best image format, especially for photographs, while PNGs are suitable for graphics. BMPs should be avoided at all costs as they're widely considered to be an obsolete image format by modern standards.
2. Compress your pages
If your site is full of large, high-quality images or videos, then the page file size is going to be large too. As we’ve established, a large file size equals a slow page load time. So, just as you might compress files into ZIP folders if you wanted to send them by email, you can compress your webpages into smaller file sizes without any degradation to the quality of your images or videos.
Adding gzip compression can be done a variety of ways depending on your web server and scripting language by going to your server's settings.
3. Reduce your HTTP requests
If you’ve designed your website to include a lot of images, Flash scripts, and fancy transitions, then the browser that loads your page has to make requests for each of these components. Like with the previous two points, this once again means a slow page load time. So, where possible, it’s best to avoid superfluous features that would affect average page load time.
To do this, make use of your CSS in place of background images, check how social integration affects your load times, and if possible, consider removing any nonessential JavaScript. When a browser tries to load non-asynchronous JavaScript, it prioritises it, and won’t try to load anything else whilst it’s doing so. This dramatically affects your page load time. Non-asynchronous JavaScript should be avoided altogether.
4. Keep your JavaScript below the fold
If you really want JavaScript files in your page, putting them below the fold allows the rest of the page to load before the browser starts to load the JavaScript. Below the fold simply refers to the portion of the page a user will have to scroll to in order to see its contents.
For the best page load time, keep your image files and simple code above the fold, so that they load first and stick the JavaScript somewhere near the bottom of your page code. This lets the browser concentrate on loading the easy stuff first.
In other cases, you can make use of async or defer attributes in your JavaScript which, respectively, let the rest of the page load in tandem with the JavaScript but only loads the script after the rest of the content has loaded.
5. Tighten up your code
When building your site in whichever language you prefer, you may end up with bits of code that are unnecessary. They’re not doing any harm to what your page looks like, but they’re also not doing any good, and when you consider that every line of code, every tag, and every script adds to the file size of your page, making sure that you’re only including the code that you absolutely need is vital to decreasing page load time.
Whether you prefer to use spaces or tabs to indent your code, you probably don’t need to use any at all. It makes the code look nice, but the webpage still looks the same, and little tweaks like these can be the difference between a three second page load time and a two second page load time. Which, as we stated right at the beginning of this article, could cost you as much as a 7% conversion rate.
There are many resources available online that will analyse your code for superfluous scripts or spaces, such as Fortify SCA adnd Apify, and using one of these will ultimately reduce the average page load time of your website.
6. Reduce page load speed with location
It may only be fractional, but page load speed can be improved by hosting your website and storing your data in the same country as your users. If you expect your customers to be UK-based, hosting your site on a web server in the UK means that the request has to ‘travel’ a shorter distance than if it was hosted in another country, which results in a faster page load speed. Cluster Web Hosting from Fasthosts offers UK data centres with 100% fault tolerant architecture for the best performance possible.
7. Enable browser caching
If you expect a lot of repeat visitors to your site, enabling browser caching allows the pages to be loaded without the browser having to individually download all of the files again. Instead, on the first visit to your site, the files are temporarily stored locally on the user’s computer. The next time they visit your page, the browser can just load the various files from the computer without having to request them from the server.
How to test page load speed
The best way to check if all your changes have made a difference to your page load speed is to conduct a page load test. This can be carried out with tools like Google Page Speed or GT Metrics, as both let you test page load speed and then provide feedback on the results.
GT Metrics is particularly useful as it provides a chart that displays where all your page's bottlenecks are located. With results in hand, you can quickly make the changes you need before running a second page load test to see how your results improve.
These are just some of the ways that you can begin optimising the page load time of your website. Remember, even if optimising only results in a seemingly insignificant one second improvement, that one second could be the difference between a customer continuing to your site or bouncing back to the search engine.
At Fasthosts, we offer a selection of expert cloud storage and dedicated server options on top of our web hosting services to help you get the most out of your webpages. Get in touch with one of our experts to find out more about how we can help your business.
If you want more tips, tricks, and advice on how to improve your website experience, you can read all the comprehensive guides and articles found on the Fasthosts blog.