Why do I need to speed up my website?

The speed of your website can have a large impact on traffic, conversions, and revenue.  As a performance metric, speed should not be underestimated.  According to Akami, nearly half of all Internet users expect a web page to load in under two seconds, and 40% of users will click out of a website if it takes over three seconds to load.

In “Why Web Performance Matters: Is Your Site Driving Customers Away?”, a 2010 study by Gomez that surveyed 1,500 online shoppers about how website performance affects their online behavior, we learn the following:

  • “An increase in website loading time from 2 to 10 seconds increased page abandonment rate by 38%.”
  • “During peak traffic periods, more than 75% of consumers left for a competitor’s website instead of suffering a delay.”

To further emphasize the impact that website speed has on consumer behavior, the study by Aberdeen Group reveals that a mere one second delay in loading time yields a 7% decrease in website conversions.  Additionally, page views decrease by 11%, and customer satisfaction falls by 16%.  As if this wasn’t enough to hit home and have us racing to optimize our website loading time, owners should also be aware that Google uses website speed as a factor in ranking your site on its search results page.

In summary, a slow website will result in the following:

  • Less traffic and page views
  • Decreased conversions
  • Drops in sales
  • A negatively impacted brand image

As a leading resource on how to create a successful website, HostingFacts.com presents the following tips and tricks on how to boost your website speed.  In this guide, we will touch on the following points:

  1. Eliminate Unnecessary Plugins and Add-ons
  2. Reduce, or Eliminate, the Amount of Social Sharing Buttons on Your Website
  3. Configure All Analytics Tracking Codes and Ad Networks Codes to Load Asynchronously
  4. Use ‘Expires Headers
  5. Enabling Cache
  6. Utilize a Content Delivery Network (CDN)
  7. Dump Your Web Host for a Better One
  8. Switch the Theme of Your Website
  9. Make Use of Google PageSpeed
  10. Use Smaller Image Files
  11. Compress Your Website Files Using Gzip
  12. Clean Your Database on a Regular Basis
  13. Reduce the Number of JavaScript and CSS Files on Your Website
  14. Combining Your Background Images into Image Sprites
  15. Use a Single Open Connection to Make Server Requests
  16. Scan for Broken Links in Your JavaScript, CSS, and Image URLs
  17. Host All Images on Your Own Website
  18. Host as Many Files on Your Own Server as Possible
  19. Check the Quality of Your CMS
  20. Pay Attention to Whether Your PHP Files are Slowing Down Your Website
  21. Disable External Hotlinking of Your Own Images

Step 1:  Eliminate Unnecessary Plugins and Add-ons

Consider the case study by Mike, in which he analyzed his website speed and optimized it so that it went from a 4.23 second loading time to just a 1.33 second loading time.  Why was his website so slow?  One word.  Plugins.

Unnecessary plugins and add-ons can dramatically affect your website speed.  In Mike’s case, he found that an astounding 86% of his website loading time was due to plugins.  If you use utilizing CMSs like WordPress (users may want to install the P3, or Plugin Performance Profiler, which will scan your WordPress plugins to locate bottlenecks and generate a report of how each plugin affect your website performance), Drupal, or Joomla, it is critical that you pay attention to plugins and add-ons which could be slowing down your website.

In addressing this issue, it is crucial to not only focus on the number of plugins that you have installed, but also the quality of those plugins.  Pay attention to plugins that load excessive scripts and styles.  Also, eliminate plugins that perform lots of remote requests, as well as plugins that increase the number of database queries on each page of your website.

Bottom line: use plugins that are only absolutely necessary for enhancing the functionality of your website.  Discard the rest.

Step 2:  Reduce, or Eliminate, the Amount of Social Sharing Buttons on Your Website

Do not fall for the misconception that having a plethora of social sharing buttons on your website is always a good thing.  It isn’t.  There are few, if any studies, which prove any kind of significant increase in website traffic due to having social sharing buttons.  All it does is confuse your visitors.

Since most social sharing buttons run JavaScript, having too many buttons can create website performance issues.  When a social media site has an outage, there can be significant ramifications for websites with that button installed.

Rather than have an assortment of buttons, edit them down to the essentials, or else set them to load asynchronously so that outages do not negatively impact the speed of your website.

Step 3:  Configure All Analytics Tracking Codes and Ad Networks Codes to Load Asynchronously

Analytics tracking codes and ad networks’ codes can slow down your website.  Sometimes the remote servers are slow, or they go down, and the result is a long loading time for your website.  However, if you configure the codes for asynchronous delivery, you can ensure that a down or slow server won’t negatively impact the speed of your website.

Step 4: Use Expires Headers

As you know, the speed of the server is a key contributor to the speed of your website.  More server requests mean a slower website.  To address this issue, make use of Expires Headers.

