Romain Grard, Senior Director, Digital Studio
, July 24, 2024
Share this article

Perhaps you’ve heard the term “eco-design” in recent years in the context of products and services being designed with reduced environmental impacts. But does it surprise you to know that the concept can be applied to the design and functionality of websites in order to significantly reduce environmental impacts and improve customer experiences?

Europeans have been early adopters of website eco-design, but as North American businesses, web designers, and web developers increasingly recognize the environmental impacts of their digital worlds, sustainable practices are trending upward at a rapid pace as steps are being taken to reduce digital footprints.

In the early days of the Internet, less attention was paid to the layouts and efficiencies of websites, as long as they functioned. By the turn of the century, however, new skillsets emerged with the rise of web designers and UX designers who focused on making products and services more accessible and enjoyable. As our lives evolved into a universe of endless connectivity, access to new devices like smartphones only increased the demand for richer user experiences.

Environmental considerations

In the early 2000s, “clean” coding was a priority that helped ensure that web designs wouldn’t overwhelm the limitations of the hardware resources of the day. Today, any device that we use on a daily basis is far more powerful than a computer of 20 years ago, so designers no longer need to worry about performance limitations. That paradigm shift reorganized coding priorities and has put greater emphasis on using the right amount of resources. By 2010, two worlds collided. Environmental awareness began to permeate most aspects of our lives, and technology agendas began to focus on green IT. Reductions in energy consumption began to emerge as integral components of larger corporate ESG strategies. For most who embraced the world of technological advancements, but had no clue how they functioned, the environmental impacts of our daily lives started to become increasingly clear. Web eco-design has emerged as a space dedicated to creating highly functional websites with reduced environmental impacts. By customizing software and using only optimal amounts of resources - including electricity, processors, memory, bandwidth, and more - the weight of web pages and the filtering of data can go a long way to reducing footprints and improving user experiences.

The proliferation of smartphones has added to concerns about high energy demands. During a recent project conducted for a major international air carrier with hundreds of thousands of page views per month, Alithya determined that over 70% of those views were conducted on mobile phones. In response, Alithya developed a dark mode viewing option that reduced energy consumption by 25-30%. Our team also addressed performance issues in respect to the transfer of data to mobile devices, ultimately developing a filter to ensure that only optimal amounts of data were being transferred.

The less dynamic information to resize and adjust, the less processor capacity and energy consumption required. Accordingly, web eco-design can increase the number of users and enhance their experiences by tailoring websites to ensure optimal performance on networks with smaller bandwidths. By filtering data, bandwidth overloads between a server and its users can be avoided. On the server side of the equation, an increasing number of eco-responsible data centers are being used for hosting services.

The tip of the iceberg

Those solutions are just a few of the ways that a web eco-design strategy can address multiple client goals. Other processes with significant benefits include:

  • ensuring code optimization to minimize CPU and memory usage
  • optimizing algorithms to reduce processing time and energy consumption
  • deploying profiling and optimization tools to identify the most resource-intensive code
  • developing modular and reusable components to help reduce redundancies, optimize video and photo quality, enhance graphics, and more
  • automating testing to ensure software quality and reduce unnecessary development iterations
  • performing tests to ensure optimized software performance, to improve maintenance, and to facilitate app scalability

Processes and best practices

A Custom Applications Development team can help clients to design responsive websites and mobile applications built and managed with a modern CMS. Experienced mobile and web app developers are equipped with the latest skills, weaving technology and design to craft solutions that resonate with users, while offering concrete, effective, and accessible solutions that align with the visions of clients.

Over recent years, a series of best practices have been developed for web eco-design, including an assessment process at the very beginning to determine whether or not some existing components of a client’s website can be reused. Prior to any new line of code being written, the overall intended use of the site is studied to see where existing components can be infused into a new design. That is a cost-effective approach for the client, given that the more components are custom-developed, the higher the cost.

Experts can also employ atomic design to web eco-design, a methodology that allows for the segmentation of each part of the visual systems design process. Derived from the concept of atoms and molecules, individual atoms link to each other to form molecules, and then molecules link together to form larger organisms. Atom > Molecule > Organism (Components) > Templates > Pages.

Think of it as a series of Lego blocks. Each Lego block can be seen as an atom, and adding another Lego block turns it into a molecule. Add a few more and you begin to build something resembling a component. If a component functions well, why start over with metaphoric atoms and molecules if it has been proven successful and can be re-used in a variety of structures? Furthermore, such a layered approach minimizes the depth of a web page so that it loads quicker and more efficiently, while consuming less energy and bandwidth due to its reuse of the most attractive existing components.

Indexing is another resource consumption area to address. Rather than indexing pages automatically throughout the day that haven’t changed, customized indexation plans enable websites to refrain from indexing unnecessary data. Additionally, indexing helps optimize the search process by limiting the depth of access to the information.

As awareness of the tremendous environmental benefits continues to spread in North America, website investments that can typically account for 10-20% of a larger project budget. Clients seek out tech services partners that incorporate agility and most robust frameworks into their bodies of work, based on best practices that have emerged worldwide. In addition to atomic design, reusable design packages, and Drupal as an open-source CMS with a fully customized front end, filters on the server side can help ensure the selection of the right data, at the right time, on the right page.

Eco-design is an example of how doing things right can help companies to do the right thing.
 

Share this article