All websites should be designed for slow internet on the train

Written by Tom Greenwood - September 20, 2018

Internet speeds keep getting faster, and with high speeds come new possibilities of what we can do online. 10 years ago, the average broadband internet speed in the UK was just 3.6Mbps and mobile internet was significantly slower.

The average broadband internet speed in the UK is now 46.2Mbps, more than 10 times the speed it was a decade earlier.  Mobile internet has progressed even faster, with 4G providers claiming speeds now coming close to wired connections. With such high speeds available on any device, we’ve come to expect to be able to load web pages, apps, and even videos whenever we need or want without delay.

It’s now hard to remember what it was like 10 years ago, when we were far less dependent on the internet in our day-to-day lives.  We may have dreamed of faster internet, but we also accepted that good things come to those who wait.

Faster internet is deceptive

There’s no doubt that, broadly speaking, higher internet speeds are a good thing. They do, however, have a few side effects that limit their benefit.

Side effect #1 – Shifting expectations

Higher internet speeds raise our expectations of how quickly we should expect content to load.  When I was in my teens, it was normal to dial into the web on a 56k modem with its screeching and whirring, and then wait an eternity for each page to load. We didn’t mind because our only point of reference was not having the internet at all. Slow internet is way better than no internet.

However, luxury is a one-way street, and as speeds increased, our baseline of what how long we considered it acceptable to wait for content shifted downwards. Fast internet has accelerated our hunger for information and made us more impatient, even if we only have fast internet some of the time. The result is that we have become data diva’s and will no longer tolerate waiting, even when on slow connections.

Side effect #2 – The feedback loop

The second side effect is that while fast internet has changed the attitudes of web users, it has also unknowingly changed the attitudes of web designers and developers.

Fast internet allows us to create more elaborate, media-rich experiences. We can use more video, more animations, bigger images (and lots of them) and integrate social feeds, tracking scripts and custom fonts.  What’s more, we can get away with being more lazy and loading in libraries containing stuff that we don’t actually need.

In some cases, higher internet speeds can be a fantastic opportunity to push new boundaries and create genuinely better experiences online, but there’s a real risk that we get sucked into the feedback loop and use up the extra speed without even thinking about it.

“The internet is faster, so we can now load bigger files”

That’s the attitude that many of us have, even if only subconsciously.

Fast internet is like an all-you-can-eat buffet for web designers and their clients, and our websites are packing on the pounds as a result.

According to httparchive.org, web pages have tripled in size since 2010, eroding some of the benefit that users get from increasing internet speeds. The internet may be 10 times faster than it was a decade ago, but it only feels 3 times faster.  On top of that, our increasing consumption of data has led the web to be one of the fastest growing sources of carbon emissions.

Imagine a web that is three times faster than we have now and has a third of the carbon emissions.  That’s the opportunity that we are missing out on.

Did you spot the contradiction?

There’s an inherent contradiction between people’s desire for increasingly rapid information and the tendency of web designers to add ever increasing amounts of bloat to their web pages. The reason that it isn’t so obvious is because average internet speeds have increased faster than page sizes.

This makes the problem of bloat and inefficiency somewhat invisible to web designers, who by nature of their profession and interests tend to have high speed broadband connections. But web designers are not typical web users. Typical web users do not have the latest hardware and the best connection, sometimes for reasons that are out of their hands.

By building websites for the best case scenario, we’re creating poor user experiences for those with anything less.

Should we design for average speeds?

OK, so not everyone gets peak internet speeds all of the time, but that’s why we should design for the average.  Right?

Well, no actually.

It’s easy to believe that designing for average internet speeds rather than peak internet speeds would allow us to cater for the majority of people, but the reality is that nearly all users are affected by poor connection speeds at some points in their lives.

By designing not for the average, but for those outliers at the margins with the slowest internet, we can create more positive online experiences for everyone in every scenario.

The easiest way for us as web designers to empathise with people who have slow connections is to stop and think about scenarios where we personally suffer the frustration of slow internet. Perhaps you’ve experienced poor internet at a conference, on holiday, on the train, or at your grandma’s house in the countryside. I’ve certainly experienced all of the above.

