What is a cache? A complete guide to caches and their important uses on your…
Website Performance Optimisation
Website Performance optimisation is a step you shouldn’t overlook if you want to get the most of your new website.
In this article we are going to cover three different areas image optimisation, minification & caching. By following the pointers and taking care of the items mentioned you should be able to achieve a respectable gtmetrix PageSpeed & YSlow score.
Website Image Optimisation
First up we’re going to cover image optimisation. Incorrectly loaded and chosen images are one of the biggest areas where we find clients slowing down their websites
Missing the image optimisation step will result in huge hits to your page speed score and could potentially cause your loading time to raise by a large amount depending on how careless you get. In terms of being careless, let me tell you Having a 10mb images load, instead of 128kb images that would look the same is going to cause some serious issues.
Website Images – Resizing and Compressing
Image Resizing:
If you’re uploading images directly from a camera, make sure you resize them first. Modern cameras can output images over 7000px wide with file sizes larger than 20mb.
Even if you’re using a full width section in your WordPress Website, there’s just no need for the image to be over 2000px wide. That would be a full width “hero” type image that you often see in sliders / galleries.
Ideally you will resize unnecessarily large images in your go-to program before uploading them. For example if you know that an image will only be used at 300px width then upload it into your media library at that size. If you don’t have a premium image editing tool such as Adobe Photoshop, there are free solutions out there such as Gimp.
Image Compressing:
After you’ve ensured the images you’re using are not massively oversized – you need to verify that you’re compressing them properly for the web. If you use Photoshop, leaving the default quality setting on 100% is a big no no.
With image compression the goal here is to balance the quality with file size. Warning if you compress too much you’ll end up with undesirable artifacts, but leaving it too high could double or triple the file size for no reason. Here’s a great article covering the topic in detail over at Envato. As you can see within the article, compressing plays a huge role is file size and thus download speed to your user. It’s also worth noting there are three robust WP plugins (Smush it , Short Pixel & EWWW) which you can use to bulk compress images on your setup.
Website Performance Optimisation – Minification
Minification removes all unused spaces in the theme asset files to make the size smaller. By default the files are shipped to be human readable with normal spacing and comments to help you understand if you wanted to inspect it & make modifications through a child theme.
Besides just removing spaces to reduce file size, minification through the plugin we recommend will also combine all the Javascript & CSS files into one .js and one .css file. This reduces the number of requests your server has to make, thus yielding more page performance and greater Page Speed scores.
If your Google PageSpeed score needs improving, minifying Cascading Style Sheet (CSS), HTML and JavaScript (JS) files will almost certainly be listed as a recommendation.
CSS, HTML and JS files are used to add comments to your website code, for example to clarify formatting or style. Minification sounds complicated but it simply means reducing the size of these files and deleting unnecessary code.
Doing this is hugely beneficial as it will enable your site to load more rapidly, whilst retaining the key information needed in order for your site to display correctly. You can minify your JS, HTML and CSS files on WordPress quickly and easily with the free WP-Optimize plugin.
Enable Caching and its impact on Website Performance optimisation
By enabling caching on your website, your site data can be stored locally in temporary storage spaces, called caches. This means that browsers can load your site files more easily and don’t have to re-download everything from your server every time your site is needed.
Caching thus makes your page loading speeds much faster, especially when people return to your site for a second or third time. It’s super-easy to enable on WordPress. With the hosting that we provide on Website Design & build Caching is sorted by StackCache
The Importance of mobile in Website Performance optimisation
As Google mainly uses the mobile version of websites in its rankings, it’s vital to think mobile-first when it comes to designing and optimising your site’s speed.
The easiest way to ensure fast mobile loading is with a responsive WordPress theme. This will ensure your site is adapted and displayed in the best possible way on smaller screens.
In addition, several plugins are great for optimising your WordPress site’s mobile speed. WebP Express converts your site images into super-fast webp versions which work on 80% of mobile browsers. Bear in mind, however, that this also requires adding image compression software on your server.
The WordPress AMP plugin is also recommended to boost mobile speed. It creates AMP versions of your webpages which load instantly on mobile and other devices.
Make Sure Plugins Are Updated
Plugins may be reducing your site speed in various ways. Poorly-designed plugins, plugins with outdated software, or surplus/duplicate plugins can all contribute to slow website loading.
It’s worth remembering that it’s not the quantity of plugins that generally causes a speed problem. (That is, unless you have lots of plugins which do the same thing or are not used – in which case the surplus ones should be deleted.) In general, it’s the quality and usefulness of plugins that affect page speed.
It’s a good idea to run a Google PageSpeed test both before and after installing any plugin. This will show the impact of the plugin on your site’s speed, so you can make an informed decision about whether the plugin’s functionality is worth any site slowing.
You can also check how your site speed is affected by your current plugins by deactivating each one in turn in the ‘Plugins’ section of your WordPress website back-end, and then running a PageSpeed test.
You should also make sure to update plugins as and when new software becomes available. Updates are always highlighted on your WordPress dashboard – simply check regularly and click on any update messages to action them.
Clean-up your database
Finally, you can speed up your website with a good old spring clean!
The more you use your WordPress site, the more your database becomes clogged-up with old and unnecessary files that slow down your performance. Cleaning your database therefore speeds everything up by removing the items that aren’t needed.
Related Posts
