21 ways to make your website faster
WordPress, like many other Content Management Systems (CMS) and websites, can suffer from being a little sluggish. There are a huge number of different things that affect the speed of your website. Some are easy to solve, while others can be more difficult or require additional expense. Ideally you want pages on your site to fully load within a couple of seconds. Why? Visitors are impatient and may leave your site if it’s too slow, and Search Engines (particularly Google) are increasingly using site speed as a ranking factor in search results.
Is my website slow? Test your website speed
First of all, you need to know what you’re up against, so you need to run a test on your website. Google has an excellent website speed testing tool that also provides information on how to fix issues. Pingdom.com also has a useful website speed checker that actually provides more in-depth results that Google’s website checker.
Once you’ve got your website speed it’s time to look at things in a little more depth.
Why is my website slow?
Quite simply the faster your website responds, the better. Using your site is faster for your visitors, meaning that can do what they’re there to do quicker, and therefore less likely to get frustrated and leave your site before they’ve done what they came to do.
There’s lots of reasons why a website could be slow, and the reasons are true across the board of websites and CMS, not just WordPress.
How to speed up your website?
Check your hosting provider
This is really the first thing you need to consider. The specification of the servers that your hosting provider uses will dictate a lot regarding the performance of your website. The cheapest hosting will typically share a server amongst lots of other websites, degrading the performance as a number of websites are trying to be served simultaneously.
Most small sites are fine on shared servers, but if it is causing you problems, shop around for a better service.
Keep everything up-to-date
Updates to your CMS, themes and plugins aren’t just improvements to security and functionality. Updates also often provide a faster and more streamlined version.
Choose a good theme
‘Good’ in this instance doesn’t mean something that looks nice, it means something that’s well-coded and fast. Bloated or poorly coded themes can really slow things down. The standard themes offered by WordPress are safe, though may not be as good-looking as you’d like.
Delete unused items
I, like many people, are guilty of keeping additional themes and plugins installed, even though I’m not using them. Clearing the clutter frees up space and reduces stress on your server. This also applies to your database, so keep it clean, and delete things such as post revisions you no longer need.
Identify demanding plugins
For WordPress you can use the P3 Profiler Plugin to identify which plugins are slowing down your site. If some are having a particularly detrimental impact, consider finding a better coded alternative, or doing without it.
Use code, rather than plugins
Plugins are great, extremely useful, and provide excellent functionality, though sometimes we can be a little lazy and use plugins where maybe they’re not strictly required. If you can code something yourself instead of using a bloated plugin, then do so.
Install Gzip
Gzip compresses all of your website files and sends them to the visitors browser where they are they uncompressed and displayed. There’s no real reason not to use Gzip. You can check whether Gzip is installed on your server here. If not, you can use a plugin to install it.
Use a CDN (Content Delivery Network)
In the most simple of terms, a CDN takes your static websites files (such as images and Javascript files) and enables visitors to your site to download them quicker by using faster servers and using servers which are closer to your visitor. The Jetpack plugin for WordPress includes a CDN. Some CDN’s are paid services.
Compress your images
Images are usually amongst the largest files which you have on your website. Photographs in particular can often be very large. Images can easily be several megabytes in size, especially as newer mobile phones and cameras take much larger photos than they did just a few years ago. You can either compress the images before you upload them, or use a plugin. ShortPixel is pretty good, though there are monthly usage caps unless you pay.
Disable Hotlinking
Hotlinking is also sometimes referred to as leeching. It’s where other websites link to your content directly in order to display or make available on another website. There are legitimate uses for this, but it can cause problems, especially if your website become very popular, and many sites are hotlinking your content. This is because other people’s websites are sending requests to your server which can degrade performance.
You can disable hotlinking by editing your .htaccess file on your server. Just add the code below. If you’re not comfortable with doing this, speak to your hosting provider.
disable hotlinking of images with forbidden or custom image option
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?sparringmind.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feeds2.feedburner.com/sparringmind [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]
Host video externally
This is actually just like hotlinking (mentioned above.) It’s a good idea to upload videos to another website that specifically hosts videos, such as YouTube or Vimeo. The reasoning being that their servers are going to be much more powerful than yours, and capable of streaming high definition video seamlessly, whereas your server would probably result in buffering and choppy playback.
Use browser caching
Browser caching is only really of use to return visitors and those who are browsing multiple pages of your website. The browser cache stores static files on the users computer so that they can be accessed again quickly rather than having to be downloaded from your computer each time. You can specify what files are stored and for how long by either editing the .htaccess file, or using a plugin. Example code is below, but once again, contact your hosting provider if you’re unsure.
#
# associate .js with “text/javascript” type (if not present in mime.conf)
#
AddType text/javascript .js
#
# configure mod_expires
#
# URL: http://httpd.apache.org/docs/2.2/mod/mod_expires.html
#
ExpiresActive On
ExpiresDefault “access plus 1 seconds”
ExpiresByType image/x-icon “access plus 2692000 seconds”
ExpiresByType image/jpeg “access plus 2692000 seconds”
ExpiresByType image/png “access plus 2692000 seconds”
ExpiresByType image/gif “access plus 2692000 seconds”
ExpiresByType application/x-shockwave-flash “access plus 2692000 seconds”
ExpiresByType text/css “access plus 2692000 seconds”
ExpiresByType text/javascript “access plus 2692000 seconds”
ExpiresByType application/x-javascript “access plus 2692000 seconds”
ExpiresByType text/html “access plus 600 seconds”
ExpiresByType application/xhtml+xml “access plus 600 seconds”
#
# configure mod_headers
#
# URL: http://httpd.apache.org/docs/2.2/mod/mod_headers.html
#
Header set Cache-Control “max-age=2692000, public”
Header set Cache-Control “max-age=600, private, must-revalidate”
Header unset ETag
Header unset Last-Modified
Minify CSS & JavaScript
As you begin to install themes, plugins and addons to your site, the number of individual CSS and JavaScript will increase, thereby increasing the amount of data which is transferred, and increasing the number of requests that are sent to your server.
Files should be optimised either manually or automatically to reduce the file size and consolidate them where possible.
There are plugins available, such as Better WordPress Minify, that automatically minify and consolidate your CCS and JavaScript files for you. Personally though, I’ve had little success in using plugins to minify files, as the process has frequently broken plugins. This is just my experience however, you may have better luck.
Use CSS instead of images
It wasn’t that long ago where achieving rather simple effects, such as drop-shadows or using uncommon fonts meant that you had to use images. Now however, with the advent of HTML5 and CSS3, these things, amongst many others, can now be achieve with just simple bits of code.
Replace PHP with HTML where possible
This might be difficult to achieve, and possibly beyond the skill set of some people who manage website content. PHP takes longer to render because instructions have to be sent to the server, processed, and then sent back to the browser. HTML however, is static.
Remove unnecessary widgets
In particular I’m referring to sharing widgets that allow people to share content on your site on social media channels. These can cause considerable slowdown, so it’s worth only keeping them on relevant pages. Also consider using the simplest version of the widgets you can.
Specify image dimensions
As a webpage loads it has to calculate the size of the elements in order to figure out where the content should be placed. If you specify the sizes of the elements for the browser, it means that it doesn’t need to spend time calculating it itself.
Enable ‘Keep Alive’
‘Keep Alive’ is an instruction that’s sent between the visitors computer and your server. The instruction grants permission to download files from your server without having to ask each time. This saves bandwidth and time.
This can be done by inserting a simple bit of code into your .htaccess file.
Header set Connection keep-alive
Use CSS sprites
A CSS sprite is a single large image that contains all the graphic elements you need for your site in one file. Having a single file means it will download quicker than lots of smaller ones. You need to be careful that your sprite isn’t too large as some web browsers may not be able to display them.
Limit the amount of content on a page
As your website grows you need to be mindful of the impact this may have on your website. Some pages, particularly those which list blog entries and news articles can become excessively long, taking a very long time to load, and in some extreme cases crashing web browsers. Keep the number of displayed posts manageable.
Turn off Trackbacks and Pingbacks
WordPress in its default state will attempt to notify your website each time someone mentions it or their site. Turning this feature off doesn’t break the links, it just stops the notifications and therefore the additional work that your server would have to do.
Conclusion
There’s a lot to can do to speed up a lagging website. Try some of the suggestions here, starting with the easiest to achieve, and soon you should notice am improvement.