How to Speed up Your Website

by and FirstSiteGuide team (Last updated: January 17, 2017)

Introduction

fisher

83 % of users expect sites to load in 3 seconds or less but the median load time of the top 500 ecommerce home pages is 10 seconds


Data shows how important website speed is in the US, with around 25 % of people saying they would abandon a webpage that takes more than four seconds to load


Page load time in seconds.

clock

About 47 % of all shoppers want your website to load in under two seconds.

pan

If a page takes more than three seconds to load, over 40 % of visitors will bounce.

Nothing is more frustrating than a slow website. Not only it is bad for end users, it’s also very bad for website owners. In the day and age we live in, having a website is a necessity not only for businesses, but also for anyone who wants to share useful information with the world. Whether they are photographers trying to showcase their work, artists trying to make their voice heard, stay-at-home moms providing DIY tutorials or teachers who want to share their knowledge, it's of crucial importance to have a website that’s effective. One of the key factors that make a website effective is speed.

Why Does Your Website’s Speed Matter?

Speed can make or break a website. It affects your traffic, page views, conversions, sales and your overall reputation. By making it faster, you can improve your business or your fan base and help it grow. Studies have shown:

Therefore, website speed plays a very important role in making your business successful. It should be one of your top priorities if you want to stand out from your competition. By speeding up your website, not only will you yield positive results in terms of page views and conversions, but you will also provide your visitors with a better user experience.

A great user experience is key for building a strong customer base and building a strong brand. If your website takes forever to load, then what’s the point of having an awesome website in terms of its other elements, when people aren’t even likely to stay and check it out? Therefore, by not making sure your website loads fast, you risk losing a lot of customers or followers and, thus, a lot of revenue.

Moreover, your website speed is very important for your SEO. If your website loads fast, your ranking in search engines will be higher. This is because Google prefers fast websites, and it rewards them by ranking them higher in search engine results. Apart from speed, the user experience is another factor in Google’s ranking algorithm. So, by boosting the speed of your website and improving your user experience, you will eventually improve your SEO ranking.

As a result, you’ll get higher traffic and attract more quality leads that you can convert into customers, ultimately increasing your sales and generating more revenue.

donkey

The performance poverty line (i.e. the plateau at which your website’s load time ceases to matter because you’ve hit close to rock bottom in terms of business metrics) for most sites is around 8 seconds

spring

Conversion rate increases 74% when page load time improves from eight to two seconds

How to Test Your Website’s Speed?

  • PageSpeed Insights is Google’s free tool for testing your website speed and it is very easy to use. All you need to do is enter the URL of your website and the tool will analyze its content and generate suggestions on how to make your website faster.
  • Pingdom is also a very useful tool that not only tests your website speed, but also reviews and grades your website’s performance. It also tracks your website’s performance history, so you can have insight into any potential changes regarding your website speed.
  • YSlow is a tool that tests your website speed and offers advice on how to improve it. It can also provide you with a Chrome extension for checking the speed of your website.

15 Ways to Speed Up Your Website

There are many ways to speed up your website, making it truly effective and successful. Following are several of the easiest and most effective ways to speed up your website and make your every effort pay off in the long run.

Upgrade Your Web Hosting Plan

In real terms, this means that if your site typically earns $100,000 a day

1 seconds

Many people opt for cheap hosting plans when they are first creating a website, so they choose shared hosting. Over time, they provide more content and their websites grow, ultimately slowing down. If that is your case, the best choice would be to upgrade your web hosting plan. Upgrading your web hosting plan is the simplest and easiest way to improve the speed of your website.

If you have shared hosting, you should either move to a VPS or dedicated option. Either way, you will notice a significant difference in your website speed. Making a decision between the two options depends on your own business needs, so make sure you explore both of the options carefully and thoroughly.

Here’s just a quick note on both of them. VPS (Virtual Private Servers) hosting is perhaps the best option to go for, since it uses multiple servers for content distribution (sometimes even hundreds of servers). It is also a scalable solution and appeals most to small and medium businesses, as well as bloggers.

