wordpress speed improve seo load page gtmetrix pagespeed metrics faster

How to Speed Up Your WordPress Website Load Time

Published by Soufiane | Categories : Computers - Tips & Tricks - Computers - Internet - WordPress

Nowadays every website must load fast in order to rank high in search engines.

One of the major points in SEO (search engine optimization) is the time it takes to load your website in both Desktop and Mobile.

But why your website is still slow?

Do you think that there is no solid tutorial out there that includes all the steps you need to follow to improve your WordPress website’s speed?

Well… this is the tutorial you will ever need for you to boost your blog!

You will discover how to use .htaccess, plugins, wp cron, and functions to make your site load faster.

By applying these tricks I was able to load easytutorial.com in 1,4 seconds (I can still improve it by enabling caching but I don’t want to for some reason)!

In this ultimate tutorial, you will learn how to speed up your WordPress site with easy steps.

Please take a speed test using Gtmetrix.com before you apply this tutorial and tell me the results!

Test First!

Before you apply these tips & tricks test your website’s speed, and after you do them test again and show me your results.

After I applied everything in this tutorial, here are the results:

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 001

Google recommends that a site should load under 3s, I got 1.0s!

The site is loaded with images and is only 359KB and took only 35 requests to fully load.

This without forgetting that the website is hosted in an SSD VPS in the USA and the test was conducted in Canada.

1. Edit Your .htaccess!

Add Expires Headers to Static Files in .htaccess

One thing to enable client (browser) caching is to enable expires headers to all your static files, this way your visitor won’t request your previously downloaded static files when browsing.

This will save you a lot of traffic, and will improve your page speed score!

Static files include all these: images, fonts, CSS, js, SVG, XML, HTML, txt…

In order to enable expires headers is to edit your .htaccess file and add after # END WordPress this code:

#Start Expires Caching
<IfModule mod_expires.c>
FileETag MTime Size
AddOutputFilterByType DEFLATE text/plain text/html text/xml text/css application/xml application/xhtml+xml application/rss+xml application/javascript application/x-javascript
ExpiresActive On
ExpiresByType text/html "access 600 seconds"
ExpiresByType application/xhtml+xml "access 600 seconds"
ExpiresByType text/css "access 1 month"
ExpiresByType text/javascript "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresDefault "access 1 month"
</IfModule>
#End Expires Caching

If you don’t know how just connect to your cPanel account and go to File Manager.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 2 cpanel file manager

Open /public_html/.

Right-click on .htaccess and choose Edit.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 3 file manager edit htaccess

If you can’t see the file, click on Settings and check “Show Hidden Files (dotfiles)“. Click “Save“.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 4 show htaccess hidden files dotfiles

Enable Gzip Compression in .htaccess

Gzip compression alone saved me 50% of my website’s traffic. This means that web pages loaded faster.

When the browser communicates with your server without compression, data is taking a lot of time to be transferred, leveraging gzip compression will save you a lot of time and bandwidth.

To enable Gzip compression, add this snippet to your .htaccess code below the expires headers you added earlier:

#Start Gzip Compression

<IfModule mod_deflate.c>
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml

# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
</IfModule>

#End Gzip Compression

2. Convert All Media to .webp for Faster Loading

When you serve images in the old formats (png, jpg, bmp), your website load slower.

You can save 70-80% of your image sizes by using a .webp format.

To do this you need to install the plugin: WebP Converter for Media

After installing it enable it and go to Dashboard > Settings > WebP Converter

This plugin supports the conversion on jpg, jpeg, png and gif file formats. Works with GD and Imagick and allows the automatic removal of WebP files larger than original and browser caching for WebP files.

Leave everything to default and click “Save changes“.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 5 webp converter media

Scroll down and click on “Regenerate All”, you will need to do this only once you install the plugin, every new image uploaded will be auto-converted to WebP.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 6 webp converter media regenerate all

3. Minify HTML, Js & CSS

Compiling and optimizing all your CSS and Js files into one CSS and Js file will save you a lot of bandwidth and server requests.

The best plugin I came across to do this job is Autoptimize.

Add the plugin Autoptimize to your WordPress website from the Dashboard (/wp-admin/) and activate it.

Check “Optimize JavaScript Code?” and enable “Aggregate JS-files?“.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 7 autoptimize javascript code minify aggregate

Check “Optimize CSS Code?” and “Aggregate CSS-files?” and also “Also aggregate inline CSS?“.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 8 autoptimize css

The static aggregated files will be saved in the Cache folder.

Save your aggregated files as static files and Save and Empty the cache every time you change settings.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 9 autoptimize save changes empty cache

4. Disable WP-Cron

WP-Cron consumes a lot of backend time because it’s loaded every time you open a page of your WordPress website.

One way to optimize it is to execute it from outside WordPress using cPanel/PHP Cron Jobs, once or twice an hour.

To disable Cron open your wp-config.php file on your File Manager.

Insert this line at the start after <?php:

define('DISABLE_WP_CRON', true);
wordpress speed improve seo load page gtmetrix pagespeed metrics faster 10 disable wp cron wp config

Then go back to your cPanel home and click on Cron jobs.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 11 cron jobs cpanel

Choose “Twice Per Hour(0,30 * * * *)“.

Enter this command (change your hostname):

wget -q -O - https://www.easytutorial.com/wp-cron.php?doing_wp_cron >/dev/null 2>&1

Click on “Add New Cron Job“.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 12 add new cron job cpanel

This should be the result.

wordpress speed improve seo load page gtmetrix pagespeed metrics faster 13 current cron jobs

Now let’s see some extra tips and advice you should follow to ensure maximum performance.

5. Defer Javascript

Add this to your functions.php file of your theme:

add_filter( 'clean_url', function( $url )
{
if ( FALSE === strpos( $url, 'jquery.js' ) )
{ // not our file
return $url;
}
if ( FALSE === strpos( $url, 'adsbygoogle.js' ) )
{ // not our file
return $url;
}
// Must be a ', not "!
return "$url' defer='defer";
}, 11, 1 );

6. Extra Tips for WordPress Maximum Speed

Remove Unused Plugins, Unused Everything

If a plugin is not really necessary remove it and if a plugin does what a function in your theme (functions.php) can do, then remove it and use the function instead!

Use only necessary plugin and avoid adding too much plugins for it slows down your website.

Use Simple, Light & Optimized Theme

Choose the simplest theme for your website, avoid clutter as much as you can.

I will someday launch my own theme for free, wait for it.

Host Your Website on SSD Server

Leverage SSD web hosting when it comes to hard disk storage, it will make your website load faster.

There you have it!

If you have any questions feel free to leave a comment below this tutorial!


Related tutorials:


Be the first to leave a comment !

Leave a comment

xD oO ^_^ =] =) ;-( ;) :| :woot: :whistle: :sleep: :sick: :police: :p :o :ninja: :mm: :love: :lol: :kiss: :hmm: :evil: :bandit: :angel: :alien: :D :) :( 8)