You write great content but what if your website takes a decade to load?
Well, Visitors don’t have patience and It has been proved. More than a quarter of visitors will abandon your website if it takes more than 3 seconds to load. Your potential visitors even might hit the back button in the browser before they read your content. Hitting back button is a direct message to the search engine that the user did not get what he was expecting on a page and next time your content might rank lower.
Why Should You Improve the Speed Of Your Website?
There are so many good reasons why you should put effort into improving the speed of your website. Here are some worth mentioning –
- PageSpeed is a ranking factor – Google has already said that page speed will be one of the ranking factors for their search index and the search engine gives more value to pages that load fast.
- User Experience – Slow loading website gives a bad user experience. Users can navigate easily to different pages on a fast website which results in increased total page views and decreased bounce rate.
- Conversion rate – Don’t you want to see your visitors converting into your customers? A fast web page improves conversion rate. Amazon once announced that conversions dropped by 7% every time their website was loading late by 1 second.
- SEO – Fast websites are definitely rewarded by search engines. Speeding up a website can be the first step toward Search engine optimization.
- Hosting Resources – If your website is optimized, then it won’t be needing a lot of hosting resources to run smoothly. If you are on shared hosting and the websites are not optimized and consuming and exceeding resources limit then your website might go down.
Hope you have understood the importance of page speed by now. So, are there any tools for measuring the page speed or loading time of a website? Yes, there are. Google PageSpeed, Pingdom, and GTmetrix are recommended tools for analyzing a website’s performance. You can get exact idea of what is causing performance issues on your WordPress website.
Some of the most common problems behind a slow website might be Heavy unoptimized Images, Dense Coding, Too many advertisements, Unreliable Host, Embedded Media, Unoptimized plugins, a lot of java scripts, etc.
The speed of WordPress Websites can be greatly increased by doing simple things here and there. I have learned a lot of lessons in the past few years.
How to Speed Up and Optimize a WordPress Website?
1. Choose a Reliable Web Host
This is the first and foremost step in optimizing any website. If you go with a cheap host and it is not processing HTTP requests fast then no matter what you do at your end, your website can not be optimized beyond a certain limit. Your server must respond fast to the HTTP requests and SQL commands. Look at the image below. This happens when you choose a bad host –
Although hosting alone can’t make your website fast, you have to work on various aspects on the front end but it does matter a lot. If you choose shared hosting then remember there might be hundreds of other websites on the same server and you have very limited resources to keep the site running. Whereas with VPS and Managed WordPress hosting, you get better performance. So before choosing any hosting plan, consider how many visitors you have and how many hosting resources you need to handle traffic smoothly.
2. Shared Hosting vs WordPress Hosting
WordPress hosting is exclusively optimized for WordPress websites. You can skip a lot of optimization steps mentioned in this post just by going with WordPress hosting. For example, you don’t need to install a caching plugin on Godaddy WordPress Hosting because their servers provide inbuilt caching. WordPress hosting can be of different types such as Shared, VPS, and Managed WordPress Hosting.
3. Select Data Center Location Carefully
Be careful while choosing Data Center for your website. You get an option to choose a data center location while buying hosting. If your website targets visitors in a certain reason of the world, choose a data center located nearby. Say your website is only for Indians, so you should choose a data center in India or Asia so that your target users can access your website faster. Although visitors from a far region will experience slow loading of the website you can address this issue using CDN.
4. Opt for a Fast and Responsive WordPress Theme
First, your theme should be responsive means it should be perfectly optimized for all browsers, screen sizes, and devices. Second, it must be well coded, lightweight, clean, secure, search engine optimized, and robust.
On this blog, I am using the Genesis framework and am quite happy with its speed. A standalone theme can be faster than a theme with the framework. Everything comes with some cons and pros. WordPress default themes like twenty-thirteen are also well coded and fast.
Unnecessary images, Javascript, coding, and other functionality that comes with the theme will only increase the loading time of your website. Try to get no more than what you want.
5. Use a CDN
Actually, you get an option to choose a data center location for your website while purchasing hosting. If, for example, your website is hosted in a data center in Europe, it will load more slowly for users in Australia or the United States than it will for Europeans. It is simple. Users who live close to the data center where your website is hosted will experience faster site loading. CDN(Content Delivery Network) is a great way to address this challenge.
Your website’s files such as scripts, images, and CSS are hosted in various data centers(Provided by CDN) around the world. Now no matter where the user accesses your website, the content is delivered from the nearest data center. This way CDN greatly reduces the loading time of the website.
CDN not only reduces the number of requests but also saves bandwidth to a great extent.
2 popular CDNs are Cloudflare and MaxCDN.
6. Use a Caching Plugin
Using a caching plugin is crucial for speeding up any WordPress website. Installing a caching plugin is perhaps the quickest way to cut loading time down significantly. Let’s see what a caching plugin does.
Whenever someone visits your website, some information is requested from your web host such as HTML, images, fonts, Scripts, PHP files, Posts, pages, etc. And to make sure visitors are viewing up-to-date information, WordPress generates content dynamically means requests for fresh information are being made every time visitor visits that page.
However, as you are aware, we don’t update posts and pages very frequently. Therefore, why should we make a repeat visitor wait each time he requests the same post or pages? This is where a caching plugin comes into play. It produces static HTML versions of web pages, serves them to the returning visitors from a cache, and thereby drastically lowers the amount of HTTP, PHP, and MySQL requests required. The website loads faster.
When it comes to caching plugins, WP Super Cache and W3 Total Cache are 2 popular names. Good thing is that both are free. Caching plugins come with some great additional features like minifying Javascript and CSS.
7. Leverage Browser Caching
When a visitor visits a page on your website, the browser downloads all the content from the server used to build the page such as CSS, JS, text, etc. When he visits another page, the browser again downloads them all. But if Leverage Browser caching is on, the static files such as Java Scripts and CSS files will be stored in the browser cache. So whenever a visitor returns or opens different pages, only new content is downloaded from the server while static files such as javascript and CSS are served from the browser. This way leveraging browser caching reduces pressure on your server by reducing the no. of requests and reduces the page load time by delivering files fast from the browser instead of the server.
How to enable leverage browser caching in WordP? By adding Expires Headers. Expires Headers tell the browser if a certain file has to be downloaded from the server or to be delivered from the browser cache. Add the below code to the .htaccess file of your website –
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault “access plus 1 month”
ExpiresByType image/x-icon “access plus 1 year”
ExpiresByType image/gif “access plus 1 month”
ExpiresByType image/png “access plus 1 month”
ExpiresByType image/jpg “access plus 1 month”
ExpiresByType image/jpeg “access plus 1 month”
ExpiresByType text/css “access plus 1 month”
ExpiresByType application/javascript “access plus 1 year”
</IfModule>
8. Enable Gzip Compression
Enabling Gzip compression reduces the size of files sent from your server to the browser. It can reduce the size of the page by more than 50% and hence saves a lot of bandwidth. How do you know if Gzip is enabled or disabled on your website? You can use online tools such as GTMetrix.
To enable Gzip compression you can log in to the hosting control panel and look for a relevant option there. You can also implement Gzip compression using the .htaccess file. Just place the code below at beginning of the .htaccess file and hit save –
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml
</IfModule>
Caching plugins such as W3 Total cache also supports enabling Gzip compression.
9. Minify JavaScript and CSS
It is advised to take a backup of your website before you try this. As its name suggests, minifying is the process of reducing the size of JS and CSS files by removing unnecessary comments and white spaces from the files. Smaller files load fast.
You can minify JS and CSS files using plugins. You don’t need to install a separate plugin for it. If you have caching plugin installed, you can get this done.
One can also compress Javascript and CSS manually using JS and CSS compression tools available online.
10. Combine JavaScript, HTML, and CSS
One file, one request. A website will take longer to load the more javascript and stylesheets it contains because the server will have to handle more requests.
You can combine all the javascript files into a single, sizable file. The same can be done with CSS files. This will decrease the number of requests made to the server, and the website will load quickly.
11. Eliminate Render-Blocking JavaScript and CSS
The area of a website that a user first sees after landing there is known as “above-the-fold.” I’m referring to the area of the website that users can see without having to scroll down. Therefore, this section should be rendered quickly; however, the javascript and CSS in between may take some time to load and may lengthen the loading time. I’m not asking you to get rid of the CSS and javascript files. Javascripts are obviously necessary and cannot be removed, but you can move the render-blocking Javascript to the bottom of the page.
Keep CSS at the top and move Javascript to the bottom of the HTML page. This is how to move javascripts at the bottom. Copy and paste the below code to the functions.php file on your WordPress website –
function remove_head_scripts() {
remove_action(‘wp_head’, ‘wp_print_scripts’);
remove_action(‘wp_head’, ‘wp_print_head_scripts’, 9);
remove_action(‘wp_head’, ‘wp_enqueue_scripts’, 1);
add_action(‘wp_footer’, ‘wp_print_scripts’, 5);
add_action(‘wp_footer’, ‘wp_enqueue_scripts’, 5);
add_action(‘wp_footer’, ‘wp_print_head_scripts’, 5);
}
add_action( ‘wp_enqueue_scripts’, ‘remove_head_scripts’ );
12. Optimize Images
Images take a lot of storage as well as time to load. But did you ever know the size of images can be reduced without compromising their visual quality? Yes, WP-Smushit is the plugin that reduces the size of images significantly using the lossless compression technique. You need not worry about already uploaded images. The plugin can handle already uploaded images as well as new images during the uploading process.
Another plugin is Lazy Load which makes sure that the image will only be loaded when the area becomes visible to the user.
One other thing you can do is enable Jetpack Photon Module. Since It delivers images using globally distributed CDN, images load faster.
Small theme images such as logos at the footer can be combined into one image using CSS sprite to reduce the no. of requests for the webserver to process.
Specifying Image Size will be a plus for your website speed. Actually, browsers figure out how to arrange content around images. So if you don’t specify the size of images, the browser can take longer to figure this thing out.
13. Don’t Use a Lot of Ads
Advertisements comes with javascript and images. You need to know that JS and Images, ads are using are hosted on other servers which you don’t have any control over. You can not add expires headers to make them fast. You can not optimize their images. You can not reduce no. of requests the ad makes. I just want to say too many advertisements might affect the performance of the website as well as the user experience.
14. Install AMP Plugin
AMP(Accelerated Mobile Page) is a project started by Google to make the web fast. It’s going to be the next big thing for webmasters. You can install AMP plugin available in the WordPress Plugin repository. AMP plugin greatly reduced the loading time of a website on mobile. To accomplish this, it does these 2 things –
- Most Javascripts are forbidden
- Uses its own server to deliver content
15. Enable HTTP Keep-Alive
Enabling HTTP Keep-Alive allows the same TCP connection to send and receive multiple HTTP requests. It reduces the delay before a transfer of data begins for subsequent requests. To enable Keep alive, paste the below code at the end of your .htaccess file –
<ifModule mod_headers.c>
Header set Connection keep-alive
</ifModule>
16. Repair and Optimize Database
This is one thing I do regularly and usually at the end of the optimization process. The database gets messy over time. Empty spaces are left on database files after queries are executed. These spaces add up and might affect MySQL performance. Optimizing the database removes these empty spaces from files.
You can use Wp-Optimize, WP-dbmanager, or any other plugin to repair and optimize the MySQL database.
17. Install Well coded Plugins and Remove Unused Plugins/Themes
Only install a well-coded, regularly updated, and well-optimized plugin because poorly developed plugins might cause performance issues. Also, don’t forget to remove plugins that you are not using.
You can find troublesome plugins using P3(Plugin Performance Profiler) plugin. It will give an idea of which plugin is consuming more hosting resources. You can later replace those plugins with better ones. Don’t keep the P3 plugin installed once you have found the culprit.
18. Remove Broken Links and Disable Hotlinking
Google does not like Broken links. Broken links lead your visitors to nowhere and increase bounce rate which is not a good thing. You can find all the broken links using the broken link checker online and remove them manually. Actually broken links consume bandwidth and do not serve any purpose so they need to be fixed.
If someone is linking to images or other files on your website, it is called hotlinking. Hotlinking is considered bad because someone else is stealing your bandwidth and resources of your server. So you should disable hotlinking. To disable hotlinking add this code to .htaccess file on your website –
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?Yourwebsite.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]
Don’t forget to replace “yourwebsite.com” with the name of your website.
19. Turn off Pingbacks/TrackBacks and Delete Old Post Revisions
Every time you hit the save draft button while writing a post, WordPress saves the version/revision of the post. It enables us to view and restore any old version of the post later.
You can delete old post revisions or control the number of post revisions WordPress should keep for your posts. This would reduce the burden on the database. Add this code to the wp-config.php file –
define( ‘WP_POST_REVISIONS’, 3 );
3 is the number of post revisions.
Pingbacks and trackbacks serve no good purpose. You can turn them off by going to Setting>>Discussion.
20. Empty Trash and Block Spam Comments
Installing an antispam plugin is vital, otherwise, your website will be flooded by spam comments. Akismet and Antispam Bee are two popular plugins to block spam comments and spam form submissions.
Whenever a post, page, comment, and feedback is deleted, it goes to the trash. You should regularly empty your trash. It will be your kind act to the database of your website. If you can’t do it manually add this code to wp-config.php –
define (‘EMPTY_TRASH_DAYS’, 7);
7 is the number of days after WordPress will delete your trash.
So these were some tips you can follow to speed up and optimize your WordPress website. Hope you will find this post helpful. If so share it among your friends.
