10 Tips To Make WordPress Website Faster

August 14th, 2017

WordPress is one of the favorite CMS used by many developers and website owners globally. It is it’s ease of use and a huge community of developers which makes it successful.

There are many plugins available from forms to payments, which makes jobs easier for people handling the sites.
WordPress is also notorious for slow website loading speeds, many plugins are used which makes it quite slow.

You know what boosts the traffic and revenue for your WordPress website? Apart from good SEO and Design, it depends on how the website functions. The easy it is to work with your website, more people are interested to use it. And one of the major components of a good website is the loading speed.

If you are working with a WordPress website, chances are that it would be slow loading. We have put the best and self-examined tips that’ll instantly boost the speed and traffic to your sites.

1. Optimize the images on the website

High-resolution images might be important to showcase your business but they are one of the major reasons that slow down a website. In many cases images are the only reason your website doesn’t respond fast. The bigger is the page size, higher is the bandwidth to load.

What Should Be Done?

Compress the images to reduce their size. Compressed images instantly increase the performance of the website without compromising on the quality. Plugins like WP Smush reduce the size of your image and strips the metadata acquiring the space on the website. You can compress images with tools like Compressor or TinyPNG.

2. Shift To A Dedicated Server or a VPS

A dedicated server is all you need for a website that receives enormous traffic. Since the server resources aren’t shared the website loads faster. However, a shared server is always the first choice (due to the affordability) sharing a server can lead to clogging of CPU and RAM.
To save up on the loading time and maximize the uptime of the site, invest in a hosting plan that offers all the resources of a single server.

Dedicated_Server_VPS_Hosting_-_Media_Temple

3. Custom coding the plugins

Plugins add features and functionality to a WordPress website. But the lesser known fact is that they increase the website load time by making database calls on the backend or by loading assets like CSS, JavaScript or images on the front-end.

Since there are a number of requests sent to the server, the site’s loading time automatically increases.

What should be done?

Multiple requests always lead to the reduction of the site’s performance. So, it is important to custom code plugins that improve the user experience. If you really need to use plugins, make sure to use well-coded plugins with good reviews.

We at ILLUMINZ build some great WordPress plugins and websites. Contact us if you have an idea to build one for you.

Sublime editor

4. Using Async JavaScript

When JavaScript is loaded via wp_enqueue_script function, an Async JavaScript adds a defer or async attribute.

There are 3 ways to execute an external JavaScript:

1.  When there is an Async attribute, the script is executed asynchronously with the complete page. This means that while the page is in the parse, the script is also being executed.

2.  If the defer attribute is present, the script is only executed once the page is finished parsing.

3.  When neither Defer nor Async are present, the script is executed before the browser has completed parsing the page.

Also, putting your CSS files on the top will instantly decrease the loading time of the website and make the content appear faster. You can put scripts at the bottom or use the ‘Defer’ attribute to upsurge the performance of the website.

5. Avoid Inline Scripting

When you directly integrate your CSS and JavaScript code in html, the code is said to be inline. This results in spreading the presentation and interaction code all over the web page. Other than being a messy code, inline code is hard to overview.

The code looks like this:

<div style=”width: 800px; margin: 1em auto; font: bold 1em/1.2 Verdana, Arial, Helvetica, sans-serif”>
<div style=”float: left; width: 400px; padding: 1em 2em; font-size: 0.9em”>
<span id=”get-shit” onclick=”callSomeFunction()”>News</span>
</div>
</div>

Not a pretty picture. Right?

Here’s how inline code increases the website load time:

HTML file size

Your HTML code gets comparatively heavier with inline code. The HTML file size is increased which in-turn increases the load time of the website.

The lack of caching

Another issue with inline code is caching.

While CSS and JavaScript are automatically cached by the browser after the visitor’s first visit, HTML code will never be cached.

This means that the browser will reload the HTML code for every web page without retrieving interactions from the last visit.

What should be done?

Your HTML code should be completed separated from your CSS and JavaScript. However, you cannot cut ties completely, you can always avoid the idea of not using inline CSS or JavaScript in your HTML code.

Taking the above bad example code, let’s rewrite it properly:

<div id=”container”>
<div id=”navigation”>
<a id=”get-news” href=”news-proper-URL”>News</a>
</div>
</div>
/*
CSS code, in separate file (base.css)
*/
#container {
width: 800px;
margin: 1em auto:
font: bold 1em/1.2 Verdana, Arial, Helvetica, sans-serif;
}

#navigation {
float: left;
width: 400px;
padding: 1em 2em;
font-size: 0.9em;
}
/*
JavaScript code, in separate file (base.js)
*/
window.onload = function () {
document.getElementById(“get-news”).onclick = function () {
// Get news through Async JS
};
}

6. Adding LazyLoad for your Images

The LazyLoad Plugin can be of great use as the visitors can only view images once they scroll down the page.

The images won’t be loaded until they don’t come to view.

Adding LazyLoad to your images will drastically decrease the loading time of any web page and save bandwidth for readers who won’t scroll till the end of the page. Since the page loads fast, it will be great for user experience too.

To do this automatically, install the jQuery Image Lazy Load plugin.

7. Trim the number of requests to the server

Your website speed directly depends on how your server responds to requests. More are the number of requests (including HTML + CSS + JS), higher will be the response time. To increase your server response, try to trim the number of requests or off-load the content on another server.

For videos, take the help of video sharing websites like YouTube, Google Video, Vimeo, Viddler and so on. The video on your website will then be hosted and played back on their giant servers.

You can also upload your video as a clickable image. Once the reader scrolls down and clicks the image, the video should be set to buffer.

8. Using Content Delivery Network

The loading time of your website can also vary with the location from which your user is accessing the website.

This means that users with different locations will experience different loading speeds of your website.

If the server you use is located in the US, people in the United States will experience faster loading time as compared to people in Asia.

With CDN, you can speed up the loading for your visitors all around the globe. The server will store all the static files (like images, CSS and JavaScript) in a single location.

Whenever you use CDN and the user visit your website the static files are uploaded from the closest server to their location.

This makes the work of your web hosting server easier and makes the website load faster. You can download CDN plugin from here.

Here’s how you can enable the CDN settings on WordPress:

9. Avoid Broken Links

Broken links affect the speed of your website. They drain the bandwidth and bring down the performance of the website with the user experience.

What should be done?

It is important to identify and fix all broken links on the website. The 3 recommended tools are:

10. Use a caching plugin

Last but also very important, caching plugins are important. Your page will load fast if your website is cached in the browser. By far, W3 Total Cache is the best caching plugin available. It is free and easy to install.

WordPress is a great system and is built with a lot of thought. If you are someone who works on WordPress, it is important to use all the possible ways to enhance its speed and performance.

At ILLUMINZ, we absolutely swear by these methods. This is the reason our WordPress websites load fast and these methods have worked for us fantastically.

Search Articles

Categories

Get Insightful Articles Delivered To Your Mailbox

Tags

  • Shobhit Chaudhary

    Wow, such a nice article. Will follow in future…

  • John Smith

    This article really great, for sure this will help people to make wordpress websites faster.