On the other hand, with dedicated servers, you get full control, since you get dedicated resources. You don’t have to share RAM, CPU, bandwidth or anything else, since all of the resources are dedicated only to you. Also, the bandwidth limits are higher but, since you don’t have multiple computers, this hosting option is a lot less flexible. However, it is much more expensive than VPS hosting.

Enable Browser Caching

Microsoft speed specialist and computer scientist Harry Shum believes 0.25 seconds of difference in page load time — faster or slower – is the magic number dictating competitive advantages for online businesses.

Enabling caching can improve your website speed significantly and give visitors to your site a more rewarding user experience. Caching refers to the process of storing static files, such as HTML documents, media files, images, CSS and JavaScript files, for easier and faster access, so that the database does not have to retrieve each and every file every time there is a new request. The more requests are being made to your server, the more time it will take for your website to load.

When someone visits your website, the elements on the web page they are trying to access are automatically downloaded and stored on their hard drive in a cache (temporary storage). That way, the next time they visit your website, their browser will load the requested web page very quickly, without having to send an HTTP request to the server again.

hand

44 % of online shoppers say that slow online transactions make them anxious about the success of a transaction

However, caching works for repeat visitors only, since, obviously, first-time visitors don’t have a cached and stored version of your website. Nevertheless, enabling full caching for your website can reduce your page load time from 2.4 to 0.9 seconds. This is due to the fact that there may be 30 or more different components that need to be stored in the user’s cache the first time they visit your website, but only a few components need to be downloaded for subsequent visits.

Depending on the website platform you’re using, there are different ways to enable browser caching. For example, if you’re using WordPress, the easiest way to enable caching is to install a plugin. The best WordPress caching plugins are W3 Total Cache, which is the most popular performance plugin, and WP Super Cache, which is best for websites with high traffic and underpowered servers.

snail

51 % of online shoppers in the US say that site slowness is the top reason they’d abandon a purchase

If you are using Drupal as your CMS, you should use the Varnish Cache software for leveraging browser caching. If Joomla is your CMS, you can enable browser caching in your Joomla dashboard: go to System > Global configuration and click on the System tab. You’ll see the Cache label under the Cache settings label, where you click to open the drop-down menu and choose the option ON – Conservative Caching from the list. Click save and go to Extensions > Plugin Manager, where you can enable the System – Cache plugin.

garbage

18 % of shoppers will abandon their cart if pages are too slow. The total cost of abandoned shopping carts for online retailers has been estimated at more than $20 billion per year

You can also enable browser caching at the server level, that is, integrate caching into your server-side scripting, which is something your web developer can help you with.

Static resources that are stored in a cache should have a caching lifetime of at least one week. You can set that by adding Expires Headers and setting them to a minimum of one week and a maximum of one year. The best option is to set late expiry times for static resources that aren’t updated frequently and short expiry times for resources that are updated on a regular basis.

Expires Headers tell the browser whether a particular file needs to be requested from a server or from the browser’s cache. They also tell the browser how long it needs to store those files in the cache, so that they’re not downloaded again during subsequent visits.

poor truck

79 % of dissatisfied customers no longer revisit underperforming websites – except when you’re Google or Amazon.

Enable Gzip Compression

If you’ve ever compressed files on your computer as ZIP files, then you must know how much that method can reduce the size of files. Gzip compression works exactly the same, except with website pages. It’s the best and most effective compression method that can considerably minimize HTTP requests and reduce response time, sometimes by as much as 70 percent.

two mans

46 % of dissatisfied customers develop a lasting negative impression and 44 % share their shopping experiences with the rest of the world.

By enabling Gzip compression, your website’s files will automatically be compressed in a ZIP file. This will significantly reduce their size and boost the speed of your website. A lot of bandwidth will be saved and the page load time of your website will be improved. When someone visits your website, the compressed files will be unzipped automatically so the content can be accessed.

You can install Gzip compression on your website with the use of a proper compression plugin for your CMS, but you can also very easily do it manually. There are two ways to manually add Gzip compression to your website. The first one is to add the following code to your .htaccess file, if you want to compress text, JavaScript, HTML, CSS or XML:

