Website Speed: Ultimate how to guide

Website speed optimization tips, a case study of aceclue.com

How to increase website speedWebsite speed is a measure of how fast each page of your website loads when the elements of the pages are requested from the server.

Web page loading speed, aside from being an essential for users’ usability and engagement, it plays crucial part on website SEO and hence the position on the SERPs.

Website speed is a function of the web page load time which is the average time it takes the web page to fully render its element to the users.

And since the home page of a site is often the first point of call by most users, the loading time of the front page is used to determine and check the site speed.

Importance of fast loading website

Your website loading speed affects almost every metric that matters. It could therefore be inferred that fast loading website translates to

  • High user engagement which increases average time spent by users on the site
  • High position in organic search results
  • High target traffic to your website
  • More page views per visitor and hence keep the website bounce rate low.
  • Improved conversion rate optimization
  • Light weight website poses little load on the server

For the past few years, website loading speed was integrated to the over 200 hundreds criteria used by Google to rank website in the SERPs. This makes web page loading time an integral part of SEO. The news to incorporate site loading speed in search ranking was announced by Matt Cutts head of Google web spam team in his blog post here.

As always said every second increase or decrease in site loading speed counts. In the real sense of the matter, every millisecond affects site performance and could determine visitor retention and engagement. According to research conducted by Kissmetrics on loading time

  • 73% of mobile users say that they’ve encountered a website that was too slow to load.
  • 51% of mobile internet users say they’ve encountered a website that crashed, froze, or received an error.
  • 38% of mobile internet users say they’ve encountered a website that wasn’t available.
  • 47% of consumers expect a web page to load in 2 seconds or less.
  • 40% of people abandon a website that takes more than 3 seconds to load.
  • A 1 second delay in page response can result in a 7% reduction in conversion.
  • If an e-commerce site is making $100,000 per day, a 1 second page delay could potentially cost you 2.5 million in lost sales every year.

The facts of these like on website speed are numerous to be mentioned in a single post. But let me emphasise this

Every hour of time you spend in optimising your site for speed, every dollar you spend is a great investment that yield return on recurring basis.

I didn’t just start spending the hours optimizing my blog, twisting and making effort to increase the loading speed. I checked my site info on alexa.com and to my surprise the site loading speed was over 11 seconds.

Whao, what a heck is this? I have to drill down analysing the cause of poor loading speed with website speed checker and performance testing. I carried out necessary website speed optimization. I used these two common tools below.

How to check website speed

Pingdom: This website speed test helps to analyse the load speed of your website and gives insight on how to optimize the webpage for fast loading by identifying which of the page elements load slowly, very slowly and those that are extremely slow in loading. The tool is particularly helpful to beginners as well as experts. Its result is based most on Google chrome web browser.

WebPageTest: This speed test tool is well-known for its potential to check website loading speed from various location across the world and testing for various browsers. Additional benefit of using this speed test tool is the ability to get an idea of the first (new) users’ experience and what is experienced by returning visitors. This helps you to know how effective your cache plugin is. More on this later.

This is my experience while using these tools before I start major site speed optimization

Pingdom

I got the result below before I started the speed optimization process. This isn’t surprising any more because the speed test result align with speed insight on the blog alexa site ranking info. You can see the speed is well above 11 seconds. My website speed is slower than 88% of all tested websites. Terrible indeed!

Pingdom website speed test result before I optimize for speed

After I finished the speed optimization, the screenshot below show the speed test result on the same Pingdom from the same locations i.e Dallas, Texas and USA.

high website speed after optimization Pingdom

 

All the optimization I carried cost me nothing other than the few hour I spent on the blog. I believe the blog is still light weight and doesn’t require monetary optimization procedures. I save 9.98 seconds without spending a dime cash. If I had gone far the extent of CDN and changing hosting, the site loading time must have been brought down to fraction of a second.

You might wonder how I made this speed adjustment within 2 hours. That is the purpose of this blog post. If you’re also experiencing high loading time, the tutorial get you covered.

I know many reasons stand behind low website loading speed. Those that might be peculiar and not related to my blog high loading time. I gave some clues that you can adopt to optimize your site. I’ll be glad to hear your view and questions through the comment.

How to Increase your website speed

Here are the step I took to reduce the site loading time. It is important you back up your site before any major modification to have something to fall back on in case of unforeseen error. I make manual back up of my blog using Dropbox. Then I proceed

