Digital Ecology: How Can You Mitigate the Carbon Footprint of Websites?

Hi, I'm Katarzyna. And today I'm going to talk about digital ecology and how to mitigate the carbon footprint of websites.

So what is digital ecology? It's a field of study about the interdependence of digital systems like the internet and the natural environment.

So long story short, everything we do online and what we do offline with our devices generates carbon footprint. But to be clear, digital ecology is not about stopping people from using the internet. It's all about using more sustainable routines that help to mitigate the carbon footprint of the ICT industry.

So how does the internet emit CO2? It all starts with data collection with servers, data centers, and the cloud. Then we can think about the data transfer and power lines. And last but not least, end devices. At each of the steps, we have to think about powering all these devices, all those data centers, and cooling them down. We also have to mention the energy and the natural resources needed in manufacturing the end devices.

So is it important? It quite is. The ICT industry stands for 4% of all greenhouse gas emissions. What can we do about it? Let's talk about websites. Every day, 250,000 new websites are being published. And each of those generates 1.8 gram of CO2, what sums up to 216 kilograms of CO2 annually.

Have you ever wondered how much CO2 does your website produce? You can quite easily check it by using one of the most popular tools online called Website Carbon Calculator. And it helps you with the formula to calculate what is the amount of CO2 that is being generated. It takes into consideration the website size, the end user traffic, and the average global energy emissions.

So how can we create more sustainable websites? There are quite many techniques. Let's start with programming languages. So by using javascript or typescript, we can make our website much less heavier than by using a platform like Wix or wordpress. We would also have more control over the code, and thus we can leave some unnecessary parts of the code. When thinking about libraries, ask yourself the question, do I really need all of those? Maybe there are some lighter libraries that you could use, or maybe you could just use the built-in fetch or just try writing those comments in plain javascript. Think also about calls to external APIs and about caching the data.

And when it comes to resources, there are three main things that you have to consider. So images, videos, and fonts. When saving images, use svg or WebPi as the formats. Videos, save them always in WebM. And fonts, of course, it's much better to use system fonts than those hosted online. And if you are saving them, use WOFF2 instead of the TOFF. And by using just this simple know-how, you can mitigate the carbon footprint by 70%.

It's also good to have your website in a dark mode. And when picking a host provider, take a look at the power usage effectiveness of the data center and read also their behavior policy. Last but not least, user data collection is also an important topic. And this refers to data collection, user tracking, and personalized ads. So why to do all these? First, of course, we can mitigate carbon footprint and thus we can save electrical energy. But this also results in shorter loading time for your user, which is so essential, and better seo. Together with my team, we develop Equalint, which is, as the name just says, a linter. It proposes possible code improvements to mitigate the carbon footprint of websites, making them basically more sustainable. And here you can see an example of how it looks like. Eventually, by using Equalint, it will be enough to just click on it and then your whole website will turn into its more sustainable version. This is the list of features that we are currently developing, and those are marked in blue. And in violet, we mark these that we still want to develop. We hope that by using Equalint, we'll be able to save up to 88% of carbon footprint that is being generated by websites. And to get started, first download Node, and then try to install Equalint and Equalint Style. So Equalint Style is for css and other css-like languages. Initialize the configuration and run Equalint. Equalint is an open source tool, which means that it's free for all to use. And if you would like to, feel free to contribute.

My name is Katarzyna, and I'm the co-founder of Equalint.

Feel free to reach out to me on LinkedIn.

And if you like the project, you can leave a star on GitHub or reach out to me and let's start collaborating.

Thank you so much for your attention.