100 milliseconds. That’s how long the Occipital lobe in our brain stores visual information as a Sensory memory

AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

If you want to compress certain file types by extension, add the following code to your .htaccess file:

<files *.html>
SetOutputFilter DEFLATE
</files>

The second way to manually add Gzip compression to your website is to add the following code to the top of your HTTP or PHP page:

<?php if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) ob_start("ob_gzhandler"); else ob_start();?>

Remove Unnecessary Plugins

100 milliseconds
give visitors the illusion of instantaneous website response

1 second of page load time does suffice in maintaining seamless flow of thought

At 10 seconds of delay, visitor attention is barely kept. The sensation of impatience, frustration and feeling of abandonment is usually strong enough to keep visitors from revisiting such slow websites again

Every plugin you add requires resources to be able to run. However, more resources lead to a slower website. If you have some plugins installed that you no longer use or find unnecessary, you should deactivate and delete them. Not only can too many plugins slow down your website, but they can also cause security issues and crashes.

You can easily identify which plugins are slowing down your website by selectively disabling them and then measuring server performance. If you‘re using WordPress as your CMS, for instance, you can install the P3 (Plugin Performance Profiler) plugin, which is the best and most useful diagnostic plugin available.

This plugin will show you exactly which plugins are affecting the performance of your website, so that you can decide whether they’re unnecessary and should be removed or confirm they’re providing you with actual benefits. If the latter happens to be your case, you can try and keep them only on the pages on your website where you think they are absolutely necessary. You may also want to find alternate plugins to replace them or even code the content of such plugins into the theme of your website.

By removing unnecessary plugins, you can considerably improve your page load time and speed up your website. However, you should know that when it comes to plugins, it’s not just a matter of the number of plugins. You can have 50 plugins and still have a faster website than someone who installed 10 plugins on their site. The number of plugins is important, but there’s something in their quality as well. For instance, social sharing plugins can greatly affect your page load time, so you may want to consider embedding social media buttons into the source code of your website theme.

Therefore, you should avoid plugins that load a lot of scripts and a lot of styles, perform many remote requests and overwhelm every page on your website by adding a lot of database queries. Of course, plugins contribute to the functionality of your website and there are quite a lot of them that can help you improve it. But you should definitely keep only those you find absolutely necessary.

Note: If you’re using Drupal or Joomla, for example, you have no plugins to deal with in the first place. So you can speed up your website by disabling modules or adding speed optimization extensions. The best advice for Drupal is to never run more than 50 modules. Only run those that are absolutely necessary for the functionality of your website.

As for Joomla, make sure you check out the following extensions, as each of them can boost your website speed: JQuery Easy , LLFJ, Javascript Async and Defer and ScriptsDown.

Minimize HTTP Requests

Real Life Examples

Amazon and Walmart both reported a 1% loss in revenue per 100ms of site load delay

Walmart increased conversions by 2% for every 1 second of load time improvement

When Mozilla increased page speed by 2.2 seconds, Firefox download figures rose by 15.4%, or 10 million per year!

Ecommerce giant Shopzilla saw 50 percent reduction in its operational budget by shrinking page load times from 7 seconds to 2 seconds

Websites can be slow because of too many HTTP requests. When someone visits your website, they request certain files. Their web browser requests those files from your server by using the HTTP protocol. These files include HTML files, CSS and JavaScript files. If you have a lot of them, there will be a lot of HTTP requests and your website will ultimately get slowed down.

This is why you should minimize HTTP requests. There are some excellent ways to do this.

  • Combine CSS, JS scripts and HTML files together.
  • Use CSS instead of images whenever possible.
  • Reduce the number of elements on every web page.
  • Install a caching plugin.
  • Reduce redirects, which create additional HTTP requests to your server and increase your page load time.

For instance, if your website is responsive, mobile users that visit your website will be redirected to the responsive version of it. You can take two actions to ensure those kinds of redirects don’t slow down your website. You can either set up an HTTP redirect to directly send mobile users to a device-specific URL without any additional redirects or set up a JavaScript redirect to identify a mobile-equivalent URL and redirect mobile users to it. However, the latter option can cause latency, because a web page needs to be downloaded first on the client side of redirection before JavaScript can be executed and redirection can take place.

