Sustainable Web Design in 20 Lessons

Paperback, Hardcover, and E-book

Explore the world of sustainable web design in this comprehensive book. Sustainable Web Design In 20 Lessons gives you over 300 pages divided into 20 lessons, it provides essential knowledge to kickstart your journey into crafting eco-friendly websites. Authored by Michael, who brings a decade of practical experience in web design and development, this guide ensures you’re well-prepared to dive into sustainable web design.

Gumroad logo
Front cover art for the book Sustainable Web Design In 20 Lessons

Book description

As of 2024, the internet stands as the single most polluting machine, contributing 4% of global greenhouse gas emissions annually—twice the output of the entire aviation sector. These alarming figures are projected to grow exponentially, potentially surpassing even major countries except China, India, and the USA in pollution. In the race against global warming, the internet emerges as a setback to our goals. Fortunately, there’s a solution.

In pursuit of a net-zero world by 2050, the global aim is to achieve zero emissions, steering clear of catastrophic climate disasters. The premise is simple: continued pollution leads to escalating global warming until we face extinction. This is where sustainable web design steps in. Amidst the trend of faster internet speeds and more powerful CPUs, websites and applications are becoming increasingly resource-intensive. However, with sustainable web design principles, we can build efficient, eco-friendly digital products accessible to everyone, regardless of ability or location.

Sustainable Web Design In 20 Lessons offers a comprehensive guide with over 300 pages. Drawing from a decade of hands-on experience in web design and development, Michael imparts knowledge in each tailored chapter, laying a solid foundation for creating sustainable websites. This guide is a culmination of Michael’s commitment to fill the gap he encountered when searching for practical actions to make websites more sustainable. It’s a head start for those keen on minimizing their digital footprint, ensuring the internet remains helpful to all, without the need to reinvent the wheel.

Lesson descriptions

Lesson 1 – Fundamentals of Sustainable web design

In the initial lesson, we delve into the essentials of sustainable web design. Before laying the groundwork of knowledge, it’s crucial to understand the core concepts. We’ll explore what sustainable web design entails and also touch on the principles of ethical design.

Lesson 2 – Understand carbon footprints

Lesson 2 introduces you to a key aspect of our journey: measuring the carbon footprint of a website. This concept is central to our discussions throughout the book. Understanding the methods and knowing how to interpret the results are crucial for improving our websites.

Lesson 3 – Green web hosting

Lesson 3 delves into the world of green web hosting—a significant step with a big impact. We’ll discuss common challenges and even touch on greenwashing, helping you navigate and choose the right hosting for your website wisely.

Lesson 4 – Content Delivery Networks (CDN)

In Lesson 4, we explore Content Delivery Networks (CDNs) and their crucial role in enhancing website sustainability. By the lesson’s end, you’ll gain a solid understanding of how CDNs operate and be equipped to choose the right one for your website.

Lesson 5 – Page Weight Budget

Lesson 5 introduces the relatively new concept of page weight budgets. Dive into how you and your team can utilize this concept to build more sustainable websites. Additionally, gain insights through a brief interview with Tom Greenwood from Wholegrain Digital, who has successfully implemented page weight budgets within his own team.

Lesson 6 – Death of content

In this lesson, we explore the concept of the “Death of Content.” In a world where we’re always creating but rarely reviewing what we’ve made, we delve into why it’s crucial to consider what we create, review existing content, and remove it when it no longer serves a purpose.

Lesson 7 – Accessibility

Lesson 7 shines a spotlight on accessibility, a crucial topic in our journey. To make the internet sustainable, it’s vital to ensure it is helpful to everyone, regardless of their location or abilities.

Lesson 8 – Minimalistic & lightweight design

Uncover the significance of “Minimalism” and “Lightweight” in website design. Learn how these principles can enhance accessibility and sustainability.

Lesson 9 – Dark & light mode, colors

Dive into the world of light and dark modes and their role in creating more sustainable websites. Explore how implementing dark mode can potentially save substantial battery power for over 1 billion users worldwide. Get ready to uncover the practical insights and measurable impact discussed in this lesson.

Lesson 10 – Image optimization

Images dominate internet media, but when not optimized, they can turn into significant polluters. In this lesson, we delve into image optimization, guiding you on the best practices to prepare your images for maximum efficiency on the internet. Learn how to strike the right balance between visual appeal and environmental responsibility.

Lesson 11 – Video optimization

