There are many ways to improve your WordPress site speed, however there are a couple of really simple and free things you can do that will increase WordPress site speed.
I am talking about self hosted WordPress here of course, not if you have a blog on WordPress.com. If you are self hosting WordPress then you do have some control over the technology and plugins so you can implements these changes.
Also most self hosted WordPress sites are installed on low cost shared hosting platforms. The low cost is very attractive to people just starting out with their WordPress website, however there is a reason for the low cost and there are finite limitations.
One step that website owners often take, is the go with a caching plugin, and just install it without much thought. However, whilst a caching plugin may speed up your site, it may not and may even slow it down. I would say that adding a caching plugin is an advanced technical skill, and measurements need to be taken before and after. My personal experience is that with less than 1,000 visitors a day, trying a caching plugin is a waste of time. But try it if you must, as it will vary depending on the circumstances. One reason why caching plugins do work well is many shared server are limit the speed and access to the database server (or are over subscribed), WordPress has to access the database to retrieve most of its content, so in the case of a poor performing database caching plugins may help.
However, the following three tips, will speed up your WordPress site and help you optimize your WordPress speed, without getting in to measuring and testing and require no more technical skills than being able to add plugins and use FTP/file manager.
Step 1 – Speed up WordPress website performance – by optimizing your images
Most novice web master use the powerful WordPress media gallery and start up loading their images. That is great, but most digital cameras are such high resolution that the file sizes are massive. WordPress does do some work behind the scenes and creates smaller images for thumbnail, but any full size image is just that, if you load up a 9 meg image (approx 3,000 x 3,000 ) then that is what will be displayed – 9mb. Imaging you have 10 images on your blog home page – that is 90mb – slow! In reality you rarely need an image bigger than 1024x1224px and even a high res background on widescreen doesn’t need to be bigger than 1920px x 1080px.
To sort this out install the plugin IMSANTITY -> https://wordpress.org/plugins/imsanity/
The default settings (1024 x 1024 ) are fine.
You can even bulk resize. (Be careful if you do have images that you want to keep high resolution )
And there is more to do with images. Digital cameras also add a load of extra data to images, like date / time / camera type / GPS location and this can be removed. There are also various lossless optimizations that can be done, not just pixel size. This is where the next plugin comes in.
Install WP Smush.it – > https://wordpress.org/plugins/wp-smushit/
Once installed you can find the setings on the Media menu
You can auto smush on upload
and of course bulk optimize too
Even just composing this post, Smush has saved me 666kb of space so far, so think about how much that will help on slower mobile connections.
Step 2 – Improve WordPress site load speed – by leveraging browser Caching
Browser caching doesn’t actually sped up your site, well not for the first page visit, but it does really help after then. By telling the browser that certain files, mainly images, javascript and CSS don’t change that often, allows the browser to store them locally. What that means is that these files don’t get re-downloaded from the server on every page view. Having locally cached files really speeds up the user experience.
Adding browser caching is fairly simple, you have to add a few lines to your .htaccess file. Your .htaccess file will sit in the main directory of your WordPress install, as it starts with a dot it is a hidden file, so depending on your file manager you may need to set a setting to show hidden files.
Expires Headers
What needs to be added is expires headers and this is the code I use on my sites
<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault "access plus 1 month"
# CSS
ExpiresByType text/css "access plus 1 year"
# Data interchange
ExpiresByType application/atom+xml "access plus 1 hour"
ExpiresByType application/rdf+xml "access plus 1 hour"
ExpiresByType application/rss+xml "access plus 1 hour"
ExpiresByType application/json "access plus 0 seconds"
ExpiresByType application/ld+json "access plus 0 seconds"
ExpiresByType application/schema+json "access plus 0 seconds"
ExpiresByType application/vnd.geo+json "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType text/calendar "access plus 0 seconds"
ExpiresByType text/xml "access plus 0 seconds"
# Favicon (cannot be renamed!) and cursor images
ExpiresByType image/vnd.microsoft.icon "access plus 1 week"
ExpiresByType image/x-icon "access plus 1 week"
# HTML
ExpiresByType text/html "access plus 0 seconds"
# JavaScript
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType application/x-javascript "access plus 1 year"
ExpiresByType text/javascript "access plus 1 year"
# Manifest files
ExpiresByType application/manifest+json "access plus 1 week"
ExpiresByType application/x-web-app-manifest+json "access plus 0 seconds"
ExpiresByType text/cache-manifest "access plus 0 seconds"
# Markdown
ExpiresByType text/markdown "access plus 0 seconds"
# Media files
ExpiresByType audio/ogg "access plus 1 month"
ExpiresByType image/bmp "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType image/webp "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/ogg "access plus 1 month"
ExpiresByType video/webm "access plus 1 month"
# Web fonts
# Collection
ExpiresByType font/collection "access plus 1 month"
# Embedded OpenType (EOT)
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
ExpiresByType font/eot "access plus 1 month"
# OpenType
ExpiresByType font/opentype "access plus 1 month"
ExpiresByType font/otf "access plus 1 month"
# TrueType
ExpiresByType application/x-font-ttf "access plus 1 month"
ExpiresByType font/ttf "access plus 1 month"
# Web Open Font Format (WOFF) 1.0
ExpiresByType application/font-woff "access plus 1 month"
ExpiresByType application/x-font-woff "access plus 1 month"
ExpiresByType font/woff "access plus 1 month"
# Web Open Font Format (WOFF) 2.0
ExpiresByType application/font-woff2 "access plus 1 month"
ExpiresByType font/woff2 "access plus 1 month"
# Other
ExpiresByType text/x-cross-domain-policy "access plus 1 week"
</IfModule>
This is based mainly on the .htaccess file in the HTML5boilerplate project -> https://github.com/h5bp/html5-boilerplate/blob/master/dist/.htaccess
Step 3 – Speed up your WordPress site – by turning on GZIP compression
GZIP compression basically compresses what is being sent over the internet. So when a page is requested the server compresses it, it is sent and the browser decompresses it. There is an overhead of the compression and decompression, but generally the reduced size thus faster transfer speed far outweighs the the overhead.
For some strange reason, this is so basic you would think that all hosts would have this turned on by default, but in fact most don’t.
You can easily check. There are lots of sites that do this and here is one -> http://checkgzipcompression.com/
If compression isn’t turned on then you should turn it on to improve the speed of your WordPress website.
If you manage your own servers without a control panel you will have get into the Apache config, but fortunately most hosts provide a user friendly control panel and you should be able to turn on compression through your control panel. If you can’t or can’t find it, raise a ticket with your host support, they should help you.
The most common hosting control panel is C-Panel, and if your host has permitted you access to it you will find it under software / services – optimise your website
And you can set the setting to compress all
Summary
So taking these three steps, requires virtually no effort, and if you have a slow WordPress site these are the first steps you should take
- Optimise your images
- Enable browser caching
- Turn on GZIP compression
Thank you for reading, I would really like your comments, use the form below, and if you feel like sharing on Twitter or Facebook please do.
[Next] Find out where to host WordPress [Read the full article…]
Leave a Reply