Update the CMS (WordPress) and Plugin

The first thing I do in my journey to speed up my site is ensuring that my WordPress version is up to date. I check the theme for update and update all my plugins. At this point, I discovered some plugins aren’t even necessary. So I got rid of them. Go to your WordPress admin area, update all the components of your site for maximum optimization.

WebPageTest result

I used this tool after I update my CMS and all the plugins, there was a bit improvement from over 11 seconds loading time to less than 8 seconds as shown in the screenshot below.

aceclue website speed during optimization

The test was then carried out after I finished the optimization techniques I’m sharing here. The result is pictured below. You can compare this result with the site speed test result on Pingdom. Any correlation?

Both speed tests results are in agreement. Aren’t they?

Aceclue optimized speed test result

 

Optimising your site code CSS and JavaScript

Delete Unused plugin: I deleted all unused plugins that were already installed on my server. Check your plugin dashboard in your WordPress admin area, there might be some inactive plugins that reside freely on your server. Disable and delete them.

Clean up the database: I installed and ran WP optimize plugin to optimize the database and remove unnecessary files. WP Optimize helps you remove auto-draft post, spam comment, post revisions, items stored in the draft folder, unused Akismet and other comment metadata.

Dangerous ones such as “transient options”,  “remove trackbacks” and “remove pingbacks” are marked in red. I deactivate this plugin immediately I finished running the optimization process but let the installation remain on the server.

Google jQuery Library: I used WPbeginner tutorial on how to replace default WordPress jQuery script with Google library. Just copy and place the code below in your theme’s function.php file.

//Making jQuery Google API
function modify_jquery() {
    if (!is_admin()) {
        // comment out the next two lines to load the local copy of jQuery
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js', false, '1.8.1');
        wp_enqueue_script('jquery');
    }
}
add_action('init', 'modify_jquery');

This helps your site loads faster to a new visitor who has already visited a website that use jQuery from Google library. In which case the script is cached on their computers even though they haven’t visited your site for a while. And your site loads the script through Google CDN.

Make JavaScript asynchronous: I ran PageSpeed insight by Google and from there I discovered non of the above fold content is fully rendered without some render-blocking JavaScript. I was given the recommendation to asynchronously load the blocking resources. This means the loading of the scripts is delayed until the main page contents are loaded. This helps to improve user experience and to present your marketing content in a fraction of a second.

For WordPress users, this free plugin (Asynchronous JavaScript) is a good choice. If you desire to learn more about codes and overall site optimization, check this resources for developers.

Integrating CSS and JS file: I Combined CSS and JS files using this plugin. The higher the number of site http requests, the slower the site loads. One technique to reduce the number of http requests due to the usage of plugins is to combine the CSS and JavaScript.

Performance and cache plugin

Series of information are requested from your database each time your website is visited. This happens in respective of whether your website is updated on not. The images are requested. JavaScript and CSS aren’t left out. This request poses increase in the loading time of your website. That is where the cache plugin comes into place.

Caching plugin creates and delivers static version of your page to visitors without the need to call for the images, JavaScript, CSS and the likes. Cache plugin has effective effect on my website loading time. I installed W3 total cache and adjust the setting to improve the plugin performance.

Optimize image for speed. Avoid large size image

Images are critical to better performance of a website. They are attention gabbing elements of a website. Its usage plays a vital role in content optimization, reader engagement and retention potential. It should however be noted that large-sized, high-resolution images increase website load time as the load on the web server hikes with the image usage.

In an attempt to optimize the existing images on my website for speed, I installed WP-Smush.it. Smush.it is a common image optimization plugin that reduces your site images for up to 80% depending on the quality, size and the format of the image.

I installed smush.it. From the media option in the WordPress admin area, I ran buck smush.it to compress the existing images on my media library. It is important to get rid of the plugin after optimization to prevent unnecessary loading on your server.

And henceforth

  • Reduce the image size before uploading to you site. Lots of image optimization tools are available for this. You can use GIMP, Infraview and many other image editing application. You might consider this free online image resizer.
  • Use appropriate file format. The most common formats for saving images are ‘JPEG’, ‘GIF’ and ‘PNG’. While PNG and JPEG are well-known online image file format, GIF formats is commonly used for animated file.

Keep-alive: How did keep-alive increase website speed

Gtmetrix report on my website speed test indicated that keep-alive is disabled. Keep alive is an optimization process that speed up website fast. It is a form of communication between web host server and the web browser through which browser requests simultaneous access to files.

