Who likes a slow loading website?

After all, we do not like to wait for long to find out information we are looking for.

In this post, I’m going to show you how to speed up WordPress website using 7 detailed and easy steps.

The best part is –

… all these steps are friendly for non-technical WordPress users (even if we may encounter some technical jargon, we’ll tackle it in a non-tech user-friendly manner)

It’s no secret that website speed matters for SEO.

In fact, one of the WordPress SEO tips I included in my previous post was to increase website speed.

Here are those 7 of my all-time favorite steps to implement for your WordPress website to make it load fast like lightning (step-by-step):

Table of Contents

Go through all these techniques step-by-step, apply them to your website and then you should have a really fast loading WordPress site which your users love.

Compress Images – (Using Smush Image Compression)

Generally, images make up a large portion of your website’s weight or size.

… around 54%

Even if your website is largely filled with text and only a few images, images will be responsible for increasing the size of your site – since the text does not take much time to load.

Hence, your website will improve a lot even if you only compress your images (i.e decrease image’s file size)

Use – Smush Image Compression !!

For any WordPress users, I always recommend them to use a plugin named smush image compression to compress the pictures for their blogs and sites.

WP Smush - Image Compression WordPress

Here’s what it does – Smush decreases the file size of your photos, without a noticeable difference in quality. In other words, it makes your images web ready.

Cool, right?

What’s even cooler is that you basically don’t need to do anything – it smushes your images immediately after the upload.

If you already have a lot of images uploaded- no worries.

You can bulk smush all the previously uploaded images – note that you can only bulk smush less than 50 images. In order to smush more than 50 at once, you need to buy the premium version.

Here’s how to start using the plugin. Go to the “Smush” on the left menu of the dashboard.

Smush Image Compression

Make sure to check β€œAutomatically smush my images on upload” on. So that whenever you upload a new image, it smushes (compresses the images) automatically.

WordPress SEO Tips - Smush Automatically

And – that’s it!

This step alone is going to save you a lot of space – and you won’t even realize it. Over time, as you add on images for your blogs, you’ll care a lot less about the website’s size. However, this plugin always does it’s work in the background.

Of course, smushing is not just the only way to compress the images.

There are millions of other ways which you can do outside of WordPress as well. Sometimes, you may opt to decrease file’s size manually. Check out this article to learn more about image compression for the web.

View comparison between image compression plugins.

Leverage Cache Plugin (Using W3 Total Cache)

Caching is an absolute must for any WordPress users. As a WordPress user, caching will help you make static HTML / CSS files from your PHP files.

… so that the browser should not fetch PHP (backend) every time.

Among the myriad of cache plugin to choose, W3 Total Cache is our best pick …

… W3 Total Cache is also the most popular one.

W3 Total Cache is all you need (not just for cache, but also for minifications) – more on that later πŸ‘‡

However, one has to confess that this plugin is not as beginner-friendly as most of the plugins out there. There are just too many options for a beginner and it’s so easy to get confused using this tool. I’ll try my best to explain everything for you as we move on using this plugin.

First, let’s tackle general settings only …

Although we should not know about every tiny settings that the plugin offers, there are few which you need to take care of. 

First step, Enable the page cache. 

For Page Cache method, choose Disk: Enhanced – which should be the default one.

(this is an important step)

Caption

(Page Caching is the most important setting)

Without going into much detail, I’d like to say that page cache is there to save a static version of your page and then respond that to browsers, without fetching backend (dynamic) code. This way browsers (like chrome) will take a short route to show your webpage.

Next, two of the important settings are – “Database Cache” and “Object Cache”.

πŸ‘‰ Disable the “Database Cache”

πŸ‘‰ Enable the “Object Cache”

In case, you notice that your WordPress dashboard is loading slowly after you apply these settings, you may opt to disable Object Cache.

Next up, enable the browser cache.

Browser Cache helps improve your website speed by caching static resources, in your visitor’s browsers – which prevents the need to reload static content.

Well, these are the most important general settings.

Rest of the settings – you may leave that to default.

(We’ll discuss minification settings in W3 Total Cache later in this post)

w# Total Cache is a huge plugin, with lots of options you don’t even need. If you’re looking for thorough guide on every setting, learn more on how to configure W3 Total cache here.

Looking for a professional SEO Company in Nepal? Make sure to check out Swopna Digital as well.

Lazy Load Your Website (Using BJ Lazy Load)

What’s ‘lazy loading’?

As the name suggests, it is about loading your web page lazily – which means that the upper part is loaded first and then lower parts are loaded later on (as you scroll down).

How lazy! πŸ˜ƒ

This way, even if your website’s fully loading time is 3.0 second, you should not wait 3.0 seconds to see the page.

As you scroll down, the more parts (images, videos or even text) will be loaded slowly (in a way that does not affect user experience).

Here’s the basic idea:

If you have included an image on your blog which is located on the lower sections of the page (let’s say after 1000 words), why should you load that image right away?

After all readers are only going to see that image after some time …

… that’s where lazy loading comes in.

Lazy loading makes your website load faster by downloading (initially) only the parts that are visible to the users, and other parts later on as it comes closer to the visible window.