Expires Headers decrease the load time for returning visitors by telling their browser when to request files from the server or when to load the file from the browser cache.  For example, you can configure the Expires Header only to request a certain file once every month, and until then, the file will be stored and loaded from the cache.

Your website will benefit from the use of Expires Headers in two ways.  First, it will reduce the number of HTTP requests on the server.  Second, since the same file is not being requested over and over again, the load on your server will be less.

To make use of Expires Headers on your website, follow this tutorial by GTmetrix.

Step 5:  Enable Website Caching

Caching greatly reduces the loading time of your site by storing a version of your website on the visitor’s browser and loading that version every time they return.  The cache is then stored and used until the website is updated or you set it to refresh.

According to research, utilizing a full cache for a website has a staggering impact on the loading time: from 2.4 seconds down to 0.9 seconds!

To enable caching, you must first determine which platform you are using.  You can install the plugins below if you are using WordPress:

One of the best advanced caching and performance optimization plugins out there on the market right now is WP Rocket.  It requires an investment, but the results are worth it.  If you are using Drupal as a platform, follow this guide on optimization techniques.

For further information on how to enable caching, follow these excellent tutorials:

Step 6:  Utilize a Content Delivery Network (CDN)

Websites that are hosted on U.S. servers will load faster for users in the U.S. (or visitors with a U.S. VPN service).  However, users from other parts of the globe will experience a slower website.  To solve this issue, make use of a Content Delivery Network, or CDN, which will redistribute your website files across a network of servers located in different parts of the world.  This will speed up your website considerably for users in other countries.

In a case study by Matthew Woodward, using a CDN was shown to increase the speed of a website by as much as 60%.

Below are two of the best CDN options available:

Step 7:  Dump Your Web Host for a Better One

It must be said that sometimes you just need to go with a better web host.  If you have been working hard to make your website faster and have exhausted all other possibilities, but are still experiencing a slow loading time, it may be time to change your web host.

Marcus Taylor, in Smashing Magazine, discussed how two of his clients, who both had similar websites, were utilizing different hosting providers and were experiencing drastic differences in website response times.  The client who was using a reliable, dedicated server to host his site experienced a 7 millisecond DNS response time, and the client who was using a cheap server was experiencing a 250 millisecond DNS response time.  Plugins and tweaks will only get you so far without a quality web host.

Due to the importance of choosing a good web host, it is recommended to read through hosting reviews to determine which web host will best serve your website’s needs.  You should also compare web hosts so you can make the most informed decision.

Here at HostingFacts.com, we have done our homework and have found the top three best hosting providers to yield a loading time of fewer than 500 milliseconds:

  1. A2 Hosting – approximately 300 milliseconds
  2. SiteGround – approximately 400 milliseconds
  3. HostGator Cloud – approximately 500 milliseconds

Using builders like Wix eliminates the need to find a quality web host, but for the rest of us, it is important to do our homework to find the best option.

Step 8:  Switch the Theme of Your Website

The theme of a website can greatly affect the speed of that site.  Code bloat, or overly long and poorly written code, will decrease the performance of your website.  For an example of just how much a difference the theme of a website can make on its speed, read Julian Fernandes’ case study, in which he was able to reduce his load time from 630ms to 172ms by merely switching his theme to a better written one.

Bottom line: don’t just focus on the look of a theme when choosing one for your website; consider how that theme will affect your website speed.

Step 9:  Make Use of Google PageSpeed

PageSpeed is an open source server module that improves your website speed by making changes and adjustments to the server and files according to best practices.

Installing PageSpeed yourself requires a bit of tech savviness, but it can be done.  On the other hand, you should always be able to ask your web host/developers to do the installation.

Step 10:  Use Smaller Image Files

Large images sizes (1mb or higher) result in the tying up of server resources and take more time to load.  Use the following tools to optimize image files on your website to make them smaller, while making sure that the quality of the image is not compromised:

Step 11:  Compress Your Website Files Using Gzip

Smaller sized files result in a faster loading time.  Similar to ordinary computer file compression, Gzip reduces the size of your website files by compressing them into zip files.

Smashing Magazine highlights the case of a website going from 68KB to 13KB by enabling Gzip.

Use this guide by GTmetrix to enable Gzip on your website.

Step 12:  Clean Your Database on a Regular Basis

Some CMSs like WordPress, and also plugins, store data on your database, which in turn slows down your website over time.  Features in WordPress, such as enabling post revisions, pingbacks, and trackbacks rely heavily on your database for storage.  Also, be wary of plugins that save statistical and user data and logs.

To remedy this, regularly clean your database using automated plugins like WP-Optimize (for WordPress).  If you have any other platform, use this resource to clean up your database manually.  These measures are often overlooked by website owners, but they can have a tremendous impact on boosting your website speed.

