Go back
20.04.2022
Charline Jéhannin
Web performance
Blog

Toward eco-friendly, high-performance websites: what are the best practices?

No one is unaware that digital technology is constantly on the rise, and this does not bode well for the planet. Estimates show that in 2022, the internet will be responsible for 4% of global greenhouse gas emissions, over 1.5 times more than air transportation (source: Ademe, the French Environment and Energy Management Agency). The outlook for the next 5 years is not very bright: the environmental impact of communications tech could double.

Digital sobriety, a topic that’s hotter than ever

First of all, let’s define what we mean by digital sobriety: it’s an approach which aims to reduce the environmental impact of ICTs by limiting their usage.
With the total number of websites nearing 2 billion, of which 576 000 new sites are created each day (according to Internet Live Stats), the web is becoming a major environmental factor to contend with. As a matter of fact, it amounts to 20% of the world’s power consumption. And if that weren’t enough, analysts note that the digital carbon footprint grows by 8% each year. (source: Bercy – French Ministry of Finance ?).
The most energy-hogging usage is streaming video, which accounts for 1% of CO₂ emissions, the equivalent of 300 million tons of C0₂.

It has been observed that the user of devices, data centers, and networks accounts for 55% of the end energy consumption of digital technologies, according to The Shift Project. Total power consumption is shared with the production of computers, televisions, smartphones, and other electronics, which represent 45%.

How does your website rate in terms of environmental performance?

Websites, in essence, are unecological; they always cause greenhouse gas emissions. Since this pollution cannot be entirely eradicated, at least it should be reduced. The first step toward doing that is to analyze your website’s environmental performance.
To do so, it is important to measure what’s called the EcoIndex. This index evaluates the ecological impact and the amount of water required to display a web page. The EcoIndex was developed by a collective which federates some fifty organizations around Green IT. Other online tools are available, among them Ecometer, Greenspector, Website carbon, etc.

What metrics are used to calculate a website’s carbon footprint?

The EcoIndex calculates for each web page tested:

  • The technical footprint (size, complexity, etc.)
    • the application footprint (number of DOM elements, number of requests, etc.)
    • the physical footprint (CPU usage, RAM consumption, quantity of data exchanged, etc.)
  • The environmental footprint (greenhouse gases and water consumption)

These metrics contribute to the definition of an overall absolute environmental performance score (from 1 to 100) as well as the relative environmental performance (ranking from A to G).

The EcoIndex is calculated from three objective physical measures: DOM size, Kb transferred, and number of HTTP requests (source: ecoindex.fr).

formule ecoindex

How to make your website more environmentally responsible

Ecological questions should be considered at the very beginning of site design or website overhaul. It involves the infrastructure which underlies your website as much as ‘on-site’ optimization which entails optimizing content.

Optimizing the ‘physical’ and code:

Hosting

According to the Ademe, 25% of the greenhouse gas emissions from ICTs are related to infrastructures, networks, and data centers. For this reason, it is important to optimize how your site is hosted. For this we recommend choosing a hosting company with a good environmental performance record, and which is powered by renewable sources of energy. In addition, it is highly advisable to set up a CDN (Content Delivery Network), which lets you distribute your site to any country in the world and bring your content closer to your visitors.

Case study: During the overhaul of the website of a major luxury corporation, the group’s IT management wanted to take the opportunity to improve the website’s global service, especially in Asia. Even more than price, the luxury group was interested in knowing about the efficiency of CDNs worldwide.
A study measured the efficiency of a panel of CDNs tested in different countries. It showed that CDN 1 improved performance by 60% in North America, and by 30% in Europe and Asia. As for CDN 2, it also improved performance by 60% in North America, but had no effect in Europe and Asia. This way, the luxury group was able to select its CDN based not only on price, but for the cost/efficiency ratio as well. It was also able to ‘challenge’ its other providers in light of these results.

Source code

In addition to optimizing website hosting, it is important to take a close look at the source code. With the help of measurement tools, you will be able to identify items of code that are useless and minify the CSS, if necessary. The more you minify your code, the eco-friendlier your site will be.

Storage

Servers and routers need a significant amount of power to operate. It is essential to adjust usages in order to minimize energy consumption. You might also consider moving to the cloud to share resources.

Case study: An international energy group was considering moving to an Office solution in the cloud, and shortlisted two potential providers: Google and Microsoft. We noted a considerable difference in price depending on the provider and the number of hubs deployed worldwide. The choice was this: either a central hub for the whole world, or one hub per continent (a very costly solution). ip-label simulated the main scenarios representative of the actions that employees would perform in their jobs (downloading an attachment, interaction with the extranet, etc.) to provide the energy group with the information it needed to make its choices and optimizations.

 

Optimizing the ‘visual’ and content:

Image and video

It comes as no surprise that graphics and videos are at the top of the list. Before optimizing them, it’s useful to consider what the image or video really contributes to your page. Ideally, the recommended size for images should be under 300 kb. You can easily optimize them using Adobe Photoshop or online tools like ShortPixel or TinyPNG. Moreover, if you can use vector graphics (SVG, WebP, WebM), they can decrease the size of your pages by as much.
As for videos, we recommend storing them on a dedicated video platform (Youtube, Vimeo, etc.) and using only their URL for your web page.

Case study: ip-label conducted an audit to analyze the performance of the website of a large enterprise in the luxury sector which was integrating video into its web pages. ip-label identified areas for improvement which enabled the group to tune its performance but also, above all, to considerably optimize the traffic on the network, thereby generating substantial savings in relation to its CDN.

Fonts

It is preferable to use standard fonts, those which are already natively available on user PCs. This way you can avoid generating HTTP requests and soliciting the server to display the page.

Design

The more minimalist the design and the higher the contrast (black text on a white background), the more your website will be in conformity with the codes of digital sobriety. Static content also consumes fewer resources than dynamic content: for example, opt for a clickable graphic rather than a data visualization online.

Pages

An ecologically responsible website should have a limited number of pages.

Case study: On behalf of a major banking institution, ip-label worked on optimizing web pages to ensure that the website under analysis would obtain better web performance metrics (in particular the Google Core Web Vitals). Even beyond performance, the actions that were conducted led to an improvement in the website’s ranking.

With Ekara, aim for a fast, smooth and responsible website!

A environmentally responsible website that offers a fast, smooth user experience is possible! The simpler and more streamlined your site is, the eco-friendlier it will be, and speedier and more responsive as well. Your navigation will gain in quality, and your content will be all the more compelling. Besides, since loading speed is one SEO criterion, a more ecological website will see its SERP (search engine results page) ranking likewise improve.
With Ekara, get all the benefits of sophisticated diagnostics to identify performance shortcomings and the improvements you can make to boost the eco-friendliness and user experience of your web pages.

Our consultants are ready, willing, and able right now to integrate EcoIndex measures of your website into our assistance offers, not only with Ekara Benchmark for insights into where you stand against your competitors, but also with Ekara Web Performance to analyze your site through the double prism of web performance and the EcoIndex.