Enable HTTP Keep-Alive

When your web server receives an HTTP request from your website visitor’s browser, that is, when a visitor requests a certain file, the browser asks the server for a permission to download the file. It does so for each and every file individually. This takes up a lot of bandwidth and memory, not to mention that it uses more processing power. Eventually, it causes a lot of load on your server and slows down your website.

You can make your website faster by enabling HTTP Keep-Alive, which will create a single open connection for multiple file requests to your server, thus greatly speeding up your website. Simply put, the server tells the browser it can download multiple files at the same time, without putting too much load on the server. When the number of connections to your server is limited, a lot of bandwidth will be saved.

You can enable HTTP Keep-Alive by copying and pasting the following code into your .htaccess file:

<IfModule mod_headers.c>
Header set Connection keep-alive
</IfModule>

Minify JavaScript and CSS Files

Here’s another amazing example of the role that page speed plays in site revenue. Intuit, a tax software company, conducted experiments to reduce the loading time of their website:

For every second removed from load times, Intuit gained conversion

load times

If you have a ton of JavaScript and CSS files on your website, there will be a lot of HTTP requests when your website visitors want to access certain files. Since their web browser will treat those files individually, those numerous HTTP requests will considerably slow down your website.

While minimizing (minifying) HTTP requests and enabling HTTP, Keep-Alive can greatly improve your website speed. You should consider minifying JavaScript and CSS files, since this can also significantly speed up your website. By putting all JavaScript files into one single JavaScript file, as well as putting all CSS files into one CSS file, you will reduce their number. This will reduce the number of HTTP requests and speed up your website.

There are many minifying tools you can try, but you may want to start with a free and very easy-to-use WillPeavy plugin that can help you quickly minify HTML, CSS and JavaScript files. BWP Minify (Better WordPress Minify) is also a great plugin that can help you combine and minify your JavaScript and CSS files, but it’s a plugin for WordPress only.

Optimize Your Images

Images take up a lot of bandwidth. When they’re not optimized, meaning they are large in size, they use a lot of server resources and take more time to load. When your images are not optimized, your website can be much slower.

Therefore, consider reducing the size of your images without negatively affecting their quality. You can accomplish this by using a plugin that can compress your images and ensure they don’t lose quality in the process.

If you use WordPress, try WP Smush, a plugin that will automatically compress your images the moment you upload them to your media library. On the other hand, if you use Drupal or Joomla as your CMS, check out Kraken, which is also a great tool for compressing images.

Furthermore, consider using CSS sprites, as they can also greatly speed up your website. A sprite is one file that contains all of your images. You can create sprites with the use of CSS, which can specify coordinates and hide everything in an image except the section you need. Therefore, all of your images will be put in one single place and your web pages will load much faster, since one big image can load faster than a lot of small images.

When you optimize your images, apart from their size, you need to focus on their format and the src attribute, which is the URL of the image. You should stick with the JPEG format, while PNG is also good, but not fully supported by older browsers.

mobile users

50 % of mobile users will abandon a page if it doesn’t load in 10 seconds, and three in five won’t return to that site

When it comes to the src attribute, you need to make sure the code is right. Avoid empty image src codes. Namely, the code for an image in HTML includes the following:

<img src=””>

When there is no source inside the quotation marks, the browser makes a request to the directory of the page or to the page itself, which can cause a lot of load on your servers and even corrupt your data. Therefore, make sure you always include the “src attribute” with a valid URL.

Change Your Website Theme

rich truck

Average response time for 14 industry-leading mobile retail sites was 4.73 seconds. Amazon led with a response time of 2.85 seconds

The theme of your website can also affect your website speed. No matter how good your server configuration is, if your website theme has a complex code, your website will load sluggishly. It’s not uncommon, especially in WordPress, to change nothing but your website’s theme, only to find there’s a big increase in page load time.

