Nobody likes a slow website! In this day and age, with general household internet speeds reaching up to 50mb, a slow website can be extremely frustrating to use and cause most users to give up and go elsewhere. Also, Google has now announced that site speed is now a factor in organic rankings, all the more reason to take some action into speeding your website up. Here are 6 ways to improve site speed and ensure you keep your customers engaged and not frustrated.
The first and most important, get some decent hosting. Having decent hosting is like building strong foundations when you build a house. Strong foundations and you can go on to build a strong house, weak foundations and your house will never be as strong as it potentially could be. Buying a £2.50 a month shared hosting package from *random unknown hosting provider* is not going to give you the best foundations to work from. You can only do so much to speed a site if your hosting is crippling your site speed from the start.
This article goes into great depth, testing various hosting company speeds and analysing the results to help you decide which hosting company to go for.
2) Eliminate any unused plug-ins
Minifying the files removes all line breaks and spaces from the files, thus producing a smaller file size.
Combining CSS and JS files reduces the number of requests to different files your server has to make every time a page is loaded. For example, this site had (NUM) before combining and (NUM) after.
4) Optimize images
Make sure all of your images are a suitable file size for web. Anything too big and they will load slow, especially when not on WiFi. If you are using Photoshop, use the Save for Web option when saving images and lower the compression to as much as you can get away with.
If you are not using Photoshop then this online tool will compress images for you. This is especially useful if you are taking images straight off your phone as they tend to be quite large files.
If you are developing in WordPress make sure you use the custom thumbnail size functionality. This allows you to create different image sizes (dimensions) out of one uploaded image. You can then call your custom thumbnail sizeÂ within template files which will pull in the smaller image rather than pull in the full size version and resize it on page.
5) Leverage Browser Caching & gZip Compression
Enabling Browser caching allows your browser to serve up cached versions of files for a defined amount of time. This means that every time someone views your site the browser doesn’t have to get all of the files from the server, consequently taking one element out of the page load, reducing load time.
GZip compression is simply a form of file compression. Making files smaller means a smaller overall page to load.
To enable both of the above, add the following code to your .htaccess file…
## EXPIRES CACHING ##
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 1 month"
## EXPIRES CACHING ##
## GZIP COMPRESSION ##
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/opentype
# For Olders Browsers Which Can't Handle Compression
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0 no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
As you go through the process of speeding your site up it is a good idea to do some testing along the way to create a marker, and also see what is and isn’t working. The 2 main ways of testing I use are tools.pingdom.com (make sure to test from the same place every time to ensure a consistent result) and developers.google.com/speed/pagespeed/insights. Both give you clearly displayed results as well as tips on how to furthermore improve your site speed.
These are just a few things you can look at if you think your site is a little sluggish. There are many more factors and things to try, if your stuck and could do with a look over your site to see if there is anything that could be done to speed it up then get in touch.