Tune Your Performance
Performance is critically important in this age of shortened attention spans. The longer your page takes to load, the more visitors will give up and try somewhere else instead. Slow performance stops people waiting for your site on first visit, stops people returning to your site and also impacts your search engine rankings leading to a further reduction in traffic. These directly impact the perception of your brand and your bottom line. Some performance issues will be very specific to your website and the technology you use on it (particularly if you have web developers writing code for your website), but there are a lot of general performance options and concepts that every website should at least be aware of and, unless there are very good reasons not to, should use.
Top 5 Performance Recommendations
Here at Tune The Web I'm aiming, first and foremost, to give practical and useful advice that website owners can use. With that in mind I have prepared this top 5 list of performance recommendations I think every website should consider as a first step into securing your website:
Measure your current performance
Gzip your content
One of the easiest performance improvements is to gzip your content. This basically involves your web server zipping up your files when requested, sending this smaller version across the network, and then your web browser unzipping again. This may sound like a lot of work, but with the network usually being the limiting factor (particularly on mobile) rather than processing time on either end, huge performance improvements are possible by setting this up. You can save 70%-90% of network traffic for text files with compression. This save transfer times (making your site faster) and also bandwidth costs for both your users (few people are on unlimited internet plans on mobile) and you (depending on how you pay for your usage on your site). Every modern web browser has supported gzipping properly for well over 10 years, and they will tell your web server if it does so your web browser will only send gzipped content where it needs to. 81% of web resources are compressed, so if you are not using gzipped content then you should have a very good reason for this. Learn more about gzip.
Set up caching
"The fastest HTTP request is the one not made." is a well known quote in the web optimisation community (though no one seems to remember who said it first). When a web browser requests a web page, or any other resource, your web server can send back caching information through HTTP Headers designed specifically to improve performance. This tells the browser how resources can be saved and reused again, saving the request and download time the next time it needs that resource. You will likely have a lot of common content on each page (your standard header, your site logo, some standard CSS...etc), so if you do not cache data then, as visitors browse around your website they are downloading the same resources, over and over again. This slows down their browsing and uses up valuable networking resources - using up any internet bandwidth limit they have, and any download bandwidth that you may have to pay. Setting up a caching policy on your web server is one of the kindest things you can do for your web visitors. The main downside is that it complicates when you do want to change content but there are ways around this. Learn more about caching.
Images make up 62% of average websites. So, as the largest resources used by far, they are one of the first places you should look to optimise. High quality photos can look very impressive on a website, and some devices have very detailed screens, but if half your visitors give up waiting and go somewhere else, then there is little point in having them. So make sure you are using the correct image format, and optimise your images to ensure they are as small as possible without losing quality. Also consider how to handle images on different screensizes and resolutions. Learn more about tuning images.
Optimize for mobile
Mobile use has overtaken desktop usage and is only going in one direction. Smart phones are incredible devices and, in many ways they are more modern, and standards-compliant than the desktop browsers most users use making them easier to program for in some ways, but in other ways they are extremely limited. While screen size is the most obvious constraint, network limitations (in terms of speed, latency and cost to users data plans). So designing for mobile takes special consideration. In this day and age you need a mobile friendly website - either as a separate website or, as is increasingly common, a responsive website that adapts to smaller screen size. However it's important you truly understand the term "mobile-friendly" and don't just concentrate on screen size. Aim to make your website as lean as possible, particularly in terms of resources downloaded. This will also improve your website overall even for non-mobile users. In fact in the last few years there has been a trend towards "mobile first" websites with the thinking being that concentrating on what you would put on a more limited mobiles sites, will lead to a better overall website.
Performance is one of the most important aspects of your website. Web browsers are fickle and will move off to the next website and, unless you have a completely unique idea, there will be another website that they can move on to. Improving performance is better for your users, can reduce both their and your internet costs, and has huge SEO benefits meaning people will be able to find your website easier in future. Luckily for you there are some well known ways of improving performance, some of which are listed above and which will be expanded on as time goes by. Some of these (e.g. setting up gzip) are very easy and require little or no maintenance after you've set them up, some (e.g. caching) may require a little more thought and some (e.g. optimising your images) may require you to put better processes in place for how you upload content to your website but the upsides are huge.
There is a huge community of performance experts on the internet, including people like Steve Sounders (pretty much the original web performance evangelist), Ilya Grigorik (of Google and W3C) and Lara Hogan (who has very kindly put her entire Designing for Performance book online for free - though I recommend buying your own copy and reading it cover to cover!), all of whom are working tirelessly to improve the internet and make life better for us all.
This is also an area that is constantly changing. HTTP/2 is one such change that is just coming into the mainstream and promised to dramatically improve performance as well as removing the need for a number of work arounds.
This page only touches on some of the more obvious and basic ways of improving web performance that people like them have suggested but the hope is to point you in the right direction for where to start with performance improvements and also build up this website with more and more links and information as time goes by.
Want to read more?
This page was originally created on and last edited on .Tweet