Our website carbon calculator has now been running for a year, estimating the carbon emissions per page on thousands of sites by looking at the amount of data that they transfer on load. We find it really helpful in communicating the carbon impact of the internet to clients and others building the web, and it provides a meaningful metric that drives us to reduce web page weight. We’ve had great feedback from people about it and it’s seeing more and more users over time.
Suffice to say, it seemed to have enough support and interest that we felt it deserved a fresh coat of paint and some refinement. In particular, the user experience had been a pain point in the previous version. Doing the calculation relies on getting a full page load of the website being tested which takes a few unavoidable seconds. We wanted to make this experience smoother and handle any errors more gracefully, making the whole experience for the user more enjoyable and bug free. In addition to a little smoothing of the UX, Website Carbon also deserved a more exciting and engaging identity and the site needed to show that having a light page weight doesn’t mean having a totally static, dull website.
Update to the calculation
Over the last year, we discovered a more up to date paper studying the energy intensity of the web which, due to big improvements in the efficiency of web technology (particularly data centres) and an increase in the amount of energy from renewable sources, means that the amount of carbon estimated for every KB of data has reduced by two thirds! Good news indeed.
Some other things we added:
A showcase of some of our favourite, lightweight websites!
We think it’s really important that the web is beautiful, elegant and enjoyable to use so we wanted to show that sites that are low carbon don’t need to scrimp on these things. Even a large e-commerce site such as Lush UK can be lightweight. We would love to find more examples of major brands leading the way with low carbon websites so please, if you find any, send them our way.
A better waiting experience
Waiting in line is never fun, so along with speeding up the test, we focused on making the wait less boring. Users should always have a visual clue that something is happening, so we added a popup with a progress bar and some facts to help make use of the time. If you have to wait over 10 seconds, the user sees a message saying that the wait is taking longer than expected. This shows them that the site is still active and trying to get their result, hopefully reducing confusion and frustration. Lastly, we added better error handling. Sometimes tests just time out – either due to our API being overloaded or, more commonly, because a site is taking too long to fully load. In these cases, we let the user know and give them the option to try testing again.
Knowing is not enough
We’ve added a section with three simple actions you can take to reduce your site’s carbon emissions or offset it.
The Data (the good, the bad and the extraordinarily large)
After more than 48,500 tests, we thought it might be interesting to look at some stats. We used the new calculation retrospectively here so all the calculations are the same, regardless of when the test was done.
Of those 48,500 or so tests, 17,775 are unique pages. So, example.com and example.com/about are treated as two entries.
I’m going to start with the bad just so we get a sandwich with a good filling…
The Bad
Average CO2 per page view
The average carbon emission per page view is 4.61g.
Percentage of sites using renewable energy hosting
Only 29% of sites tested were on renewable hosting. The data for renewable hosts comes from the Green Web Foundation database.
Let’s say that those sites each get an average of 5,000 visits per month. That gives us an aggregate carbon impact of 276,600kg of CO2 equivalent per year. That’s 1,844 sumo wrestlers of CO2 in the atmosphere.
The Good
Across all the sites that were tested more than once, the average change was a reduction of 0.48g. This surprised me as on average websites on the internet are increasing, not decreasing in size! Stance.agency had the biggest reduction. Between March and October this year, the site lost a whopping 74MB! That’s 138.9g of CO2 equivalent saved every page load.
If those sites have on average 5,000 visits per month, then the amount of CO2 saved across all 10,650 of them that have changed would be 306,720kg per year!
We’ve found a whole load of cute sites that come in at impossibly tiny sizes. These sites are all under 5kb. Most of them under 3! One highlight is the Duck Duck Go Light website which is a totally functional search engine and transfers just 3.3kb of assets on load.
I also love Niklas Jordan’s site. Not least because it includes an explanation of the internet’s energy usage and why he’s chosen to make the site so simple.
Here are some others that caught my eye:
- http://janavirgin.com/CO2/
- http://info.cern.ch/
- http://alexasparks.com/
- https://ja.md/#
- http://davidandkay.me.uk/
- http://x20xx.com/
- https://www.outofoffice.works/
- https://joshangehr.me/
- http://benscutt.co.uk/
The Extraordinarily Large
Sometimes we look at the stats and we see a site that is so large that we can’t imagine how it could achieve such epic proportions. The answer is normally either that all the content for all posts loads at the same time and all the images are uncompressed and full size. The other reason this happens is autoloading video.
This site is number one at the moment, coming in at a huge 190g per page view. Just one visit to this site produces more CO2 than 1000 to our homepage – http://orestreams.com (maybe don’t visit it though)
A perfect example of a design that could be efficient if only the images were resized and posts and images were lazy loaded on scroll. This one produces 152g of CO2 per view – http://sgdi.ch
How we can make a difference
I hope these statistics illustrate just how much can easily be done to reduce carbon emissions on the web while still delivering the same, or very similar experiences, to users. If you are dedicated to helping create a greener web, you may want to check out and sign our Sustainable Web Manifesto, and I’d highly recommend to any web makers out there that you incorporate a check on websitecarbon.com into your build process. Especially when we build on fast connections, bloated pages are very easy to miss but potentially very easy to fix too.
Please do spread the word, and don’t hesitate to email us with any questions or suggestions.
Test your site now: websitecarbon.com