If the browser-web server communication takes place for each file transferred, the website speed load increases. Enabling keep-alive makes the access to be granted once thus allowing the web page to load fast. To enable keep-alive, add the following lines of code to .htaccess file of your website root directory.

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

Checking the keep-alive status

  • http://www.giftofspeed.com/check-keep-alive/index.php
  • GTmetrix.com

I enable Gzip compression

Gzip compression is a common method of website optimization to make the pages load at a faster rate. This is achieved by reducing the page size to reasonable degree up to 70% bringing the loading time to less than 80%.I experienced rapid increase in my website speed with the Gzip compression enabled. You can check your Gzip compression status with

http://www.gidnetwork.com/tools/gzip-test.php

Then, How did I enable this? The setting is found in W3total cache plugin. Under the browser setting, enable Gzip compression and that is all to skyrocket the speed of your Http response. Other way to enable Gzip is using Gzip http plugin or adding few lines to .htaccess file of your root domain.

For WordPress users, Gzip compression could be enabled from the WordPress admin area. Use the following link.

http://yourdomainname.com/wp-admin/options.php

And change ‘yourdomainname.com’ with your website domain name. Use CTRL + F to find Gzip compression from among the setting options, change the default value 0 to 1.

Final Result

PageSpeed Insight for aceclue.com

According to Google Pagespeed insight, the website speed and optimization go thus:

  • Site speed on mobile 73/100 with all 4/4 passed rules. The website performance on mobile has increased to 75/100
  • Site mobile experience 93/100 with 4/4 passed rule.
  • Site desktop speed optimization 84/100 with 4/4 passed rule. This performance has improved to 85/100.

 Average loading time

On Pingdom: 1.17 seconds, the website speed is higher than 87% of all the tested website. The website optimization level is at 92/100 performance grade. This isn’t bad even though I’m working for website loading time below 1 second Google recommendation.

On WebPageTest: Website speed of 2.047 seconds for the first visit and 0.394 second for returning visits. This is not a bad experience for users.

And I would add the following optimization tips that might be applicable to you when you want to increase the speed of your website.

Web host and website speed

The choice of web hosting companies will impact your website speed and your online business as a whole. Choosing a web hosting service could be tricky. This resource highlight the strategies to choose an efficient web hosting company for best performance of your website.

Hosting companies are not always the cause of low website loading speed. If you’ve implemented all the optimization tips with no substantial result, it is high time you watched your host closely. Efficient hosting providers ensure that your server response time is under 1 second.

This is much more important if you are on shared hosting plan. A lightly loaded server is a big deal. You shouldn’t choose a plan that could be overloaded by your host and/or with your site data storage and page request.

The issue become worst if your website experience persistent downtime and nothing is presented to the users. This could damage your reputation not only in the sight of visitors but also the search engine. Smooth running pages experience better deal from search engine and boost in the website traffic.

Well coded theme helps increase website speed

If you’re running a WordPress site or other CMS, your website speed is greatly influenced by the choice of theme. The same principle applies for your website design templates. Some theme developers maintain light weight code (well coded theme) in their theme design while others don’t pay close attention to this in the name of adding functionality.

There should be a balance between the theme optimization for speed, aesthetic and features. Theme and host are critical foundation to your website when it comes to speed. I started this blog with a free theme before I shifted to prose theme on the genesis framework.

If you decide to change and/or purchase a premium theme for website speed benefits, analyse the theme code speed optimization by carrying out speed test on the theme demo page. You can use Google page speed insight tool and Pingdom to analyse the effects of various features of the theme on the speed.

Pay close attention to plugins

A well maintained plugin database could drastically help you increase your website loading speed. That is why you need performance profile and speed impact assessment of the plugins you installed on your website database. Most of the WordPress sites out there load slowly because of poor plugin management. Before you install a plugin, make sure

  • The plugin usage is inevitable and there isn’t other feasible methods to accomplish the same functionality.
  • You assess the effect of the plugin on your website speed.

This plugin developed by Godaddy is very useful to monitor the load imposed by plugins on your server. The plugin provides performance report for your site. This helps you identify which plugin is slowing down your site. Some plugins are redundant. Their functions may be available in another plugin already installed. For instance, WordPress SEO by Yoast alone saves you from installing other plugins that could slow down your site.

