Websites consume electricity - and a lot of it. To be precise, 416.2 TWh per year. To put this into perspective, that’s about 2% of all CO2 emissions across the world, or an amount roughly comparable with the entire aviation industry.
It’s a tough connection to make - the fact that something as innocent as browsing the Internet could emit carbon. After all, it exists in the “cloud” does it not? The truth behind this is a bit more complicated.
The carbon footprint of each individual action we take online is small. But, with over half the world population (4.9 billion people) touting Internet access, the overall effect is massive.
How do websites consume electricity?
Calculating the exact amount of carbon emitted per click can vary significantly, depending on factors such as the device you’re using, the data centre you’re accessing, the architecture of the website you’re visiting, and—most importantly—where the electricity to power the website stems from.
We can summarise by saying that websites consume energy in three ways:
- The data center in which we are storing our information.
- Transferring data from the servers to your machine.
- Directly, depending on the time a user spends on a screen.
How can we make websites more energy efficient?
There are three areas in which we can work to optimise the energy usage of our web experience:
- Design & Content: When we talk about website energy consumption, it’s easy to chalk everything up to technology. However, energy efficiency can be improved if we also focus on areas such as SEO, copywriting, UX, font selection and reducing the use of photos/videos.
- Development: The areas for improvement in development norms are vast. Writing clean code, using less JavaScript, optimising images and fonts, and building static web pages are a few notable points to focus on.
- Web hosting: As we explained above, it’s important to select the optimal data centre to optimise website speed and energy efficiency. Focus on using server catching, choosing a host with a high PUE (Power Usage Effectiveness) rating, and using data centres close to your users.
In order to help companies in their sustainability journey, PALO IT has developed its own tool to measure the carbon footprint of different types of digital products. We’re trailblazers on the topic of reducing energy consumption from websites, but it’s important to walk the walk, not just talk the talk.
With that said ,we decided to self-test our own website. What we discovered is that the data transfer volume was way above average. Uh oh 😮
Through further evaluation, we measured and realised some of the images were unnecessarily heavy, thus affecting data transfer and loading speed. This caused users to spend more time on a screen before finding what they were looking for, thereby greatly increasing energy consumption.
Digging deeper into this problem, we realized there were several issues with our website visuals. Namely:
- Not up to date: Images were uploaded to the website some time ago when there was not enough knowledge on the effects of different types of formats on energy consumption.
- Format: The format of the images didn’t have the right compression, back then there was no browser compatibility with the latest image formats, such as WebP.
- Size: Most of the hero images were much too big, surpassing the resolution of the vast majority of screens.
- Team knowledge: Back in the day, when the images were uploaded to the website, the team responsible for doing so didn’t have enough knowledge to differentiate between web images and images destined for printing.
After tracking down the relevant data, and pinpointing the issues, we were able to set the stage to make improvements.
Improving the energy efficiency of palo-it.com
Once we identified the root cause of our excessively large energy consumption, we took action and focused on two aspects:
Image optimization
As a first step we generated and downloaded a csv file with all image titles, their size and url addresses. Some of the images were indeed, huge. The problem is that with over 200 images in total, downloading and optimising each of them by hand would have been quite troublesome and inefficient. On top of that, the majority of the images weren’t actually an issue, so we had to set a threshold to focus on those which really needed treatment. We set a limit of 5mb in WebP format.
With the help of our tech team, we were able to design a custom script to follow this process:
- Download all targeted images.
- Optimise the size, and reduce the unnecessarily high resolution by converting into WebP.
- Upload image to the same location.
We executed the script and—after checking on different screen sizes—everything looked fine. But looks can be deceiving! We went back to our in-house sustainability tool to check and compare more accurately.
There was indeed a considerable reduction in energy consumption, making the website 40% lighter, and saving 6Kgs of CO2 per each 1,000 visits. This translates to:
We were happy with the success. But, manual work is never the way. Rather than discover this same issue months or years down the road, we prepped ourselves for the future...
Guide for future image uploads
To make our solution sustainable we also created a set of image upload guidelines serving as benchmarks for our marketing teams.
Interested in the content? Here’s a taster:
- Think - is it necessary to upload this picture/animation? Is there any other route we could take to get this idea or concept across? If not, move on to point 2...
- Is the image optimised for screens? Carefully check the dimensions of the image to see if we are adding an image with the proper resolution.
- Is it in the right format? From now, we’ve committed ourselves to WebP, which is the recent industry standard. WebP lossless images are 26% smaller in size compared to PNGs and 25-34% smaller than comparable JPEG images at equivalent structure.
- Is this size excessive? Our threshold is 5mb per image/animation. If it surpasses that, it warrants further compression.
Following these points, we’ve ensured we’re keeping the energy consumption of our website to a minimum.
It may seem like small potatoes, but in the long run, optimising your website in this way is crucial for environmental purposes, for user experience, and for branding. Nobody likes a laggy, slow-to-load web page, and no one likes pumping out unnecessary carbon emissions – so addressing this is killing two birds with one stone.
This type of action is a microcosm for the projects we tackle at PALO IT – marrying profitability with sustainability.
Are you thinking about energy efficiency at your business? Or at least seeing where you stand in terms of carbon emissions? Get in touch with our team, we’d love to learn more about where you’re coming from, and what we can achieve together.
