Greening Our Digital Footprint: Sustainable Web Design

Our series on greening our digital carbon footprint continues today with a deep dive into all things sustainable web design. As nonprofit organizations, we rely heavily on our online channels to communicate our vision of change and share our work with the broader community. Our mandates are often driven by values such as inclusion, equity, and sustainability, and the emerging best practices we’ll be covering here today offer yet another way to deepen that commitment by extending it to our digital identity as well.

What Is Sustainable Web Design?

According to the world’s first sustainable web design hub, “the internet currently produces approximately 3.8% of global carbon emissions, which are rising in line with our hunger to consume more data”. Because of this growth, it is estimated that communications technologies will emit more carbon by 2025 than any country except China, India, and the U.S. That’s a lot of carbon!

There are a number of strategies we can turn to to mitigate the growing rates of CO2 emissions that accompany increased online access and data consumption, and this series will touch on many of them. Today, our focus is on sustainable web design because it is a part of the puzzle that many nonprofits can tackle easily and at little additional cost.

At its simplest, “sustainable web design is an approach to designing web services that puts people and planet first. It delivers digital products and services that respect the principles of the Sustainable Web Manifesto: clean, efficient, open, honest, regenerative, and resilient.”



MightyBytes takes this definition one step further by describing sustainable web design this way:

Sustainable web design is a hybrid blend of environmental conservation principles and performance-based web and usability standards. These practices can be applied to the life cycle of any website, app, or online media to maximize efficiency, increase usability, and improve performance. Sustainable web design can also reduce the environmental impact of your digital products and services through green hosting, carbon measurement and reduction, minimizing electricity use, and so on.


Why Is Greening Important?

Sifted, a new media hub for innovation and entrepreneurship hosted by the Financial Times, reports that “when it comes to the web’s data consumption, uncompressed images and messy code may not be the obvious culprits. Gaming (which uses 40-150MB of data per hour), TV streaming (3GB per hour), Zoom calls (up to 1,000g CO2 per hour) and — most concerningly — cryptocurrency mining all hog energy at far more alarming rates.”

At the same time, investing in greening your organization's online presence by following the latest sustainability best practices is an effort that can quickly add up to make a significant contribution for the better. Think about these stats shared by MightyBytes:

“An organization’s digital footprint grows as it produces content, launches websites, shares marketing updates, hosts virtual workshops, upgrades cloud accounts, and designs more apps to meet evolving business needs. As an example:

  • A single email with a photo attachment can emit as much as 50 grams of CO2e. (e = “equivalent” to include greenhouse gases beyond just carbon dioxide.)

  • While that may seem like a small amount, think about how many emails your organization sends every day.

  • Now, multiply that by every digitally-enabled organization in the world.”

As they go on to write, the problem extends to more than just email. Many organizations don’t have well-established or regularly updated data management systems in place, and often that results in “millions of websites cluttered with unread blog posts, broken links, bloated images, and out-of-date content.”


Tips & Tricks for Greening Your Website

There are a number of steps your organization can take to start greening its digital carbon footprint. Establishing what are known as “green patterns” is a practice that will only grow in urgency as we continue to bring more services online and as nonprofits continue to participate in the process of digital transformation.

Below is a round-up of strategies shared by MightyBytes that your nonprofit can adopt (and adapt!) as it navigates its own relationship with sustainable web design and overall greening:

Web Performance Optimization: in essence, this refers to loading as few page assets as quickly as possible without sacrificing user experience. In practice, this mean anything from disabling blog comments for faster page speed, to using shared code libraries, removing extra characters from your scripts to reduce page size by up to 25%, and more.

Improving User Experience (UX): A great user experience helps people accomplish tasks quickly and efficiently without confusion or barriers. UX can help you integrate green patterns into the very design of your website, steering your audience towards more sustainable choices by providing options for anything from choosing greener shipping options to printing e-receipts and lots more. Going mobile-first is also another proven way to reduce CO2 emissions. Check out the SustainableUX event hub to connect with like-minded designers and stay up to date with their offerings.

Sustainable Content Strategies: In addition to how you host your content, you can think about how you manage your archive and how to continue to produce content in ways that reduce your digital carbon footprint. Leveraging keywords for SEO is one way to increase efficiency, limiting energy-heavy online searches that rely on servers that are distributed across the world. Another proven strategy is to perform regular content audits and stick to an editorial calendar. And don’t forget about fonts! This FastCompany article uncovers the world’s most sustainable fonts to help you green your design in tangible, immediate ways.

Understand Your Website’s Current Footprint: did you know that the average web page tested produces 1.76 grams CO2 per page view? For a website with 10,000 monthly page views, that's 211 kg CO2 per year! If you’d like to see how your website is faring when it comes to carbon emissions, this Website Carbon Calculator is here to help. You can use the tool to input your organization’s URL and learn more about your site’s footprint, then you can access a curated list of efficient websites to get ideas for how to improve yours.

Interested in learning more? See also Sustainable Web Design’s repository of strategies and best practices. They are organized by categories such as: web development, content & marketing, hosting, business operations and more.


Go Deeper

ClimateAction.Tech: an online group and Slack channel where tech professionals gather to take action on climate matters. Their focus areas are: business culture & behaviour change; green software engineering; sustainable product design; low-carbon infrastructure. an online hub that provides the knowledge, skills and professional network for designers to take climate action. As their tagline reads, “Imagine every designer in every company everywhere putting climate at the core of their creative work”.

WholeGrain Digital blog: a digital service agency whose websites are 67% less polluting than industry average and is the force behind popular initiatives like the Website Carbon Calculator and the sustainable web blog.

{link_name} handles all validations and customer service for TechSoup Canada customers. Visit {link_name}arrow