Explore the intricacies of video optimization in Lesson 11. With videos emerging as a leading form of online entertainment, understanding how to optimize them is crucial. Join us as we navigate through the best practices to maximize the efficiency of videos, ensuring they align with sustainable principles on the internet.

Lesson 12 – Font optimization

Fonts can significantly impact the internet’s performance. In Lesson 12, we delve into the weight of fonts, identifying the most optimal font types for the web, and exploring potential alternatives.

Lesson 13 – HTML optimization

HTML, still the backbone of every website, can contribute to a heavier, slower, and less sustainable online presence if not optimized. In this lesson, we immerse ourselves in the world of HTML optimization, exploring strategies to ensure your content is streamlined for maximum efficiency and sustainability.

Lesson 14 – CSS optimization

CSS, a universal presence on every website, is a topic often sidestepped. However, its influence on your website’s speed, weight, and sustainability is substantial. In this lesson, we delve into CSS optimization, uncovering ways to fine-tune it for a faster, lighter, and more sustainable web experience aligned with our goals.

Lesson 15 – JavaScript optimization

In Lesson 15, we explore how JavaScript, despite its amazing capabilities, can add to internet pollution. It operates like the Wild West, with few rules. We’ll also discuss practical ways to optimize JavaScript code, reducing its impact and bringing a bit more order to its versatility.

Lesson 16 – React & Svelte optimization

In Lesson 16, we focus on React and Svelte, widely used frameworks that, while amazing, can become quite heavy. Dive into strategies for optimizing your web applications and reducing their environmental impact, ensuring they remain efficient and effective.

Lesson 17 – Trackers & HTTP requests

In this lesson, we delve into a common aspect found on nearly every website: trackers and 3rd party requests. While tracking visitors can be useful, the widespread incorporation of numerous services has triggered a chain reaction of pollution with each website visit. Explore the consequences of adding 3rd party trackers and unnecessary HTTP requests, examining their environmental impact and considerations for a more sustainable approach.

Lesson 18 – Service sorkens & caching

Explore the vast potential of service workers in this chapter. While we’ve only scratched the surface of their capabilities, we’ll discuss various ways you can leverage service workers and web browser cache. Learn how these tools can significantly reduce the amount of data sent over the internet every time someone visits your website.

Lesson 19 – APIs

While APIs are incredible, they can also become heavy and energy-consuming. Join us as we explore strategies for creating APIs with efficiency and speed in mind. By the chapter’s end, you’ll be equipped to develop greener and faster APIs.

Lesson 20 – Emails and newsletters

In the final lesson, we delve into the often overlooked environmental impact of emails and newsletters. Gain insights into the damage a single email can cause and discover practical strategies for optimizing your newsletters and emails to minimize their environmental footprint.

Reviews

For the climate-conscious

March 14, 2023

If you’re a climate-conscious but busy web developer wanting to green your practice, Sustainable Web Design in 20 Lessons by Michael Andersen is your ideal starting point. Your day-to-day web development practice can be an impactful climate action: this book will help you make it so

Ismael Velasco

A good book on important points when developing a website/service

March 29, 2023

The book covers a large verity of point about green we development, but does at times miss the point it seems to be making. Most of the points in the book are covered by good data, and are made using up to date references for both sides of the arguments. The book was a little wordy for my taste, but others might find the friendly tone, and story telling nature easyer to get through.

I liked the book overall, and found it to be worth reading.

Hounsvad

Testimonials

Tom Greenwood – Wholegrain Digital

Michael Andersen is the creator is the online resource and organisation
Sustainable WWW, raising awareness and teaching how to create a more sustainable web. As part of this mission, he has recently published this book on the same topic, sharing the lessons that he has learned in recent years. As the title suggests, it’s full of practical tips on how to take action in your web design projects to reduce their environmental impact.

Drawing inspiration from a range of sources, the 20 lessons covered include minimalist design, page weight budgeting, HTML, CSS and JS optimisation, as well as lessons on green API’s, email newsletters, accessibility and much more.

Anderson’s ’20 lessons’ format offers an easy to follow, practical application of the research and best practices on sustainable web design. If you’re after an in-depth ‘how to guide, then this format may be just what you’re looking for.

Ismael Velasco

If you’re a climate-conscious but busy web developer wanting to green your practice, Sustainable Web Design in 20 Lessons by Michael Andersen is your ideal starting point. Your day-to-day web development practice can be an impactful climate action: this book will help you make it so.