Therefore, consider changing your website theme and make performance one of the priorities when choosing a theme, instead of only looking at aesthetics. You can check the page speed of a particular theme’s demo with the help of one of the tools for testing website speed so you can see how quickly the theme runs.

Use a CDN

Patience of mobile web users

Most participants in the survey would wait 6-10 seconds before they abandon pages

30 %

30 %

16-20 seconds

20$

20 %

20 + seconds

16%

16 %

1-5 seconds

16%

16 %

11-15 seconds

15%

15 %

11-15 seconds

3%

3 %

of those surveyed said that they would wait less than one second for a page to load before abandonment.


A CDN (Content Delivery Network) is a network of multiple servers located around the world that deliver web content to end users according to their geographic location. A CDN can host the static files of your website in order to deliver them more efficiently and reduce bandwidth and your server load.

With a CDN, the requested web content will be delivered to end users much quicker, since a CDN will use a server closest to users to deliver the files they request. As a result, not only will there be no latency, but your website will also become much faster. This is due because your visitors will access your cache instead of requesting files directly from your server.

Therefore, by using a CDN, you’ll save a lot of bandwidth and significantly improve your page load time and website speed. You can store your CSS and JavaScript files on a CDN, as well as images, videos, PDFs and other types of uploaded content.

Using a CDN can be very expensive, but it comes with quite a lot of benefits, so it’s worth every dime, especially if you happen to use a lot of bandwidth. So, if you have a large website and a lot of visitors, a CDN is your way to go.

Reduce External Scripts

External scripts that you add to your website in the form of JavaScript codes make HTTP requests every time your web pages load. As you already know, this slows down your website. Those external scripts can be external commenting systems, pop-up boxes, external fonts, website analytics services, social media boxes, such as Facebook “like my page” box, and many more.

Although you should certainly not eliminate all your external scripts, you should reduce them, as that will help you speed up your website. You can use Pingdom, for instance, to check which external scripts are taking the longest to load and, if they happen to be unnecessary, you can eliminate them.

If you embed videos and other multimedia files from websites which happen to be slow, your website speed can be negatively affected. To improve your page load time, make sure you request external files only from fast and reliable websites. You may also want to consider limiting the number of external requests your website makes altogether.

Fix Broken Links

wifi

50 % of your 1 second page load time budget on mobile is taken up by network latency overhead.

Broken links in your content cannot slow down your website, but they can greatly affect user experience, so you should pay close attention to all of them. However, broken links in your CSS, JavaScript and image URLs can negatively affect your website speed. Scan your links on a regular basis and fix broken ones as soon as you notice them.

Broken links are most commonly found in image source files, which happens when the URL is wrong. These links can easily be overlooked, especially when the size of a certain image is defined as very small. When there’s a broken link in your image, that is, when a 404 error appears, that broken link creates a wasted response from an HTTP request, which makes your website slower. The browser attempts to download an image that’s not available, so your web page spends more time trying to download the image, slowing down your website.

telephone

99 % of response time problems are still caused by the UI being too slow

Broken links can also be found in the CSS link tags in the head of your HTML documents. Just as with image files, if your CSS file is not where you have linked to, an HTTP request will result in a useless response and it will return with a 404 code. It’s especially important to regularly check for broken links if you use a lot of external CSS files, since they can be moved and result in a 404 error.

If there’s a broken link in the JavaScript source URL, your website can also be slowed down as with image source files and CSS links. But the browser may also try to interpret JavaScript and cause not only increased download time, but also bad script interactions. When the browser attempts to load a 404 page instead of JavaScript, all the other downloads stop until the loading of a 404 page is complete. This is why you should always put your JavaScript at the bottom of your HTML documents (right before the closing </body> tag), which is especially important when there are broken links involved.

You can check for broken links with a simple Online Broken Link Checker and, if you are using WordPress, you can try the WordPress Broken Link Checker for free. For Drupal or Joomla, you can use the Link Checker module or the Link Checker extension.

speedometer

Implementing an automated front-end optimization solution alongside a CDN can make pages up to four times faster