Step 13:  Reduce the Number of JavaScript and CSS Files on Your Website

A visitor’s browser might be treating all the JavaScript and CSS files on your website as individual files.  This, in turn, produces multiple requests, which slows down your website loading time.  You can reduce the number of these individual files, or minify them, by putting them in one place.

Step 14:  Eliminate Multiple Background Images

Having multiple background images results in multiple requests to your server to load the images.  More requests result in a slower loading time.  You can fix this by combining the background images into just one file.  Utilize image sprites to ensure that browsers only have to make one request to load the background image.

Many website templates are comprised of several different background images.  When you combine them into one, you achieve three things.  First, you minimize the number of requests made to your server.  You also reduce the number of bytes the browser must download.  Lastly, you reduce roundtrip delays caused when your server has to download from other places.

Make your website faster by using SpriteMe.  This Smashing Magazine article makes good suggestions as well.

Step 15:  Use a Single Open Connection to Make Server Requests

Typically, server file requests are completed on an individual basis.  A connection opens, the file is grabbed, the connection closes, and a new connection is opened for the next file grab.  This is inefficient, resulting in greater memory usage and a slower website loading time.

Use HTTP keep-alive to have all file requests made through one open connection.  The process is simple enough.  Just copy and paste the following code into the .htaccess file:

Header set Connection keep-alive

Depending on your server, you can also follow the steps here or here to enable keep-alive.

Step 16:  Scan for Broken Links in Your JavaScript, CSS, and Image URLs

If you have broken links in your JavaScript, CSS, or Image URLs, your website might be experiencing frustratingly slow loading times.  You should scan for these broken links and resolve them to give your visitors a better browsing experience.  While you are at it, look for all other broken links, which don’t necessarily impact the speed of your website, but do affect the user experience negatively nonetheless.

Step 17:  Host All Images on Your Own Website

Image hotlinking, or “inline linking” is when you avoid loading images on your own server by just linking to an image on another website.  Theoretically, this saves you bandwidth, but it can actually reduce the speed of your website, especially if that image hosting website is down or is itself slow loading.

A good rule of thumb is to host the images on your own website first before linking to them.

Step 18:  Host as Many Files on Your Own Server as Possible

It is nearly unavoidable that your website will rely on other websites for files, such as embedded videos and other multimedia.  However, if there are too many external requests or you are requesting from slow websites, your website speed will be negatively affected.

Limit this possibility by hosting as many files as possible on your own server.  Be sure to verify the reliability of websites that you do request from.

Step 19:  Check the Quality of Your CMS

As the framework of your entire website, a CMS can affect the speed of your website.  Reputable CMSs such as WordPress and Drupal as well as simple HTML are perfectly suited to optimize your website loading time.  Less reputable CMSs put your website at risk for slower loading times.  It is vital that you run tests and do your homework to make sure your CMS is best for optimizing your website speed.

Step 20:  Pay Attention to Whether Your PHP Files are Slowing Down Your Website

While PHP all but eliminates having to input the same information on your website over and over, it can also slow down your website.  You can do one of two things to remedy this: replace PHP files with static HTML files, or if you can’t do that, use a PHP accelerator.

PHP accelerators are useful for sites that have to rely heavily on PHP.  This Wikipedia article is helpful in listing a few good PHP accelerators that you can utilize.

Step 21:  Disable External Hotlinking of Your Own Images

When other websites hotlink to your own images, they are essentially ripping off your bandwidth.  Every time one of their visitors tries to view the images, a request is made to your server.  Disable hotlinking to prevent this from happening!

Follow the advice given in this article on Hongkiat to prevent hotlinking of your images.  Additionally, this tool allows you to generate a .htaccess file to prevent the hotlinking of your images.

Get Started Now by Testing the Speed of Your Website!

Now that you have followed the tips and tricks above to improve the speed and performance of your website take a moment to test your website speed to see the impact we have made.  Be sure to leave a comment below if we have helped you optimize and improve the quality of your website experience.

These are my favorite tools for assessing the speed of your website:

Pingdom Website Speed Test:  This tool allows you to focus on minimizing the loading time of your website and lowering the number of server requests that are made.  Additionally, it features a comparison tool that allows you to see how your website performs against other websites.

GTMetrix:  Here you are given a rating from A to F after analyses by Google Pagespeed Insights and Yslow.  Suggestions for optimization are provided.

Webpage Analyzer:  Use this tool to find out information of page size and download time.  Improvement suggestions are provided.

Google Pagespeed Insights:  Here you receive a score up to 100.  A cool feature is that this tool allows you to test mobile speed.

Yslow:  This tool to gauge website speed is run off of Yahoo!’s rules for website performance.

WebPage Test:  Here your website speed is evaluated on a scale that goes up to 100.