Why focus on WordPress Speed Optimization?

How long did you wait for this page to load?
Lemme guess your reaction for each.
If the page loaded in
2seconds – You probably didn’t notice it loading.
4seconds – You noticed it loading.
7seconds – You gotta be kidding me?
10seconds – Bye!

So, what I’m trying to tell you is that we all are impatient and we are not ready to waste our time waiting for a page to load. Mainly, the initial impression is not only created by the landing page but also by the load time of your site.

So, it is essential to work on your load time to hold your existing users and increase your returning users.

WordPress Speed Optimization

You wanna know how I reduced the load time of my website from 9 seconds to just 3.6 seconds?
Well, It’s actually very easy.
You just need to know what is eating up your load time and stop it from doing so.

You can do this by using online tools like Pingdom or GTmetrix. I prefer the Pingdom.

This tool will give you clear insights into your load time, page size, performance and also let you know, which content on your website is the fat ass.

But, it will be much easier to follow and optimize the key factors with my below guide.

1. Image Optimization

Will you believe me if I tell you, I was able to reduce my page size from 9mb to 2.8mb by just compressing the images and changing its screen resolution?

Are you kidding me?
No, I’m not!

Images and plugins affect the load time and the size of your WordPress site the most. So, effectively handling them can make things a lot easier for you.

Optimize Images using Photoshop or Illustrator or Format factory

• Photoshop

  If you are using Photoshop, then you can optimize your images very effectively by reducing the quality of the image to an unnoticeable level.
  Just export the file from Photoshop through Save for Web by choosing the JPEG format at Medium or Low quality. Click here to know how it’s done.

  ---

• Illustrator

  If you are using Illustrator, then you can export the vector image through Save for Web or through the normal Export with a screen resolution of 72ppi.

  ---

• Format Factory
  

  If you wanna keep the process simple or if you don’t have your hands on those software’s, then you can use this free software. Download it here.
  • Just drag and drop the image.
  • Choose the output format.
  • Then, Go to settings.
  • Choose your custom width and height.
  • Press start & It’s done.

2. Heavy Plugins

Plugins are the add-ons that give your WordPress site the ability to perform and present things way better but they eat up a lot of your load time. So, it is very essential to know how different plugins are affecting your load time & how you can counter them.

You can use the P3 – Plugin Performance Profiler to know which plugin is taking up the time to load and you can go ahead disabling it or tweak it to have a lesser effect on the load time.

It is recommended to use less than 40 plugins.

3. Good Hosting is Unavoidable!

Hosting has a direct impact on the performance & load time of your website. Choosing a poor or cheap hosting service can make your website go offline many times a day. If you do have pretty good money plant then I would recommend going for managed WordPress hosting instead of shared.

I have hosted my website with MDDhosting. It’s probably the cheapest yet most reliable & secure hosting you could come across. They have an uptime of 99.99% & my website has never crashed or gone offline. They also have monthly payment plan – Get Hosted Now

4. WordPress Theme

When it comes to WordPress, we often choose the fancy and trendy themes that are new to the market, but such themes are packed with excess functionality that you would probably never use. These types of themes can affect your website in a long term. So, you should always choose a lightweight theme that is frequently updated & has a dedicated developer team.

It’s always good to test the WordPress theme before you buy it. You can try looking for a website that uses the theme you are planning to buy and test it on Pingdom or GTmetrix.

My favourite themes

• Avada | Responsive Multi-Purpose Theme – Theme Preview
• BeTheme – Responsive Multi-Purpose WordPress Theme – Theme Preview
• Enfold – Responsive Multi-Purpose Theme – Theme Preview
• Newspaper – Theme Preview

What does your site speed mean?

If your site loads in 5 seconds it is faster than approximately 25% of the web.
If your site loads in 2.9 seconds it is faster than approximately 50% of the web.
If your site loads in 1.7 seconds it is faster than approximately 75% of the web.
If your site loads in 0.8 seconds it is faster than approximately 94% of the web.

5. Disable Hotlinking

Hotlinking allows other sites to link directly to your images and use them on their own sites. This will get heavy on your server resources and slow your website down. So, it’s recommended to disable Hotlinking.

Copy and paste the following into your sites .htaccess file to disable Hotlinking.

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www\.)example.com/.*$ [NC] RewriteRule \.(gif|jpg|jpeg|bmp|zip|rar|mp3|flv|swf|xml|php|png|css|pdf)$ - [F]

6. Disable Pingbacks and Trackbacks

Pingbacks & Trackback notifies you whenever someone links back to your site but this gets heavy on your server resources and slows your website down. Disabling Pingbacks & Trackback will just block its notification function & will have no effect on the backlinking activity.

To disable Pingbacks & Trackback

Go to Dashboard > Settings > Discussion > Untick “Allow link notifications from other blogs (pingbacks and trackbacks)” > Save Changes.

7. Minimize HTTP Requests

In order to increase your page load speed, you need to optimize the number of HTTP requests made by your website or webpage. You can achieve this by optimizing the usage of interactive objects on your site such as Images, Charts, Gravatars, Emojis, Comments, Embeds, Scripts & Styles, Widgets & by using CSS sprites.

You can check HTTP Requests for Website or Web page here – HTTP Request checker.

8. Minify

Minify CSS & javascript to remove any unnecessary characters that are not required for the code to execute. This can speed up your site load time and improve performance. You can use online tools like JSCompress and CSS Minifier or use WordPress plugin such as Autoptimize.

9. Add Defer Parsing Javascript

Defer Parsing Javascript will ensure that the primary contents on your website loads first and contents like comments, sharing buttons, widgets, and image load later.

Copy and paste the following into your functions.php.

// Defer Javascripts
// Defer jQuery Parsing using the HTML5 defer property
if (!(is_admin() )) {
    function defer_parsing_of_js ( $url ) {
        if ( FALSE === strpos( $url, '.js' ) ) return $url;
        if ( strpos( $url, 'jquery.js' ) ) return $url;
        // return "$url' defer ";
        return "$url' defer onload='";
    }
    add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );
}

10. Use Content Delivery Network (CDN)

CDN is a network of servers located throughout the world. These servers are stored with your website content such as Images, CSS, Javascript & other contents that aren’t frequently changed. Whenever a user visits your website, the CDN retrieves the content from the closest server enabling a faster & better user experience.

I recommend you to try Cloudflare or BunnyCDN.

11. Enable GZip compression

GZip compresses your style sheets and web pages, making them smaller and faster to load. It brings down bandwidth usage and increases your site speed for better and faster user experience. You can make use this plugin to enable GZip conversion on your WordPress site – GZip Ninja Speed Compression

12. Add Expiry Headers

Expires Headers helps you to reduce the number of times a file is downloaded from a server and allow the browser to utilize the previous version of a file that is already saved on your computer. It also reduces the number of HTTP requests for the server when someone returns to your website.

Copy and paste the following into your sites .htaccess file.

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"
</IfModule>
## EXPIRES CACHING ##

Conclusion

Hope these tips helped you in increasing the performance of your website. This post will be updated based on new developments & with new optimization techniques. So, stay tuned.
If you have any suggestions, advice or request, then please do convey it through comments.

Have a nice day 🙂

Sanju Joseph

He’s a 23yr old pursuing a career in Digital Marketing, WordPress Development, and Graphic Designing. Trying to create a mark for himself in a Dynamic World. Frustrated by blood-sucking guru’s & specialists, he’s on a quest to educate beginners by creating small communities. He likes to spend his free time creating a purpose to make things more productive, playing games, reading articles & stuff that you wouldn’t care to know.