Insight
Nobody likes slow internet. Just a few seconds of delay can feel like an eternity to the modern web user who expects everything to happen instantly. Fortunately, broadband internet speeds in the UK have increased more than 10x since 2009 according to Ofcom, now averaging 46Mbps and with 5G on the horizon for mobile data, we should never again need to worry about slow internet. We’ll be able to enjoy richer, more immersive online experiences from any device in any location.
If only that was true. Faster connection speeds do of course deliver information faster, but faster internet creates a feedback loop that limits its benefit to users. As the internet gets faster, web designers and developers have less incentive to use data efficiently, and so file sizes get bigger and bigger. The internet might be 10 times faster, but it doesn’t feel that much faster because average web page sizes have increased at a similar rate. In some cases larger files are used to create more advanced features and richer experiences that were not possible on slower connections, but in many cases it is simply bloat.
In this article, I’ll explain why we need to prioritise performance of all digital services and how doing so is not just good for business, but also good for people and planet.
It’s common for aesthetics to be treated as the priority in web projects, with web performance either being ignored or treated as an afterthought. However, web performance is one of the key factors that impacts the success of a web project. Users expect everything to load instantly, so slow performance results in frustrated users and reduced impact.
A recent study by Akamai showed that for every 100ms delay in loading, conversion rates dropped by 7%. That’s a huge impact from what most people would assume is an insignificant delay. Google also released data in 2018 showing how quickly bounce rates increase with longer load times on mobile devices, with a 1 second load time resulting in roughly half the bounce rate of a page with a 5 second load time. What’s more, Google is increasingly using performance as a metric in its search rankings, so a fast site is more likely to be seen in search results. The thing to note here is that while web designers and marketers are often focussed on design and content, web performance impacts user experience before users even see the page.
When commissioning a web project, whether for a business, a non-profit or the public sector, it’s essential to define why the project is being undertaken and what the goals are. Whether those goals are financial, social or environmental, it doesn’t matter how good the design and content are if slow performance results in users not finding it on Google or giving up when it takes too long to load. Fast websites deliver better results, no matter what you’re trying to achieve.
Average internet speeds might be increasing, but it’s easy for those of us working in digital to forget that there are many cases where people don’t have a fast connection. Think of people living in rural areas, slow and patchy connections on trains, those with limited mobile data plans or people living and working in parts of the world where internet speeds are much lower. By assuming that everyone has high speed internet all of the time, we actually make our web services hard or impossible to access at least some of the time.
This can be a frustration for many but critical for people who rely on access to digital services that assist them with their health, education or livelihood. To illustrate this, the tool performancebudget.io shows that a typical 4MB webpage might only take 1.5 seconds to load on a fibre broadband connection, but would take approximately 3.5 minutes on a 2G connection. How many people will wait for 3.5 minutes?
What’s more, people loading webpages don’t know the size of the page before they load it, meaning that an inefficient web page or app can consume a lot of data without the user even knowing it. That might not matter for those of us with unlimited data plans, but for those on low incomes with limited access to data, using an inefficient service can end up being a costly mistake.
Web performance is therefore the foundation of good web accessibility. Making web services fast and efficient not only improves user experience, it makes it easier for people to access information and services, no matter who they are or where they happen to be.
Faster web services are not just good for people but also better for the planet. The internet consumes as much electricity as the whole of the UK. All of that electricity produces carbon emissions and as our hunger for data increases, so does its carbon footprint. Fortunately, making web services faster goes hand in hand with reducing carbon emissions. It’s all about efficiency. If we can deliver the same content with less computing power and less data transfer, it means that the information can be delivered faster and with less electricity.
Our website carbon calculator has found that the average website produces roughly 2 grams of CO2 per page view. It might not sound like much but when you scale it by the thousands or millions of views each website receives every month, the environmental impact is significant. It is estimated that the internet is responsible for 2% of global carbon emissions and continues to rise. In the current climate emergency, it is essential that we reverse this trend in the digital sector and take leadership in moving web services towards zero carbon as quickly as possible.
Prioritising web performance is a key strategy in reducing internet emissions. A faster web is a greener web!
Creating faster, more efficient digital services can be a challenge that needs a new mindset, but there are some easy wins that greatly improve performance with only a little effort. These can be applied with no changes to the content or appearance of a web page, making it easy to get buy in from stakeholders.
Many content management systems like WordPress, Drupal and Magento generate pages dynamically when a user visits the page. Although this has some technical advantages in terms of content management, it means that the web server is doing a lot of work every time a visitor hits the page, and the user has to wait while it does this work. Caching web pages simply means generating a static version of the page that requires minimal processing to serve to each user, meaning that it can be served a lot faster. Many hosting providers now offer this as a feature and there are off the shelf solutions for common content management systems that are relatively easy to configure.
Many files in their default format are larger than they need to be. Images and video can be compressed with no loss of image quality using tools such as ShortPixel for images and FFMPEG for video. Code can also be compressed meaning that smaller files can be used to serve the same web page.
Likewise, the dimensions of an image or video have a huge impact on the file size. Its common for images on websites to be loaded at the size that they were recorded on the camera, or at a size large enough to fill the full screen, even when they do not fill the whole screen in the web design. As video and images are generally the largest files on a website, resizing them to the size at which they will be used can make a big imrovement to performance.
Not all file formats are created equal and so performance can be improved by using the most efficient file formats. WebP is a modern image format that is now widely supported by web browsers and produces files significantly smaller than JPEG, PNG or GIF. For simple graphics and illustrations, serving the image as a vector based SVG file can be a lot smaller (and therefore faster) than serving a regular image file. The same applies to fonts, where the modern WOFF2 file format can deliver the same font in a much smaller file.
As mentioned at the start of this article, there is a temptation for web designers and developers to be less careful about the use of large files as internet connection speeds get faster. This has led to more and more bloat on websites.
Examples of bloat include code libraries that contain features that aren’t actually used, old code that isn’t used anymore, images that don’t add value to the user, and tracking scripts that harvest data that isn’t actually needed. The approach to modern web design and development is too often, “if in doubt, throw it in” whereas it should be “if in doubt, leave it out”.
The above strategies are quick wins that can improve web performance without making any noticeable changes to design or content, but even bigger gains can be made if web performance is treated as a priority from the outset of a new web design project. The project team can set a performance target and plan how the visual design and the technology will be optimised to achieve the required performance level. Every design and technical decision should be validated by asking “Will it make the site load faster?”. By using performance as a lens from the outset, it can lead to radically different solutions that naturally perform better.
It’s clear that a faster web is a better web, but we only get the full benefits of accelerating connection speeds when we prioritise efficiency and web performance in design and development. Many of the benefits are easy to achieve and result in web services that are not just faster but more accessible, rank better in search engines, convert better and have a lower carbon footprint.
And what’s the cost of all these benefits? Very little. There are some things that need an upfront investment of time from the design and development team but many of the big wins can be achieved with surprisingly little time and money. The bottom line is the web performance is good for people, planet and profit.
Wholegrain Digital were a finalist in the ‘Sustainability’ Category at the 2019 Impact Awards.
