Site speed is now a Google ranking factor (and has been for a while), and a fast site is one that visitors will spend more time on. So it's well worth taking a bit of time to ensure that your site performs well.
In short, the amount of time it takes for your site to load depends upon the amount of content on the page, the type of content, and the speed at which all of this can be bundled up together and sent off.
There are other factors (for example, the speed of your visitor's internet connection) that you can't do anything about. Below are the most common problems that you can actually control.
Tip – there are lots of free tools that you can use to quickly check your site's speed. www.webpagetest.org is one, another is Google's page speed insights. Both may require a bit of techie knowledge to completely understand but could give you a quick heads-up if.
By far the single largest chunk of data that makes up an average web page is imagery and it's vital that they are properly handled.
Poorly compressed images
If you don't know what you're doing, it's easy to end up adding massive images to your website, which drag out load times, without realising it;
I was once emailed a 50MB, 2 page PDF document. After reviewing the compression of images used in the doc, the size of the file went down from 50MB to less than 1MB!
An image which has been carefully compressed is a fraction of the size of the same image with poor compression.
This is easy to fix and a good online tool for doing so is https://compressor.io/ (although there is a massive range of software out there which does the trick, and most designers use Photoshop's “Save for web” feature).
The wrong image format
Web images come in a range of different formats, commonly PNG, GIF, or JPEG. Each format has different strengths and weaknesses. Again, using the wrong one can result in huge or low-fidelity image files.
As a rough guide you should use a GIF or PNG file for logos and diagrams, and a JPEG with 60% - 80% compression for photos.
In more detail:
PNG: Great for images with large areas of solid colour and sharp transitions between colours. When the image is a logo, or a diagram, PNG will probably provide excellent quality with minimal file size
JPEG: Ideal for photography. When saving a jpeg you need to specify the level of compression to use. More compression equals less file size but poor image quality. Less than 60% and the distortion resulting from over-compression becomes quite obvious – more than 80% and there's lot more file size for little apparent quality improvement. But you need to experiment as different images tolerate compression better.
GIF: Good for logos and diagrams – you'd use a GIF in the same kind of situations as a PNG. However GIF images are limited to a pallet of 256 colours and handle transparent images poorly (you'd notice this is your image was semi-transparent, allowing the background to show through). Generally speaking, we'd suggest a PNG instead – unless the image is animated, in which case GIF is the way to go.
Too many images (hello slideshows)
Image slideshows (or image "carousels", as they're also known) are the scourge of download times.
Packing your home-page carousel with your ten best images might seem like a good idea. After all, only one image has to be loaded at a time, right? In fact, many carousels require that all the images are loaded, even if the user only ever sees one of them.
Our recommendation is to avoid using more than 3 images in your carousel. If you have to do that, perhaps look into having the page load them on demand (speak to your developer).
Twitter, Facebook, Instagram all provide snippets of code (“widgets”) that a non-techie can paste into their site. For example – to add a Twitter feed to a website sidebar.
But these widgets often require the download of a lot of data for your site visitor. The Twitter feed widget is a particular culprit; especially if it's also configured to display images in your Twitter feed, since the visitor has to load every image in the twitter feed (some of which may be large and over which you have no control) in addition to those that are part of the actual page.
Even an apparently unobtrusive “Share” button, can be rather costly in terms of page speed due to the amount of code that is downloaded “behind the scenes”.
In most cases, a developer can replace these widgets can be replaced with more lightweight alternatives that provide the same key functionality.
3. Cheap Hosting
When someone enters your web address into the browser, the server assembles your web-pages and then sends them across the internet to be viewed.
The power of the server plays a part in how quickly the pages can be put together and sent off. This can particularly play a part on more complicated sites, with a lots of "dynamic" content and pages that have to be generated "on the fly" from different sources.
4. Poorly Configured CMS software
Modern CMS systems have a lot going on “under the bonnet”. Even a simple site usually involves numerous database queries before the web-page can be constructed and downloaded.
Fortunately, modern CMS' usually come with a variety of performance options to speed things up. For example, by “caching” pages once they have been assembled and sending the prepared version instead of constructing it afresh each time.
It may be that your developer has not configured the relevant performance and caching options – ask them to check.
If you'd like us to take a look at a performance issue, please get in touch and we'll be very happy to take a look.