The Ultimate Guide to WordPress Site Speed and Optimization

If you want to speed up your site to ensure the best experience for users and improve your SEO, there are several steps you can take to make sure your site is running as quickly as possible.

It’s also easy to overlook loading time when you’re building your site as you’re concentrating so much on visuals and navigation. But taking the time to make sure your site is optimized and loading quickly has several advantages for both your site visitors and you.

This guide is geared towards WordPress users as so many sites are now built on WordPress, but there are also lots of tips that can be used on static HTML sites or sites built on other platforms.

Why is Site Speed Important?

So you may be wondering why worry about site speed at all? After all, internet technology has improved so much in recent years – it’s not as if you have to sit and wait 10 minutes for a web page to load anymore.

In fact there are several reasons and speeding up your site is one of the easiest things you can do to increase your site traffic.

1. Better User Experience

The less time users have to wait around for your content to load, the more likely they are to stick around instead of clicking the back button and trying a different site.

Today’s web users are impatient and aren’t prepared to sit and wait for your site to load, no matter how pretty it looks.

Research shows that around 40% of website visitors will leave a site if it takes longer than 3 seconds to load and a 1 second delay in page response can result in a 7% reduction in conversions.

Keeping your page load time to a minimum will reduce the number of users that leave your site and make the ones that stay more likely to stay longer on your site.

2. Speed is a Ranking Factor

In recent algorithm updates, Google has started using site loading time as a metric to decide where to rank sites in their search result listing pages.

This means that for two otherwise identical sites, the one that loads the fastest will probably be listed first in the search engine result pages.

Google has recognized the importance of site speed for users, particularly for people accessing the web via their phones and mobile devices, and aims to provide search results that provide the best experience for the user. Slow sites will be penalized by appearing further down the search listings.

3. Site Speed Affects Your Bottom Line

Combining all the negative effect that a slowly loading site could potentially have (lower search engine result position, lower conversion rate, higher bounce rate, and less user time spent on your site) it’s easy to see how a speedy website can become more successful than a sluggish one.

Ultimately, site speed can affect your business revenue and you can make more money from your site just from tweaking it to load faster, rather than adding unnecessary bells and whistles that may only slow it down further.

What Slows Down a Website?

When building a website there will always be a balance between loading time and visual appearance. The fastest loading site would be plain text with minimal html tags that a browser can interpret in fractions of a second and display quickly even on the slowest internet connections.

Conversely, a site with lots of large, high quality images or background images would take longer than normal to load, due to the sheer quantity of data that must be downloaded before it can be displayed on the user device.

Luckily internet speeds are fast enough these days for the most part that it’s not necessary to pare back your site coding to the bare bones. Eliminating unnecessary bloat however can go a long way towards speeding up your site without sacrificing the appearance.

Factors that affect site speed:

1. Too many high-resolution images

Large images are probably the number one cause of a slow site. This doesn’t mean you have to build an image-free site, but making sure that image files are compressed to a smaller size can make a big difference to loading time.

Of course this depends on your business and site – users would expect the website of a photographer, for example, to have a lot of large high-quality images and will therefore be prepared to wait a little longer for the page to load.

2. Poor web hosting

Site speed is not all about the makeup of your site; it’s also about the resources of the server it’s hosted on. This can particularly be a problem with shared hosting. If your site is still suffering from slow performance after you’ve optimized it, you may want to consider upgrading your hosting package or moving to a different provider.

3. Bloated code

The more code there is on a page, the longer a browser will take to interpret it. If you have a WordPress site or site built on another CMS, you’re probably using a theme that was coded by a developer.

Some themes are ‘cleaner’ than others and some may contain lots of extraneous code that isn’t needed for your site. Try changing to a different theme and see if it improves your site speed. Minifying code and compressing CSS and JavaScriptfiles can also help keep loading time down.

4. JavaScript

JavaScript snippets can do many useful things such as enable analytics and tracking, allow sharing to social media, and display advertisements, however they can also slow down your site. E

liminate unnecessary JavaScript and minify the code of what remains. Loading JavaScript in the <head> of the page can also slow down loading times as the page will stop loading until the script runs – most scripts can be put at the bottom of the page for better performance instead.