However, sometimes broken links aren’t caught by broken link checkers, so the best way to check for them is to regularly look at your server logs. There are several tools you can use to scan for URLs that are getting 404 errors to see which pages are causing them and then take action to fix them immediately. Also, you can use the Screaming Frog SEO Log File Analyser to find broken links and fix them before they cause 404 errors.

Disable Hotlinking

If you don’t disable hotlinking, you allow people to use the content that’s hosted on your server for their own websites. By allowing them to practically use your servers and your content for their websites, you’ll get a lot of server load for no reason.

This is why you should disable hotlinking and prevent people from stealing your server resources. However, in order to do that, you need to add the necessary code to your server. There are some tools that can help you generate the right code, but your web hosting provider can also help you with this.

planets

79 % of the top 400 ecommerce sites in the EU and 75 % of the top 2,000 ecommerce sites in the US don’t use a recognized CDN

Hotlinking usually involves images and other multimedia files, which generally take up a lot of bandwidth. Therefore, if you run a website with few to no images, disabling hotlinking will actually not affect your website speed.

Speaking of hotlinking, you should not just disable it, but you should avoid it altogether. Instead of linking to images on someone’s website, load them on your own server. You may think that image links will save you a lot of bandwidth, but they can actually slow down your website if the website with the image you linked to is slow and unreliable. What’s more, they may experience downtime or crash, so always load every image on your own server before you link to them.

Use a Reliable CMS

Computer

Only 10 % of the waiting period is defined by the HTML response to browser requests, and the remaining 90 % of the delay is caused in rendering pages, parsing HTML, executing code scripts and retrieving embedded assets

A CMS (Content Management System) is critical to your website’s functionality and performance. The best and most reliable CMS you can use is definitely WordPress, but there are also other excellent CMSs, such as Drupal and Joomla. If you use any of these as your website platform, you’ll do right by your site’s performance.

However, if you use some other less popular CMS or even something that you built on your own, you risk having a website that is very slow. In order to avoid this, make sure you conduct thorough research and choose a CMS that’s reliable and best suits your needs.

What’s also vital when it comes to your CMS is to regularly check for latest updates. Make sure your website’s scripts are up-to-date, since new versions are constantly popping up with the goal of improving websites and making them faster. Therefore, upgrade your website’s scripts on a regular basis. But always make sure you have your backup files in place first.

archive

Image compression should be a thoughtful tradeoff between image size and quality. For JPGs, a compression of 60-70 percent produces a good balance. For retina screens, increase (JPGs) image size by 150-200 percent, compress by 30-40 percent and scale it down again as per required dimensions.

Optimize Your Database

Optimizing your database is yet another very effective way to speed up your website. This is something you should do on a regular basis, especially if you use WordPress or some other CMS that relies a lot on database usage.

When you use such a CMS or even some complex plugins, the data in your database increases and your website becomes slower. This is especially true for plugins that save user data, statistics and logs, as they can take up a lot of data storage. Before you know it, your database will become filled with trackbacks, pingbacks, post revisions, trash items and unapproved comments, which can make your website significantly slower.

Therefore, clean your database on a regular basis, but always make sure you back up your files first. Never do anything with your database before backing it up. There are many plugins that can help you optimize your database, so do your research and find proper ones for the CMS you use.

If you use WordPress, for instance, you can automate the cleaning of your database with very useful plugins, such as WP-Optimize, WP-DBManager and WP-Sweep. If you use Drupal, you can optimize your database by running the OptimizeDB module, which will allow you to easily optimize any database table you want by simply selecting them. As for Joomla, you can do exactly the same by adding the Optimize Your Tables extension.

Conclusion

Having a fast website has never been more important than it is today. People expect websites to be lightning fast and, if you fail to deliver on their expectations, you will risk losing a lot of website traffic and, ultimately, your loyal followers or your revenue. Therefore, make sure you provide your website visitors with a seamless experience by improving your website speed and standing out from the crowd.

There are certainly more ways for you to boost your website speed, but the aforementioned ones are the most essential and the most effective. They may seem like a minor issue when handled separately but, combined, you can be sure they make a huge difference and speed up your website significantly.