How fast (or slow) is train WiFi?

Taking train WiFi as a common example, anyone who’s tried to use the internet on a train will know that the experience varies significantly, from mildly positive to incredibly frustrating. When using the internet on the train, it also becomes quickly apparent that some websites are much easier to access than others.

A ladies hands type on a laptop while on the train
We cannot assume that those using mobile internet or WiFi on trains are viewing the internet on smart phones

Out of curiosity, I recently used the Ookla Speedtest app to run a series of speed tests on my standard train journey to London with South Western Railway. I compared the onboard South Western Railway WiFi service with my Vodafone mobile internet connection, and I got the following results.

Both connections were somewhat patchy and dropped out on numerous occasions.  However, when I did manage to connect, I found that the South Western Railway WiFi was fairly consistent, ranging from 1.03 to 1.31Mbps with an average of 1.11Mbps.  The Vodafone connection on the other hand was extremely volatile, peaking at 26.2Mbps near Clapham Junction and plunging to a low of 0.15Mbps somewhere in the Hampshire countryside, averaging 6.56Mbps.  Significantly, it never reached 1Mbps on any test conducted in rural areas.

To put it into perspective, BBC.co.uk has a page size of 2.46MB (19.68Megabits) at the time of writing.  As a quick estimation it would therefore take roughly 19 seconds to fully load on the slowest on-board WiFi speed, and an intolerable 2 minutes 11 seconds on the slowest mobile speed that I recorded. Even on the average mobile connection speed, which was highly skewed by the high speeds within London, the page would take 3 seconds to load.

How small do web pages need to be?

Lets use that same back of an envelope calculation the other way to see what page size would actually be acceptable on the slowest connection speed.

To achieve a 3 second load time for BBC.co.uk on the slowest connection speed of 0.15Mbps, the page would need to be no larger than 56kb. Taking 0.15Mbps as an sample speed might seem extreme, but it is approximately the speed that anyone on a 2G connection will be receiving. It therefore actually represents reality for a lot of people in a lot of situations.

I’m not suggesting that every web page needs to be limited to 56kb.  It would be nice, and certainly would help minimise keep the internet’s carbon emissions low, but even an idealist like me knows that it isn’t realistic.

However, I am highlighting the fact that there are real day to day scenarios where users want or need to access information and they do not have the fast connection speeds that most websites are now designed for.  It is therefore essential that we plan for these scenarios and set realistic limits on page size for projects that we design and develop.

The exact page size that’s feasible will vary from one website to another depending on what it is trying to achieve and for who, but we should remember that small is a good.

When we designed our new website we knew that it would be hard to achieve the levels of efficiency and speed that we wanted and so we took a phased approach, initially setting a page weight budget of 440kb and then setting a second stage target of 200kb.  The final push is to simply see how much further we can push it.  It is easy to say that our website has a load time of around 230ms according to GT Metrix, but if we actually throttle the connection down to simulate a 2G connection then it takes 10 seconds.

Perfect? No.

Tolerable?  I think so.

How can we do it?

The reality is that in most cases we are going to have to accept some level of compromise between catering for slow connections, and creating meaningful and pleasurable experiences for everyone.  The reality is that although there are sites such as our website carbon calculator with really small pages, many other sites have legitimate reasons why they can’t be quite so small.

The key word here is efficiency.  To find the balance, we should ask ourselves the following questions:

  • What do users actually need? Everything else is optional.
  • In what scenarios might visitors experience slow connections?
  • How slow is slow?
  • What load time would be tolerable to these users?
  • What would be great for these users?

We’ve now got a some parameters around which you can design a solution, build it, validate it and then optimise it.

Let’s create a culture of efficiency

As web professionals, we should be giving efficiency far more priority and embedding it in the culture of our industry. By doing so, gains in internet speeds will create genuinely faster and more accessible user experiences, rather than just giving us an excuse for more feature creep.  What’s more, we can deliver meet peoples needs with less energy and fewer carbon emissions.

By designing the leanest, most efficient solutions and prioritising the loading of essential information ahead of trivia and bloat, we can deliver better experiences for everyone.

That surely can only be a good thing.