BJ Lazy Load is the plugin I recommend for most WordPress users.

Although BJ lazy load works pretty well out of the box, there are few settings you need to take care of, in order to get most out of the plugin.

First, let’s go to Settings >> BJ Lazy Load.

This takes you to the settings page of the BJ Lazy Load Plugin, where we’ll find everything you need from the plugin.

Two of the most important settings for us (right now) are:

  • Lazy Loading Images
  • Placeholder Images 

In most of the cases, there’s no need to check the settings. However, make sure these 2 settings are configured properly. 

Lazy Load Images – Change to “Yes”. Since images make up most of the website’s real estate, lazy loading images is enough in most cases.

Placeholder Image URL – Leave it blank. 

It’s a better idea to change every of those options to “YES”.

In case, this affects the user experience of your website, then consider removing some of the lazy loads (except images). 

… or you may increase the threshold.

Threshold – determines how close should your images come to the viewport (visible area) before it’s loaded.

By default, it’s 200 px.

If you notice that your images are loading too slowly than it should be, then consider increasing this number. However, do not decrease it … 

Other plugin options for Lazy Loading (in WordPress) are Lazy Load XT and a3 Lazy Load. 

Check out this blog article to learn more on Lazy Loading:

“How to Implement WordPress Lazy Load on Images and Videos”

Minify CSS / Javascript

According to Google, here’s what minification means:

“Minification refers to the process of removing unnecessary or redundant data without affecting how the resource is processed by the browser”

Let’s make it simple:

Whenever you type a URL (like swopnadigital.com ) in the search box, your browser will connect to the server and get the source code to show your website. Sometimes, the source code contains unnecessary details like formatting, spaces, unused code etc. 

Even if we remove these, your website will still remain the same.

What this does is decrease your file’s size slightly and helps your browser serve your website faster.

in this process … 

… the browser will have less burden, and your website loads faster.

Before minification, a CSS code looks like:

/*
    Change sidebar layout and color
*/
#sidebar{
padding:15px;
color:#333;
background:#f3f3f3;
}

/*
   Change heading's font 
*/
h1 {
font-size:28px;
color:#333;
margin-top:15px;
}

After minification, it looks like:

#sidebar{padding:15px;color:#333;background:#f3f3f3;}
h1{font-size:28px;color:#333;margin-top:15px;}

Both of these codes generate the same result for a browser. Hence, minification of resources is an advantage over leaving it to as it is.

That being said, minification does not dramatically decrease the file’s size …

… it just saves you a few kilobytes.

However, later on when you check pagespeed score (through pagespeed insights), you’ll notice an increase in the score, which also gives you the satisfaction of having increased the score πŸ˜ƒ

Enough with the explanation, let me show you how to do this:

If you have W3 Total Cache installed, you don’t need any other plugins for minification.

(I guess you’ve already used W3 Total Cache for Caching purpose)

First, turn on minification in the general settings of W3 Total Cache:

For minify mode, check the “auto” option.

I recommend to minify all 3 resources – HTML, CSS, and JS – leave all the options to default.

Minification can sometimes be tricky – and it might break your code if done it wrong.

Just follow along and you should do fine.

Check out all the settings I show (using screenshots below) and try to match these settings – don’t change unless you know exactly what each of these mean.

HTML & XML:

CSS:

JavaScript:

Rest of the options – you may leave it to default. 

That’s it for minification using W3 Total Cache. Just a few hours of work, which will help you for a lifetime.

Cool, isn’t it?

Well, if you want to decrease your page load time on your own and don’t want to hire a specialist – then an hour of work (for minification and caching) is considerable – I guess πŸ‘Œ

Not using W3 Total Cache? 

Check out these other 2 plugins for minification – Fast Velocity Minify and Better WordPress Minify   

Are you an aspiring blogger? Learn how to start a wordpress blog the right way.

Check Pagespeed Insights for Recommendations

Google Pagespeed Insights is a tool which helps you analyze what resources are responsible for your page load time.

Just go to PageSpeed Insights.

And, enter the URL of your page you want to check.

After it analyzes your page, it generates the result and provides you with a score. If it’s green, you’re doing fine with your site speed.

Now, scroll down to the section where it says – “Optimization Suggestions”. 

This is where you should provide most of your focus.

Click on “show how to fix” to view more details on the suggestion. 

At this point, you’ll see which resources need optimization and what you can do about it.

For instance – one of the suggestions that PageSpeed Insights provide is to compress images – you can even see estimates on how many “kilobytes” you’ll save by compressing that image.

In this case, the tool shows me 16% reduction that is ~ 94 KB, which is more than enough to drag my attention. 

… compressing these 2 images will contribute a lot in the site speed.

Check out for other optimizations – and see how many kilobytes can it save for your website. If the number catch your attention, follow the suggestions. Some of these suggestions can get technical (contact your developer if you’re confused).

Here, it suggests me to compress the website with gzip. 

However, I may not know what gzip compression is. In that case, I do a quick search on Google to see what it is this all about.

Now, it’s time to do a little bit of research. 

After a few clicks here and there – and I found that W3 Total Cache has an option to enable gzip compression. After that, I’d search for “how to enable gzip compression”. 

This is how you apply the suggestions from PageSpeed Insights.

Remember to prioritize the suggestions that will save you a lot of space (resources)

Use GTMetrix To Find Out Resources Slowing Your Website

GTMetrix is one of my all-time favorite tools to analyze website speed.

While PageSpeed Insights only show the suggestions to improve the loading time, gtmetrix shows the exact resources that are slowing down the website, the exact page loading time, optimization suggestions and so on.

Enough talking …

Head over to GTMetrix. (https://gtmetrix.com)

Type the URL of the website you want to analyze.

Test Region is Vancouver, Canada. Location may slightly change the site speed (result)

Similar to PageSpeed Insights, it provides you with scores (from PageSpeed and YSlow). Recommendations in gtmetrix are separated as tabs. 3 essential tabs (that we need the most) are: PageSpeed, YSlow and Waterfall)

There’s not much to focus on PageSpeed (if you follower the previous step)

YSlow tab should be the prime attention for you at this time. This tab shows you few more suggestions than pagespeed, and is a bit more sophisticated. YSlow tab prioritizes the recommendations based on grade – on the basis of importance.

Red one – is the one that needs mot focus.

As always, if you’re confused, Google is always there to help.

Review all  the steps that YSlow tab shows you thoroughly. Sometimes, changing just 1 thing might bring a noticeable result.

But, the best part of gtmetrix is πŸ‘‰ “Waterfall” tab.

Here, you can see all the resources that browsers need to load to show up your website in front-end (or screen). Every entity that the server provides to the browser is a resource. And, more the entity – more the time it takes to load.

An SEO specialist’s job is to decrease the amount of resources …

GTMetrix show you all those resources (including the time it took to load)

Run a few tests first, and then note down what’s causing your site to load slower.

(bars on the right indicates the time)

You don’t need to go into tiny nitty-gritty details of the waterfall chart.

Just search for the images and some external scripts (and what time they are taking to load) 

If you find some plugin scripts that slows down your website …

… the plugin needs a second thought.

Only keep it if you absolutely have to.

In case, images are slowing down your website, it means whether you should serve scaled images or need to compress the images using external software like Photoshop.

Analyze every request (resource) you can through this amazing tool.

Also read: On Page SEO: 7 Techniques to Boost Your Website Rank in Google (fast!)

Minimize the Number of Plugins

Here’s the general truth:

More Plugins = More Code

More code means there’s a higher chance of your website slowing down. Sometimes, plugins increase the number of requests to the server, which then increase the response time.

All these will cause your website to load slower.

Hence, it’s a better idea to adopt minimalism.

Minimalism is not just important for design. It’s useful for most of the aspects of life. For WordPress, making it minimal will help you a lot when it comes to site speed.

Of course, it’s not always the case.

But the general rule is that only use plugins that are absolutely important for you.

Remove the deactivated plugins you have not used for quite some time – after some time, you’ll have the choice of reinstalling it.

Next thing is, you might have plugins that you have installed – which are there for no reasons.

For instance – Demo Importer, Attachment Page Remover, etc. 

These are the plugins you need only once – after these serve their purpose, it’s better to delete them – in order to keep your site minimal.

Minimalism has the other benefit:

… you’ll spend less time debugging in case anything goes wrong.

Hence, check for the other plugins – which you might not have needed, but still is there sucking up your resources. Plugins like “Mailchimp for WordPress”, “Google Analytics” is not necessary if you’ve integrated them through code (or used API). 

The question always remains – “How many plugins is too many for WordPress?”

The answer is – there’s no answer.

Check out for yourself – which plugin decreases your site speed in a noticeable amount. It’s more about the quality of code than the number of plugins. But as a digital marketer, you’ll never know how’s the code behind the plugins(unless you’re a developer).

For shared hosting, general idea is not to use more than 20 plugins.

In the long run, you’ll be better off using less number of plugins

Also read: How to Increase Organic CTR – 8 Quick and Easy Techniques

Conclusion

Well, these were 7 of the useful steps you can take to increase website speed in WordPress. 

I have not included steps like “Use Premium Host Server” or “Use CDN”. Although, as a WordPress site master, I know should upgrade the servers, but there’s nothing I can do about that right away. Hence, I have have only included the actionable tips to boost site speed. 

Now, I want to know from you πŸ‘‰

What are some of your favorite ways to increase site speed in WordPress? Is there any particular tool you use?

Or, any specific tactic to boost page loading time?

Let me and our readers know using the comment section below πŸ‘‡

Share with your friends !!




Latest Articles πŸ‘‡


Get Actionable “Digital Marketing & SEO” Tips

Subscribe to get weekly 'Digital Marketing and SEO' strategies and tactics delivered directly to your inbox πŸ‘‡

About Rajit Chaulagain

Rajit Chaulagain (Chief Executive Officer @ Swopna Digital) writes about SEO, Website Development, Animation, VR (Virtual Reality), AR (Augmented Reality), and many other exciting fields.

2 thoughts on “How To Speed Up WordPress Site? (in 7 Simple Steps)

    1. AUTHOR

Leave a Comment