Reduce Your Online Carbon Footprint - Here's How to Build an Eco-friendly Website!

November 18, 2024

4 min

Did you know that you could do your part to increase sustainability by building an eco-friendly or green website?

As we continue to witness the worrisome repercussions of climate change, environment-friendly websites could help save energy and reduce the impact that online usage has on carbon emissions.

According to a report by The Shift Project, it is estimated that online usage accounts for 3.7% of global greenhouse emissions, almost the same amount produced by the airline industry. A staggering number that is expected to increase by year 2025.

As part of the internet industry, at Bejamas we want to do our due diligence and take part in helping reduce energy and carbon emissions. Building greener websites is an easy way to get started, so let's go through what you need to achieve that.

First, let's define what a green or eco-friendly website is.

What is an eco-friendly website?

A green or eco-friendly website is a website that is built utilizing more environmentally friendly practices. This means they use more energy efficient solutions and technologies.

If you want to check how a website is currently impacting the planet, you can use the Website Carbon calculator (And that's not the only one you can find out there. We also think EcoPing is very nifty). Their data shows that ​​the average web page produces 1.76 grams CO2 per page view -- which translates to 211 kg CO2 per year for a website with 10,000 monthly page views.

But it doesn't only come down to page views. Environmentally friendly websites are responsive, easier to navigate, and more efficient than their counterparts. Which in turn, helps to save navigation time -- and energy.

Getting Started: Building an eco-friendly website

Boost your site's speed

The most important aspect to take into account when building your green website is your site's speed.

The least amount of time users spend waiting for your site to load, the least amount of energy and carbon emissions that is used. Here's a helpful video from Google Chrome Developers about making your pages load faster in Chrome.

[@portabletext/react] Unknown block type "video", specify a component for it in the `components.types` prop

I strongly recommend you check out what the Jamstack community has to say and the valuable recommendations they have to help improve speed and in turn your Google rank. (Pro tip: explore and get to know the ClimateAction.tech community - they are super knowledgeable in the topic of tech and the environment)

Talking about improving speed without sacrificing performance, at Bejamas, we proudly helped the team at Backlinko.com in reducing their page's load time. It now loads three times faster! Read all about our project with them in our Case Study: Moving Backlinko to Headless WordPress and Next.js.

Use green web hosting

Data-centers are one of the greatest damaging factors when it comes to climate change as they require an extensive amount of energy to keep all the data they hold. One of the first things to consider when moving towards nonpolluting alternatives is the type of hosting you will use.

Techradar keeps a very thorough and updated list of some of their best ranked eco-friendly hosting sites that you can choose from.

Have an eco-friendly design mindset

Think about design optimization from the get-go. It's time to be mindful about how our website is designed to make sure we're utilizing the least amount of resources that could damage the environment. From reducing the size of your images, to making it mobile first -- there are many decisions that could help in making your design greener.

We can't help but suggest focusing on "efficiency by design" and turning your site into Progressive Web Apps or PWAs to get a more sustainable solution. Not only does it lower your site's loading time but it also works offline -- eliminating the need for internet use.

Note: If you want to read more about how to build a Progressive Web App (PWA) using Jamstack, read our guide.

You also want to make sure all of the elements in your website are well thought-out with sustainability in mind. Take a deeper look into making your site load faster, decrease the use of large graphics, use your code to optimize the site, and choose the right content to include in it.

Work on your SEO

How is SEO eco-friendly? Well, SEO accelerates search and helps users find what they're looking for quickly. By optimizing your site with SEO best practices, you will reduce the amount of searches and the time people spend loading sites.

Make sure you structure your content with the right keywords and headlines, make it mobile-first and provide the most relevant information in a prominent place.

Review our Jamstack SEO Guide for more comprehensive steps to take when improving your SEO.

The move towards environmentally friendly tech

Global warming is affecting our daily lives right now, and deeply risking the future of our planet. We're seeing absolutely crazy climate changes -- from incredible floods to long droughts as well as many other intense weather events. As humans, we can work together to stop that, and it all starts with how individually, you can begin to make decisions and take conscious steps in your everyday life.

As we mentioned above, tech is a huge generator of carbon emissions, and it is important that we are fully aware of that everytime we use our devices to even search for an interesting question. In the end, by being more mindful about the environment and reducing carbon emissions, we're actually investing in ourselves, our family, our health and even our finances.

Start today by just getting informed about the repercussions of our online usage and how we can put our knowledge and skills to stop global warming and climate change.

Building an eco-friendly website may seem insignificant, but it is a step towards more environmentally friendly tech. The good thing is that it doesn't have to be painful, it is mainly about switching things up a bit by being more mindful about user experience and usability. So, really, once you embed these practices into your working process, they will come naturally.

We hope you found this article useful and if you're looking for more tips, tools, and guides on how to be more environmentally conscious when building your website -- we invite you to review our CTO's Thom Krupa's curation of the best climate tech resources available out there.

Want to build an eco-friendly website? We've got you covered - reach out to us!

Authors

Magda T.Magda T.

Share

xata
headless-wordpress
nuxtjs
storyblok
turborepo
render
gatsby
prismic
dato
github-pages
deno-deploy
nextjs
contentful
supabase
vercel
netlify
sveltekit
astro
bynder
strapi
hygraph
planetscale
sanity

Subscribe to newsletter.