6 ways to speed up your website
May 11, 2018, 9:48 AM
Rendering speed of websites is a hot topic again. Or, it should be, since Google will start rating websites in mobile search using speed as a factor in July 2018. It is time to scrutinize your site, test its rendering time, and fix the issues that pop up.
Not too long ago, everything was fine as long as your website was accessible on mobile, no matter how long it took to load. These days that is unacceptable. According to a study by Google in 2016, 53 percent of the users will leave a website that takes longer than 3 seconds to load.
As a designer, you need to seriously consider speed as a factor when making design decisions. If you don't, you're jeopardizing the website’s ranking on Google mobile searches. In July 2018, Google will start to rate websites in mobile search using rendering speed as one factor. It’s no wonder, therefore, that improving speed was one of the key subjects at Googles CRO workshop, which I attended last February.
We're not as good at speed as we think
Finland, Sweden, Norway, and Denmark are all ranked among the top 10 countries in the world when it comes to connection speed, but interestingly enough we're rather bad at creating pages that render fast.
Part of the reason is that as designers and developers of websites, we usually have access to high speed Internet at all times, and we tend to test our website’s performance on the net we're using. During the workshop, there was only one team that had a page that rendered in 5 seconds or less. Some teams had pages that rendered in 15 seconds, and the vast majority had pages that rendered in 20 seconds or more.
If you haven't done it already, it is time to do a reality check of your website’s load time. There are a few different services you can use; in the Google workshop we used webpagetest.org. The important thing when testing is that you test on 3G Fast for Northern Europe and the US, and 3G regular for Southern Europe. Even though the 4G network is expanding, it is still not working well outside of major cities. I live in Vihti, only 40 kilometres outside of Helsinki, and we don't have access to 4G at home.
To actually get an understanding of how well your website works, you need to test it on connections that are not ideal, since that will be the reality for many of your users.
No one will complain, if your website loads instantly in an area with a good connection, but those in a more remote area will feel let down if you don't keep them in mind when designing and developing your site.
How do we fix speed on mobile devices?
There are a number of things you can do to improve the rendering time of your page.
Start with a performance budget, and aim to make your page weigh less than 1 Mb.
To achieve this do the following:
- Compress the images. Test what works and make them as small as possible without compromising the quality of your website.
- Remove the images that are not crucial to the page.
- Shorten pages. What can be removed? Is it necessary to ask your customer to sign up for a newsletter?
- Ask yourself – is a video really important? Does it increase the conversions? A/B test if you’re not certain.
- Cut all the scripts that you don't need. Don't let an analytics tool you're not even using stay plugged in. Decrease the amount of server calls.
- Do not use a automatic image carousel on your page. This is old news, but we still see those hero banner carousels. They are a bad idea for so many reasons, but the most important one is that they slow down the load of your page.
For an e-commerce website, cutting the load time from 15 seconds to 7 seconds can improve the conversion rate by 24 percent.
In the project I am currently working on, we have identified the pictures on the website as a problem. Finding out that there is a problem isn't fun, but if we know what we can improve, we can focus our efforts on it. Finding a problem means we can solve it and create a better experience to our users.
If you're not working on an e-commerce website, you can still use speed as one of your KPIs and take a look at what you could improve. The change in rating factors by Google on mobile search affects everyone, and you still have some time until July to fix the speed.
Annika Madejska is a Designer at Nitor with a passion for interaction design and user research. She doesn’t quite understand the concept of “spare time” as she is currently studying full time for an additional university degree in informatics while working. She also does historical re-enactment where she likes to focus on textile crafts and recreating pages from illuminated manuscripts.