The Contribution of Green Web Design to Environmental Sustainability

Montevideo, December 16, 2022.

Web design contributes to Sustainable Development. In addition to focusing on the construction and development of digital interfaces, such as websites and web applications, it helps minimize negative impacts on the environment.

Green Web Design emerges as an ally for sustainability, with the main goal of designing and building websites while considering all environmental aspects. This applies not only from the initial to the final phase but throughout the product lifecycle.

This approach helps reduce carbon emissions and energy consumption. Therefore, it is vital to measure digital impact using cloud tools or browser extensions. Through these tools, it is possible to perform a sustainable audit or basic scan to identify how much CO2 is emitted by images, fonts, attachments, and more.

In this article, Lic. Mariana Caffa, Services Coordinator at Sofis Solutions, and Lic. Alfonsina Araujo, Designer at Sofis Solutions, explain what this approach consists of and how it can help reduce environmental impact.

Is the digital world as green as we think?

From a design perspective, it is often thought that the digital world is eco-friendly. But this is not the case. Data centers consume large amounts of energy, from storage systems to connectivity and servers.

How can web design contribute to Sustainable Development?

• There are some easily applicable recommendations that can help reduce environmental impact, such as Digital Eco-design, which proposes six key milestones:
• Define essential elements and eliminate non-essential ones
• Evaluate and measure the user journey
• Simplify the user journey
• Mobile first
• Test, evaluate, and maintain
• Conscious design and development

What are the biggest challenges in designing sustainable digital solutions?

We have an ethical responsibility, not only to users but also to the environment. We must shift paradigms to be responsible with the planet through our solutions.

In web design, the challenge is to create an idea that adds value while contributing to sustainability. On the development side, it is about finding a balance. For example, website animations increase CO2 consumption. While visually appealing, it may be better to find alternative solutions without them to help the environment.

Why is it important for Sofis Solutions to incorporate this approach into its solutions?

Currently, the internet generates approximately 3.8% of global carbon emissions, and this is increasing due to growing data consumption. This is 50% more than global air transport emissions.

By researching and understanding the significant CO2 consumption problem, many companies are taking the initiative to make their digital products more eco-friendly. We consider it important because in the future, taking care of the planet will become essential.

How can the impact of Green Web Design solutions be measured?

There are tips to reduce the amount of data transferred by websites to make them more eco-friendly, including:

• Compress images using tools like https://tinypng.com/ or https://shortpixel.com/ to reduce file size.
• Upload images in the correct scale instead of resizing via CSS.
• Use SVG, CSS, WebP instead of JPEG, PNG, or GIF, depending on the image and its purpose.
• Avoid hosting videos directly; use YouTube or Vimeo links. If videos must be on the page, compress them and disable autoplay.
• Minimize custom fonts; prefer Google Fonts (free) or Adobe Fonts (paid). If loading fonts manually, use WOFF/WOFF2 formats as they are more compressed.
• Avoid large files like PDFs, DOCX, or MP3s; if necessary, host through eco-friendly external providers.

You can check a website's CO2 consumption here: https://www.websitecarbon.com/

What are the benefits of this approach?

Besides benefiting the environment, Green Web Design offers the following advantages:

• Simple and intuitive user interface
• Faster performance
• Search engine optimization (SEO)
• Good performance across different screen sizes
• Usability, Accessibility, UX