There are many reasons why you want to make your website load faster. This blog explains in the simplest way possible, how to acheive that.
This article is regularly updated with the with the best free and paid tools to achieve fast loading website with the least effort possible.
Why you want to make your website load faster
Better User Experience
No matter what the purpose of your website is, it must be designed with the user experience paramount in mind. Without an outstanding user experience, all other efforts might be for nothing. One of the most important aspects of a good user experience is a fast loading website.
You’ll Rank higher in Google
A fast loading website will not only improve the user experience, it will also improve your google ranking as well. Higher rank in Google means that the website is highly relevant in terms of providing the information a visitor is seeking. Google is using around 200 different factors in order to determine the ranking of different websites but website speed is considered one of the important factors.
The speed with which your website loads plays an important role in terms of conversion rates. Decreased page load time results in increased conversions (whatever you want that conversion to be: lead capture, purchase or other action). Every extra second a visitor must wait for a web page to load is an extra second they might decide to go somewhere else.
How to Make your Website Load Faster
What can you do to shave those precious milliseconds off your websites loading time? Here are some of the techniques used by web designers and developers (including us at Visualab Design) to decrease the loading time of your web pages.
According httparchive.org, 61% of a typical web page’s size is images. Images should be optimized using file formats such as PNG-8, JPEG or GIF. You should also try to match the size the image with the space it is taking up on the page. For example, you wouldn’t want to upload a huge 1920 X 800 pixel image if it will be displayed at a much lower size. If your images need to be rescaled that will slightly increase page load time.
There are several excellent image compression sources available, both free and paid depending on your needs, such as:
- Kraken.io – This one is my favorite. They have a free web interface and paid plans as well
- Compress JPG
Use a Caching Plugin
Popular caching plugins include:
Evaluate your Hosting Service
If you purchased a cheap hosting plan (I’m looking at you godaddy) this might be one of the biggest limiting factors to getting a fast loading website. On a typical shared hosting account, you might be sharing server space with hundreds of other websites. Several years ago I became dissatisfied with my current host and decided to make an in-depth evaluation of all my hosting options. After much research I finally settled on A2 Hosting. I have been extremely happy with all aspects of their service but especially the speed of their servers. Here’s a comparison chart to show how they match up to the competition.
Use a Content Delivery Network (CDN)
Popular CDNs include:
Using Sprite Sheets
For each images on your page, you are forcing multiple roundtrips of the server to get all the resources secured, which significantly slows down page speed. Sprite sheets are used to combine many images into one. The proper image segment can be displayed with CSS with the background-image and background-position properties.
Use GZIP compression
Using the GZIP compression algorithm, you can compress resources to lower the number of bytes a page is sending over a network by up to 80%. Here is an article that describes the top 3 Ways of enabling GZIP Compression.
Using performance testing tools
Performance testing tools such as those listed below will test all aspects of a websites page speed optimization and give you actionable insights for improving the loading time of your web page.
Looking at the picture above we can see that overall the page speed of this website is very well optimized. However, there is one major area where can have significant improvement: Remove query strings from static resources. Clicking on the arrow to the right of it will reveal the details about this specific issue and how you can improve it.
- Pingdom – these first two are websites to test page speed optimization
- Yslow – is a browser plugin to test page speed optimization
If you made it to the end of this article, you should now have all the knowledge and tools you need to significantly speed up the loading time of your website. If this seems overly complicated, you can always get in touch with us. One of our highly skilled and experienced design technicians will call or email you to discuss how we can help you make your website load faster.