Raphael Thys
How can we reduce the internet’s massive environmental impact? Here are some sustainable web design practices you can use to create high-performing, low-carbon digital products and services.
As a Certified B Corp, Mightybytes wants to help our clients and the larger web community understand how to design more sustainable digital products and services while also prioritizing business goals and users’ needs. When we published our first blog post on sustainable web design in 2013, most people didn’t know about the impact our global appetite for data has on the environment:
- By some estimates, the internet emits 1.6 billion annual tons in greenhouse gas emissions. This number is rising quickly.
- Over 50 million tons of e-waste were produced in 2019 alone, a number that’s expected to rise by 8% each year. In addition to polluting waterways and adding toxic chemicals to landfills, e-waste produces significant greenhouse gas emissions as well.
This is not just about buying carbon offsets and renewable energy credits, something any of us can do. To successfully address the climate crisis and reach a zero emissions economy, organizations across all sectors need to reduce emissions and design waste out of their systems. And we need to do this quickly. In 2019, Swedish climate activist Greta Thunberg famously pleaded:
I want you to act like your house is on fire, because it is.
Environmental charity Friends of the Earth aptly concluded their 2021 study, Chasing Carbon Unicorns with:
This house of cards will go up in flames with all of us in it.
It’s time to go into crisis-mode. If you’re not already actively pursuing digital sustainability initiatives, sustainable web design might be a good place to start. (We have some thoughts on what you can do about your e-waste too.)
Understanding Your Digital Footprint
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.
And that’s just email. Understanding this, it’s easy to see how we reach 1.6 billion tons in annual emissions.
Compounding this, many organizations don’t properly resource digital departments, which causes content governance bottlenecks, technical debt, and, ultimately, millions of websites cluttered with unread blog posts, broken links, bloated images, and out-of-date content. These issues frustrate users, waste energy, and cost time and money, directly impacting an organization’s long-term sustainability and bottom line.
While many organizations assess the environmental impact of their office space, supply chain, or business practices, rarely do they audit the carbon footprint of their online properties. Given the rate at which the internet is growing, this needs to change.
Sustainable web design can help you address these issues. How does this work in practice? Let’s break it down.
The Sustainable Web Manifesto: sign it today!
What is Sustainable Web Design?
Sustainable web design is an approach to designing digital products and services that puts people and planet first. It respects the principles of the Sustainable Web Manifesto, which calls for an internet that is:
- Clean: Services provided and used will be powered by renewable energy.
- Efficient: Products and services will use the least amount of energy and material resources possible.
- Open: Products and services will be accessible, allow users to control their data, and enable the open exchange of information.
- Honest: Products and services will not mislead or exploit users.
- Regenerative: Products and services will support an economy that nourishes people and the planet.
- Resilient: Products and services will function in times and places where users need them most.
If you haven’t already signed the Sustainable Web Manifesto, you should. Go ahead, do it now. We can wait. 🙂
Sustainable web design is also part of a larger Corporate Digital Responsibility (CDR) strategy that includes social, economic, environmental, and technological practices as well. Read our corporate digital responsibility blog series to learn more.
Sustainable Web Design Practices
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.
The practice of sustainable web design is commonly broken down into these categories:
- Web Performance Optimization: How quickly do assets download to a user’s device?
- Content Findability: How quickly can users find the content they need? And how useful is that content once it’s found?
- Usability: How quickly can all users accomplish tasks across devices and platforms at various bandwidth speeds?
- Green Web Hosting: Are the servers hosting your digital products and services powered by renewable energy?
More recently, two important additions were added to the sustainable web design lexicon:
- Client and Project Ethos: What are your digital projects actually promoting or selling? How do you execute them transparently and effectively?
- Business Practices: How does your organization embody these same principles in its operations?
Below you will find a collection of resources we have created to help you incorporate sustainable web design practices into your own digital products and services. Whether you’re a website owner, product manager, digital marketer, designer, or developer, this content is meant to give you a broad overview of this rapidly evolving field of knowledge.
If you want to dive deeper into this topic, you will find other resources at the end of this post.
Web Performance Optimization
Web performance optimization is all about loading as few page assets as quickly as possible without sacrificing user experience. To learn more, read the posts below.
Web Performance Optimization Resources
- Technical Debt, Agile, and Sustainability: This post covers technical debt and some unforeseen sustainability pitfalls that can happen when using agile methods.
- Use a Page Weight Budget to Speed Up Your Website: Here’s a primer on using page weight budgets to improve website performance.
- Why Sharing Code is Benevolent and Sustainable: Read this post to learn why shared code libraries can help page assets load faster, using less energy.
- How Enabling Caching Speeds up Your Website: Learn caching methods to improve page load speed.
- Disabling Blog Comments for Faster Page Speed: This post shows how removing a single blog comments plug-in can significantly improve page speed and user experience.
- What is PageSpeed and Why Does it Matter?: Learn six different ways to make your website speedier using Google PageSpeed Insights.
- What Fast Food Drive-Throughs Can Teach Us About Making Fast Websites: Hold the pickle, hold the lettuce, this post shows how reducing HTTP requests can significantly speed up your website.
- Minifying or Munging Code for Faster Website Page Speed: Here’s how removing extra characters from your scripts can reduce page size by up to 25%.
Improving User Experience (UX)
A great user experience helps people accomplish tasks quickly and efficiently without confusion or barriers. In some cases, good UX can help users make more sustainable choices as well. You can learn more in these posts.
UX Design and Usability Resources
- How to Design a Sustainable Data Strategy: Data drives so many design decisions, especially in digital. Learn how to design a sustainable data strategy for any organization in this comprehensive post.
- Why Digital Accessibility and Sustainability Go Hand-in-Hand: Learn how universal design practices and accessibility are key to designing more sustainable digital products and services.
- How to Create More Inclusive User Personas: Knowing who you’re designing for is critical to help users achieve goals quickly and efficiently. User personas can jumpstart this process.
- Five User Research Methods for Better Digital Products: Once you understand who your users are, validate (or refute) their needs with these research methods.
- Green Patterns: Helping Users Make More Sustainable Choices: This post can help you help your users make more sustainable choices on everything from printing recipes to choosing shipping options.
- Optimizing Video for the Web: Learn how to optimize video to improve usability while also decreasing bandwidth consumption and energy use.
- Why Mobile First is a Sustainable Strategy: Here’s how prioritizing content and user experience for mobile devices will make your digital products more user-friendly and energy-efficient.
- Responsive Design Image Optimization: This post covers several approaches to optimizing images within a responsive design.
- Design Tips: Web Fonts and Sustainability: Not all fonts are created equal. This post covers how font choices impact performance and energy use.
- How to Optimize Images for Faster Load Times and Sustainability: Learn the basics of image optimization and compression.
- How Error Pages and Redirects Make Your Website More Sustainable: This post will help you better understand how redirects and clear 404 pages can improve user experience and reduce energy use.
- Sustainable Web Design: CSS Sprites: Cut down on HTTP requests and improve performance by using CSS sprites across your website or digital product.
Sustainable Content Strategies
Getting your users to content that quickly answers their questions is at the heart of a sustainable content strategy. But it doesn’t stop there. You also need to develop efficient content governance practices that help you maintain a sustainable content strategy over time. The posts below can help.
Content Strategy and Governance Resources
- Sustainability Storytelling Checklist: This handy checklist will help you better tell your organization’s sustainability story in a more compelling manner.
- How to Use Keywords for SEO and Web Sustainability: Learn the basics of keyword optimization, including where to add them on individual pages.
- Developing a Sustainable Content Workflow: This post outlines several tactics you can employ to create a sustainable content workflow within your organization.
- Create a Content Strategy with This 7-Step Worksheet: Use this worksheet to define how your organization will most effectively create and manage content over time.
- How to Implement a Content Governance Plan: Ensure your content strategy stays on track over time by implementing a content governance plan.
- How to Create a Useful Content Calendar [7 Tools + Free Template]: A content calendar can help you efficiently manage content efforts over time.
- How do I create an SEO keyword strategy that works?: Here are some practical tips for creating an SEO keyword strategy that drives qualified traffic to your website.
- How to Set Up a Google Analytics Goal Strategy: You can’t improve what you don’t measure. Setting strategic goals can help you more effectively measure content performance.
- Content Audits: A Step-by-Step Guide: Here’s why deleting non-performing content and updating outdated content contributes to your website’s long-term sustainability.
Green Web Hosting
Perhaps the most environmentally impactful choice you can make is to power your digital products and services with renewable energy. There are a lot of green hosting choices out there and not all are created equal. The posts below can help you make more informed and meaningful decisions.
Green Hosting Resources
- Reliable Green Web Hosting: Does it Exist?: We went on a years-long journey to find reliable green web hosting so you don’t have to.
- Web Hosting: Renewable Energy & Renewable Energy Credits: When choosing a green web host, it’s important to understand the differences in how they power your data.
- Learning About Server-Level Sustainability: Here are a series of tips you can use to improve server performance.
- Green Web Hosting: After many years of searching, here’s where Mightybytes landed on our quest for green hosting.
Client and Project Ethos
Sustainable web design practices are incomplete if you also don’t apply the same ethics, performance, and responsibility commitments to the projects you bring to life. This means aligning the work you produce with a vision that supports a just and more sustainable future. It also means creating mutually beneficial relationships with project stakeholders that are built on trust, transparency, and accountability. These things greatly improve your chances for project success and long-term product/service sustainability.
Client and Project Resources
- How We Help Our Clients Make a Difference: Here’s how we help mission-aligned clients make a measurable difference in our work together.
- How to Get Stakeholder Buy-In to Your Digital Marketing Strategy: Understanding your ecosystem and stakeholders is critical to devising solutions that hit the mark and reduce the potential for unintended consequences.
- Our Problem-Framing Template: Your project may be values-aligned, but if you’re not crystal clear on the problem you intend to solve, your project still may go off the rails.
- Building Sustainable Development and Deployment Processes: Process is everything for digital projects. Here’s how good processes can reduce resources and improve outcomes.
- How to Run Design Sprints for Social Impact Projects: Design sprint methodologies—when applied to social impact projects—can help you quickly understand whether the problem you hope to solve is actually worth solving.
- 5 Communication Processes to Improve Digital Projects: How you communicate with project stakeholders directly impacts how quickly you can accomplish project goals.
- 7 Tips for Better Creative Collaboration: Fostering better collaboration on projects improves relationships and leads to better outcomes.
- 5 Compelling Reasons to Ditch the RFP: Distributing a digital project RFP can set a project up for failure right from the get-go. There are better ways. This post describes some of them.
- How to Keep a Website Project on Budget: Investing responsibly in sustainable web design means managing digital products and services within your means.
Sustainable Business Practices
Your organization’s day-to-day business practices impact how effectively you can produce more sustainable digital products, services, and practices. Acting responsibly and focusing on sustainability leads to better business performance. These practices will be unique to individual organizations. Below are some resources to get you started.
Sustainable Business Resources
- Proud to Be a Certified B Corp: Our B Corp page and the annual benefit reports we produce best showcase Mightybytes’ commitment to building an inclusive, equitable, and regenerative economy. You don’t have to become a B Corp to enable these practices within your own organization (but it might help).
- What is Corporate Digital Responsibility?: This post outlines a high-level set of practices any organization can employ to make ethical, responsible, and more sustainable digital decisions. It also includes links to related posts on social, economic, technological, and environmental digital responsibility as well.
- Redesigning How We Work: To build resilience, adaptation, and interdependence into our organizations, we must first redefine the social contract between government, business, and society.
- 5 Ways to Create Shared Value: In order to create shared value in business, we first must think differently about how we define capital.
- 7 Pitfalls to Avoid in Your Sustainability Story: You can’t tell a good sustainability story if you’re not living those values. This can lead to so many problems.
- Aligning Your Organization with the U.N. Sustainable Development Goals: The U.N. SDGs offer a framework for aligning your organization’s social and environmental performance with your business model.
We collaborated with our friends at Wholegrain Digital on this sustainable web design resource.
Incorporating Sustainable Web Design Into Your Digital Products
A website or product redesign offers a great opportunity to comprehensively incorporate sustainability principles into your digital ecosystem. However, that might be a ways off for your organization. Here are a few steps you can take right now:
- Set a baseline: Use Wholegrain Digital’s Website Carbon to understand how your current site performs right now.
- Devise a plan: Our own tool Ecograder provides scoring and handy reports to help you figure out where to start making improvements. More on Ecograder’s scoring methods here.
- Incremental Improvements: Create a prioritized list of things to improve. Our handy sustainability checklist (link in the banner below) can help. Address them as time and resources allow.
- Benchmarking: Measure your performance over time with an eye on continuous improvement.
Other Sustainable Web Design Resources
Finally, here are some other resources to help you dig deeper into this topic.
Books
- Sustainable Web Design by Tom Greenwood (A Book Apart)
- My book, Designing for Sustainability: A Guide to Building Greener Digital Products and Services (O’Reilly Media)
- World Wide Waste by Gerry McGovern (Silver Beach)
Communities
- ClimateAction.Tech, a global community of tech workers using their skills to take and accelerate climate action.
- Climate Designers, a community of designers and creative professionals from all industries committed to using their creative skills for climate action.
- Clean Creatives, a community that helps leading ad and PR agencies move away from fossil fuel campaigns.
Organizations & Events
- Sustainable UX, a free, online conference dedicated to design in a warming world.
- The Green Web Foundation, find a green web host in their directory.
- B Lab, a nonprofit dedicated to everything B Corp.
There are also dozens of other blog posts, reports, and interviews across the internet that touch on various aspects of this and related topics. However, covering each one is beyond this scope of this post.
Sustainable Web Design: Last Word
There’s a growing recognition of the impact of humans’ digital footprint on the environment.
It is exciting to see a burgeoning global movement emerge to prioritize digital sustainability. When we started covering this issue in 2013, our blog was one of only a few that regularly addressed these topics.
Thankfully, times have changed. In fact, Wunderman Thompson Intelligence listed Digital Sustainability as the #13 trend in their report, The Future 100: Trends and Change to Watch in 2021. Mainstream publications like Forbes and Wired cover this topic with increasing frequency. Universities around the world are incorporating digital sustainability into their curriculum. Now, it is time for companies, government agencies, and nonprofits to follow suit.
Feel free to contact us if you want to discuss how to do this.
NOTE: Originally published in 2013, this post was one of the earliest on the internet to cover sustainable web design and digital sustainability. We have updated it to reflect changing times and new practices.
Green Your Website!
Download our free web sustainability checklist.
Tim Frick founded Mightybytes in 1998 to help mission-driven organizations solve problems, amplify their impact, and meet business and marketing goals. He is the author of four books, including Designing for Sustainability: A Guide to Building Greener Digital Products and Services from O'Reilly Media. Follow Tim on Twitter or connect with him on LinkedIn.