5. Too many plugins

WordPress plugins are a very convenient way of adding functionality to your site but they also add additional code, and some plugins can impact the speed of your site significantly.

It’s best to keep plugin use to a minimum, disable and uninstall any plugins you’re not using, and only use well-coded plugins (look for those with good reviews).

6. Un-optimized database

Over time your website database can become clogged up with junk data. This can make queries to the database run slower, which affects the performance of the entire site. It’s worth doing some housekeeping on your database from time to time to make sure it’s clean and running efficiently.

How to Test Your Site Speed

Before attempting any changes to speed up your site it’s a good idea to assess its current performance. This allows you to see what effects (if any) the changes you make have on the speed of your site and can also give you an idea of how it performs compared to competitors sites.

1. Google PageSpeed Insights

PageSpeed Insights is a tool provided by Google intended to help webmasters to optimize their sites for all devices, thereby providing a better experience for web users. You don’t need to have a Google account to use this tool and you can run it on any website – not just your own sites.

After running your website url through the tool you’ll get a snapshot of how your site looks on desktop and mobile and a rating out of 100 for optimization and speed.

Below the score, a set of bullet points will alert you to potential optimizations you can make such as activating browser caching, optimizing images, and removing JavaScript, along with a summary of optimizations that have already been made.

2. Pingdom

While Google PageSpeed Insights can help with some general ideas for speeding up your site, Pingdom gets down to the actual figures by letting you know exactly how long the page takes to load, the size of the page, and the number of requests that are made.