Other plugins features could be achieved by adding few lines of codes to your .htaccess file or the function.php of your theme. Find other alternatives to plugins where possible to prevent more http request result from excessive CSS and JavaScript that significantly reduce website loading speed.

Optimize with CDN (Content Delivery Network)

If your brand is well-known and the site is accessed across the globe nearly from all locations, some users far from your website host server experience slow loading. This affects not only the website speed but also the ranking on SERPs from the regions. The CDN comes to aid of such heavy sites so that the users are served through the server close to them.

Avoid Excessive Social sharing button

Social sharing media plugins and social bookmarking integration are no doubt a good way to increase your website traffic and create brand awareness and visibility. The website speed shouldn’t be compromised as well. Choose the essential social sharing button that drive most traffic to your website. Unless where others are strongly attached to your website promotion techniques and niche, you can be well okay with Google plus, Twitter and Facebook.

Avoid excessive ads

There is always a point when you have to put some advertisers’ codes on your website. In an attempt to increase website revenue generated, you may be tempted to run too many ads on your pages. The ads are mostly javascript-based and have the potential to slow down your site.

The above code optimization strategies should minimize the slowing down effect of such ads though , try to reduce the number of ad codes on your page. Some advertising scripts are delivered through CDN on a nearby server. Quite a number of them do not. If you have issue from ads scripts and images, lazy load plugins may become imperative to bring your website speed to a reasonable level.

Conclusion

What are you waiting, start optimizing your WordPress website for loading speed, SEO. This makes your visitors happy and have great experience on your website. Search engine shall be glad to see your optimized site. Just follow these tips I used.

I hope you have great website speed experience. And if you find the post helpful, kindly share with your fans. Just click a social icon by the side.

Have you any clue on how to increase website speed? Your opinion, ideas and contributions are welcome, drop comment below.

About Lasisi Afees

Professional Blogger and Internet Marketer. He has deep passion for blogging and sharing ideas on making money online. Connect with him on Twitter,   Facebook  and Google Plus

Comments

  1. Omar Belkadi says:

    Hey there,
    Well written post! it is really great. Thank you for the efforts and energy that have been invested here.
    Regards

  2. One more useful test: media4x.com/test/

  3. There are several website owners who are facing the problem of slowing website. You have shared very detailed guide on how to improve their website speed for all of them. I liked your way how you presented in every thing step by step.

    Keep doing great job!

    Regards,
    Jyoti

  4. Hi Admin,

    Pingdom is awesome online tool which providing information bout your website per-formation like here you can get all information like uploading script and performance of script and loading speed.
    Here you can find which webpage section you need improvement, I also prefer this incredible tool.
    Your article is great and providing right resources which through we can decrease our website loading time.

    Regards
    Mohd Arif

  5. Ella Rich says:

    Google speed test is one of the best & trustworthy tool to check the speed of webpage, as it gives the detailed report of factors contributing to low speed & methods to fix it.

    I have found the point ” Optimize with CDN ” quite informative & new , I have added to my dairy of key points to remember dairy, thanks for sharing information, looking forward to read more such blogs from you.

  6. Aditya Nath Jha says:

    Thanks a lot for this comprehensive guide, you have covered so much in a single guide it’s really amazing! Regarding the point about advertisements I surely agree with that because I had ads earlier on my first page and then later when I removed them my load time improved by a huge factor and my CTR in search results also improved after that! 🙂

  7. techlazy says:

    Hi,

    Website loading speed impact your website conversion rate, if website have low loading speed then you can easily get good ranking into search engine and absolutely get more visitors as compared to high loading time.

    Regards
    Mohd Arif

  8. Google speed test is one of the best & trustworthy tool to check the speed of webpage, as it gives the detailed report of factors contributing to low speed & methods to fix it.

  9. domain name for sale says:

    This 356688.com domain name is for sale.

    If you would like, please email:

    sdzfd@hotmail.com

  10. Vikash Kumar says:

    Hi! I was facing an issue about low speed of my website. But now after following your guide it is now in good states. Thank you for your detailed guide.
    Regards
    ~Vikash

  11. Vectrum Graphics says:

    This is something every website owner must understand and not take for granted. Website speed is very important also because it identifies how quality your website is. If your website has high speed, a big possibility for the audience to stay and read about your blog. Thanks a lot for sharing.

  12. Hey great post. I can’t tell you how many times I leave someones website because it’s so slow. That’s a lot of readers gone for sure. Thanks. This post was great!

Drop a comment