You’ll be given an overall performance grade and a number showing the percentage of tested sites your site is faster than (which can be useful to get a general idea of overall performance compared to the rest of the web.

There are also individual grades for several aspects of site optimization and performance so you can see exactly what you need to work on.

Below this you can see the types of content that are loaded on page and the size they account for, content type by requests, content by domain.

A Step-by-step Guide to Speeding up Your Website

After you have a better idea of what exactly is slowing down your site, you can use our handy step-by-step guide to speed it up again. You may not need to follow out the actions for every single step (use your results and recommendations from the speed tests as a guide) but if you work your way through the list and do at least a few of the recommended actions, you’ll be well on your way to a faster site.

Note: If you use WordPress, there are several useful plugins that can automate these tasks for you. Check out the next section for recommendations.

1. Optimize and Compress Images

Large un-optimized images are one of the most common culprits for slowing down websites and it’s an easy thing to change, so this should be number one on your list.

Ideally you should make sure your images are optimized before you upload them to your site (so do this from now on). This means:

• Saving them in an appropriate format (JPG for photos, GIF or PNG for logos and graphics)
• Choosing a compression level when you export them that will result in a small file size without compromising quality too much
• Saving them in an appropriate size.

Saving a photograph as a PNG will result in a larger file size than a JPG and 100% quality isn’t usually needed for web images. Very large images are also only necessary for print – for the web anything bigger than the largest screen used to view your site is a waste of bandwidth.

You can use an online service like smush.it to optimize your images fully without worrying about losing quality.

What about the images that are already on your site? Google PageSpeed Insights has a handy function for optimizing images. After you’ve run the tests, look for “optimize images” in the suggestions summary.

You can then use the link to “Download optimized image, JavaScript, and CSS resources for this page” – this will download images in a smaller file size to your computer and you can then upload them to your server and overwrite the original files. Bear in mind you’ll need to do this for each page on your site.

If you’re using WordPress there are plugins that can help you with this task – see the “Useful Optimization Tools for WordPress” section later in this article for more details.

2. Minify JavaScript and CSS

The same download link will also give you “minified” versions of any JavaScript and CSS files so you can also upload these files and copy over the original versions to reduce the overall size of your web pages. Make sure you have a copy of the original before you do this, as minified versions of code are very hard to read and edit!

You can also use an online tool like minifycode.com to upload your JavaScript, CSS and HTML files and compress them.

3. Optimize Code Inclusions

If you have any JavaScript included in the head of your page, move it to the bottom so it’s processed last.

JavaScript and CSS should also be added as an included file, rather than pasted directly into the HTML code. This allows the web browser to cache it, so the page will load faster when the user visits it again.

4. Remove Unnecessary and Unused Plugins

This is a must-do step for WordPress users as some plugins can be real resource hogs. If you’ve installed any plugins to try them out and not ended up using them, deactivate and delete them.

5. Optimize Your Database

For WordPress users, there are a few different ways you can optimize and clean up your database:

1. Disable WordPress revisions. You can avoid adding entries to your database every time you edit a post by disabling the revisions feature. To do this, add the following line of code to your wp-config.php file: define( ‘WP_POST_REVISIONS’, false );
2. Delete spam comments
3. Clean trash of deleted posts and pages. You can set WordPress to automatically permanently delete after a set number of days by using the code define(‘EMPTY_TRASH_DAYS’, 10 ); in your wp-config.php file (editing the number to however many days you want to keep trash files for.

It can be a hassle to go in and clean up your database of all the junk data manually, so most WordPress users find it easier to use a plugin for the job – see the section on WordPress plugins at the end of the article for details.

6. Enable Browser Caching

Browser caching stores a copy of files loaded on your website the first time a user visits. The next time they visit, the browser uses the local copy instead of downloading them again, which results in significantly shorter load time.

You can control your website’s browser caching settings by adding code tothe .htaccess file (this is a useful guide).

If you’re a WordPress user, it’s usually easier to install a plugin to do this for you.

7. Consider Changing Your Theme

Your theme may look beautiful but it may also be the reason your site is loading slowly. It’s not always obvious when a theme is the cause of site-speed issues but this is easily tested by changing to a different theme and measuring load time before and after with one of the previously mentioned tools (of course you’ll want to make sure you do this on a development server, not on the live site).

If you’re setting up a new site, it’s worth considering a WordPress theme that has been designed with speed in mind.

8. Consider Using a CDN

A Content Delivery Network or CDN is a worldwide network of servers hosting cached copies of your website, rather than a single server as used in a traditional hosting model. When a visitor requests a page on your site, they are directed to the geographically closes server, for the fastest access.

Cloudflare offers a free plan for small personal sites and testing purposes, so it may be worth investigating.

9. Consider Switching Webhost or Upgrading Your Account

If you’ve optimized your site and performance is still slow, your webhost may be to blame. A comparison of webhost speed and performance goes beyond the scope of this article, but it’s something you can research online fairly easily. You may also consider upgrading to a managed hosting plan of dedicated server if you’re currently using shared hosting.

Useful Optimization Plugins for WordPress

WP Rocket

WP Rocket is probably the most powerful and complete optimization plugin and should really be installed on all WordPress sites as standard.

It includes options for:

• Browser, page, database, and object caching
• Minification
• CDN activation

Smush Image Compression and Optimization

Smush is an image optimization plugin that will compress and resize images to reduce their file size. You can use it to process JPG, GIF, and PNG files in any directory, and attachments can be optimized automatically, individually in the media directory, or in bulk.

WP-Optimize

WP-Optimize provides an easy way of cleaning up your WordPress database including removing unnecessary data, and compacting tables. You can also automate optimization to be carried out on a regular basis.

BJ Lazy Load

If you have a lot of large images on a page, it will take a relatively long time to load, even if optimized. To resolve this issue, you can use a lazy loading plugin like BJ Lazy Load. This plugin stops images that are off the screen from loading until the user scrolls down – essentially the images are loaded a few at a time instead of all at once.

Summary and Conclusion

Optimizing your site to the max and trying to shave a few milliseconds of your site loading time can become a bit of an obsession but there’s a balance to be found between the time you spend speeding up your site and your return on investment in terms of increased speed.

For most WordPress users, making use of some of the optimization plugins listed enough will be sufficient to produce a relatively speedy site.

If you feel like your site is loading slowly then it may be worth doing a little deeper investigation but in general, if your site is loading under 2 seconds then you don’t need to worry too much – this is the threshold that Google recommends for e-commerce sites.

On the other hand, if you’re battling competitors for the top spot in the search listings, having a faster site is definitely an advantage and you’ll want to do all you can for that extra speed.