Author: Laurent DEVERNAY

After working for more than 15 years in web development, Laurent Devernay became a technical consultant in responsible digital technology at Greenspector. When he is not coaching organizations on the eco-design of their digital services, he teaches courses on digital sobriety technologies.

Web hosts, impact and sobriety actions

Posted on February 8, 2023February 8, 2023 by Laurent DEVERNAY

Reading Time: 6 minutes

When we are interested in digital sobriety, the question of the host comes up very often. Indeed, this is a very interesting and cross-cutting lever for reducing the environmental impact of digital services. Things get more complicated when you try to sort out the real from the fake in order to choose the best possible host according to the project’s business constraints. Some providers go so far as to talk about carbon neutrality or even carbon negativity.

Claims of carbon neutrality are most often based on the source of the electricity used according to a market-based (supplier’s claims) or location-based (geographical energy mix) approach. Given that some of the scopes 1, 2 and 3 are often neglected, all of this makes these claims invalid. The purpose of this article is not necessarily to go into this point in detail, but you will find some initial answers here:

[Youtube, 24min 16s] Carbon footprinting tools for public clouds, a presentation by Pierre Rust from Orange Innovation
Carbon neutrality’ for digital companies, by EcoInfo

Today, in all cases, the claims of eco-responsibility of hosting providers are mostly based on PUE (Power Usage Effectiveness) and the source of the electricity used. This does not seem to be enough. At Greenspector, we decided to look into the subject, to see what was being offered today and to base ourselves on the existing literature in order to determine what criteria to use to choose a hosting company. We were then able to classify several French (or nearby) hosts.

In this first article, we decided to evaluate the homepage of their sites from the point of view of digital sobriety, in order to check whether they reflect their environmental claims. This approach is of course biased and unrepresentative, but it already gives an idea of where each of them stands from this point of view.

It is only with the second article that we will really be able to decide between the hosts, by sifting through the criteria we have chosen.

Comparison of home pages

Based on their intentions regarding environmental impacts, 21 accommodation providers were selected. We have selected as a priority those that show efforts to reduce the environmental impacts of the services they offer. We may have missed some. If so, please let us know!

Based on this list, we measured the homepage of each with the Greenspector tool in order to compare them.

Nom	URL	Ecoscore	Energie (mAh)	Données transférées (Mo)	Requêtes HTTP
Empreinte Digitale	https://cloud.empreintedigitale.fr/	85	5	0,31	18
Greenshift	https://www.greenshift.co/fr/	80	4,25	1,07	51
Eolas	https://www.eolas.fr/	73	4,44	1,41	59
Webaxys	https://webaxys.fr/	73	4,89	11,80	53
IONOS	https://www.ionos.fr	72	4,58	0,99	27
Scaleway	https://www.scaleway.com/	72	5,08	2,24	29
OVH	https://www.ovhcloud.com/fr/	72	5,55	1,83	64
Neutral IT	https://neutral-it.com/	69	6,62	1,28	49
o2switch	https://www.o2switch.fr/	67	5,38	0,97	90
Ikoula	https://www.ikoula.com/	66	5,31	1,54	33
PlanetHoster	https://www.planethoster.com/	66	5,46	1,77	76
Clever Cloud	https://www.clever-cloud.com/	61	4,90	1,74	126
DRI	https://www.dri.fr/	60	5,98	0,45	27
Datacampus	https://datacampus.fr/	60	5,69	13,14	64
EX2	https://www.ex2.com/	58	5,47	9,75	91
Data Center Light	https://datacenterlight.ch/	56	4,68	2,86	51
Sostradata	https://www.sostradata.fr/	52	7,23	17,19	89
Digital Forest	https://digitalforest.fr/	51	6,22	0,89	35
OVEA	https://www.ovea.com/	45	7,01	4,25	111
Infomaniak	https://www.infomaniak.com/	39	10,30	3,09	72

Résultats des mesures sur les pages d’accueil

*Results of the environmental projection*

Now let’s look in more detail

As far as the Ecoscore is concerned (the calculation methodology for which can be found on the Greenspector blog), the homepage of the Empreinte Digital site came out best and Infomaniak worst. For Infomaniak, this can be explained by the fact that the site’s energy impact is very high. It is even the highest in the sample. On the other hand, Greenshift does the best from this point of view. Empreinte Digitale has the lowest volume of data transferred, while Sostradata transfers the most (over 17 MB!). Concerning HTTP requests, we find again Empreinte Digitale while Clever Cloud presents the homepage with the most HTTP requests (at first sight some optimizations would be quite easy to implement by avoiding duplicates and by delaying the loading of the chat or even by questioning its relevance).

The home page of the Empreinte Digitale site therefore clearly stands out from the rest and we will now analyse in more detail what makes it the most sober page in the sample. We will then complete our analysis with a quick look at the elements of Infomaniak’s site that make it more impactful. We will end with a brief overview of the other sites.

Empreinte Digitale

This homepage is particularly light, which is an opportunity to note the application of several good practices:

Optimised and lazy-loaded images
Third-party services mastered and, in principle, all self-hosted
Very little JS and CSS
Use of system fonts only

The site is pleasant and attractive. The score could be even better without the animation but this is absent on mobile. The choice of dithering for some images highlights the desire to produce a site as light as possible but is not necessarily necessary.

Infomaniak

The Infomaniak site stands out for its low Ecoscore and high energy impact.

If you take a closer look, you’ll notice that most of the weight of the page is due to numerous JS files (about forty in all!).

In addition, the animation at the top of the page (for the search of a domain name) seems to be one of the causes of the overconsumption of energy, highlighted in the Greenspector tool:

*Sollicitation du CPU pour l’affichage de la page*

Other possible explanations for this over-consumption may be found in JS processing. In any case, it should be analysed and limited.

Other websites

Greenshift’s homepage shows a low energy impact, despite the inclusion of animations when the page is loaded. However, in terms of usability, the presence of horizontal scrolling on mobile phones is not ideal.

For the Sostradata site, which has the highest volume of data transferred in the sample, a quick glance reveals the first areas of improvement:

Avoid including a Google Maps component directly on the homepage
Optimise images (size, format, quality, lazy-loading)

*Extrait des requêtes HTTP de la page (via les DevTools de Firefox)*

Good practice in digital sobriety

In terms of good practice, it is worth noting that the Neutral IT homepage meets the most criteria.

From this point of view, we found that some good practices are almost never implemented on the pages in our sample. To improve impact, one should systematically consider :

Do not let the browser resize images, this limits the consumption of terminal resources
Only download the necessary images and do lazy loading
As far as possible, do not integrate css and js code into HTML files; this will avoid systematically reloading the whole file if necessary
And of course, once the css and js files are independent, they should be minified to save space

Best practices for accessibility

In addition to measurements and verification of good practices (two complementary approaches that are difficult to separate), we were curious to briefly evaluate the selected sites from the perspective of accessibility. While it is important to reduce the environmental impact of digital services, this cannot be done without ensuring that the site adapts to all contexts of use so as not to exclude anyone. What is the point of having the least impactful site possible if it is unusable for a part of the population?

As we do not wish to be exhaustive, we have relied on the aXe tool (it should be remembered that this type of tool is not intended to cover all the WCAG or RGAA criteria) and on the manual verification of certain criteria (200% zoom, content linearisation, textual alternatives, etc.) In accessibility as in digital sobriety, there is no magic wand!

In the end, our findings are as follows:

The Eolas and Empreinte Digitale websites have the fewest accessibility errors
The Infomaniak site is among the sites with the most errors
Among the most frequent errors, we find mainly those highlighted by the WebAIM Million study (which is consistent):

So here we see (once again) that accessibility and digital sobriety are linked. It would be difficult to say that those who do not take care of the sobriety of their websites do not care about accessibility (and vice versa). On the other hand, it is important to remember that it will be all the easier to apply accessibility criteria to a sober site, and even more so when the two approaches are carried out jointly throughout the project’s life cycle.

Conclusion

A first quick analysis of the websites of the selected hosting providers allows us to distinguish those who make the effort to create a sober (and accessible) site. While this does not indicate that they are paying attention to reducing the environmental impact of their hosting offers, it will be interesting to see if the trends noted here are confirmed later.

In the next article in this series, we will look at the criteria needed to assess the environmental responsibility of a web host. We will return to the websites of the selected hosts to see how each one measures up against the criteria in question.

For each of these websites and applications, measured on an S9 smartphone (Android 10), the measurements were performed using our Greenspector Benchmark Runner, which allows automated testing. Only the homepage of the websites was measured.

Scenario details:

Loading the application
Inactivity of the website in the foreground
Scrolling
Website inactivity in background

Each measurement is the average of 5 homogeneous measurements (with a small standard deviation). The consumption measured on a given smartphone with a wifi network can be different on a laptop with a wired network for example. For each iteration, the cache is emptied beforehand.

Learn how Greenspector assesses the ecological footprint of a digital service.

Optimising your website for print

Posted on January 11, 2023January 31, 2023 by Laurent DEVERNAY

Reading Time: 2 minutes

With the arrival of digital technology and in particular the web, many people predicted that this would greatly limit the volume of printing. In reality, the opposite has happened as these new technologies, coupled with the democratisation of personal printers, have made it easier for everyone to print. In passing, this can be seen as an illustration of the rebound effect or Jevons’ paradox.

It should be borne in mind that printing is still used for personal or business purposes for the transmission or storage of information.

We will therefore look here at how to make the printing of website content as low impact as possible. We won’t discuss the printer, paper or inks used (printing in draft quality, double-sided, multiple sheets per page, etc). Instead, we will look at good design practices that can make printing less impactful and the printed content more readable.

To begin with, let’s look at what the existing guidelines mention on this subject.

The GreenIT.fr collective’s repository of 115 good practices in web ecodesign proposes BP_027: “Provide a print CSS”. The brief example provided already covers a good part of the recommendations that we will detail in the rest of the article.
GR491 suggests checking that a clean version is available for print and that a font optimised for print is used.

This is partly in line with what we will now see in terms of recommendations.

Limit the number of pages

Often, when trying to print a simple web page directly, the number of sheets used seems disproportionate. This is the case, for example, when printing an electronic ticket, such as a train ticket. There are a number of ways of overcoming this:

Reduce page margins
Reduce the spacing between elements
Reduce the size of titles and texts
Linearise content

Remove peripheral content (decorative images, contextual elements such as blocks presenting similar articles or the latest articles, menus, top and bottom of the page, navigation elements, etc)

Limiting ink surfaces

If we saw in the previous good practice how to limit the amount of paper used, it is also possible to limit the use of ink. If a dark mode is in place, make sure that the background is white when printed. Again, it may be worth removing unnecessary visuals such as decorative images.

Some fonts are specially designed to reduce the amount of ink used in printing. Take a look at Ryman Eco or tools like EcoFont.

Another option is to allow the user to print the content without the images. In some contexts, images can help with comprehension, but you might as well give the user the choice of printing a page with or without the images.

In addition, CSS filters can limit the ink cost of images: Quality print versions with CSS filters.

How to implement these good practices?

As mentioned in the 115 best practices for web eco-design, the easiest way is to set up a stylesheet dedicated to print and used for the whole website. For this, I invite you to read the Smashing Magazine article “Print stylesheets in 2018“.

Conclusion

In order to facilitate the printing of website content, we have seen here the best practices to implement. The development costs are limited but the benefits for users can be substantial. It is indeed essential to keep in mind all the contexts of use of a website.

Get in touch

Reducing the impact of autocompletion

Posted on January 3, 2023January 4, 2023 by Laurent DEVERNAY

Reading Time: 4 minutes

When we browse the web, autocompletion is almost everywhere. In particular, this functionality is implemented on search engines, whether they are website-specific or not. So, when the user types in the words they are looking for, suggestions are made dynamically, whether to complete the words or phrases they type in or to display the search results as characters are added.

In the case of Google, these suggestions are often derided as incongruous. Not to mention the SEO chestnut about the death of the search engine.

Take the example of the Google search engine:

Here, the blue arrows represent character inputs and the black rectangles represent autocomplete queries.

We arrive at a total of 16 XHR type queries for 5.1 kb transferred.

The number of queries remains the same whether the input is fast (input in 2 seconds for the whole search) or longer (7 seconds in total for the input).

Autocompletion can also be found in some input forms, to ensure that the text entered corresponds to what is expected (city, country, etc).

While this mechanism can be an aid to the user, the environmental impact of the queries generated should not be overlooked. Let’s see how to limit them.

First recommendations

If sobriety is a priority, the best thing to do is not to integrate an autocomplete mechanism. However, input help is a definite advantage for users in most cases.

In the case of forms, the GreenIT.fr collective’s collection of 115 good practices in web ecodesign recommends input assistance. In this way, less strain is placed on the server while ensuring that the text entered remains consistent with what is expected.

On the GR491 side, there are two recommendations:

Limit unnecessary searches by local search engines: this is based on the number of letters entered in order to space out the queries
Limit the number of requests between the client and the server: this more general good practice applies perfectly here

Rather than systematically implementing autocompletion and search, it is sometimes possible to make filters (and sorting mechanisms) available to the user.

With these initial elements in mind, let’s look at how we can go even further.

Recommendations

Ensure that requests are as light as possible

When the client sends a request to the server, ensure that it contains only the elements necessary to provide a relevant response.

When the server sends a response, again ensure that :

Only relevant fields are returned. For example, it is not always necessary to display an image for each result
Only the necessary elements are returned (relevance of responses and pagination of results)

Do not offer autocompletion before a few characters

Before launching the first query, it is preferable to wait until 5 characters have been entered or at least 2 seconds have elapsed since the last entry by the user.

This avoids returning results for a request that is too vague (when the number of characters entered is insufficient), while taking into account the case where the term searched for is deliberately short (“summer”, etc).

Spacing out the queries in time

After the initial query, wait until 3 new characters have been entered or at least 2 seconds have elapsed since the last query.

Limit the number of queries for fast entries

In addition to the previous rule, in the case of fast input, wait at least one second between each request. Indeed, some particularly fast users can enter a character every 200 ms.

Measuring local relevance

When a user adds characters to his search, the results become more precise and their number decreases. It is possible to perform this filtering directly locally, without additional requests to the server. For example, if results were obtained for “housing assistance”, it is possible to filter on the client side if the user continues by typing “housing assistance”.

This good practice is particularly relevant in the case of an input field in a form. For example, when entering a city or country, the elements of an initial query can be refined locally as the user continues to type.

Be aware that if a space is entered and new terms are added, the logic chosen for the search results must be taken into account. In particular, should a result contain all the terms entered or only some of them?

Be careful also to take into account the case where the user deletes some of the characters entered. You may also want to temporarily store the queries you have already made so that you can use them again if necessary.

Back to the example of the Google search engine

Taking the case of the Google search engine mentioned at the beginning of the article (16 queries, 5.1 KB transferred), we arrive at 3 queries in total for 1 KB transferred.

A first query only performed when at least 5 characters have been entered.

A second query when 3 more characters have been entered.
A third query when 3 more characters have been entered.
The local evaluation of the results to be returned at the end of the input, since it is only a question of filtering the results obtained following the third query.

Conclusion

If autocompletion is a necessity and assisted input is not possible, the following good practices should be implemented:

Ensure that queries are as light as possible
Do not offer autocompletion before a few characters
Spacing out queries over time
Limit the number of queries for quick entries
Measure relevance locally

Finally, although this input help may be beneficial to many users, do not neglect its accessibility.

How is the ecoscore calculated in the case of a web or mobile benchmark

Posted on November 22, 2022December 8, 2022 by Laurent DEVERNAY

Reading Time: 4 minutes

In this article, we will see in more detail how the ecoscore is calculated in the case of a web benchmark performed by Greenspector.

And in other cases ?

As you may already know, Greenspector also performs measurements on mobile applications. In the case of Android applications, it is possible to easily perform a benchmark. The methodology is standard: measurements on loading stages, pauses and reference. The ecoscore is also calculated from the Network and Client Resources ecoscores. The only notable difference is that the implementation of good practices is not automatically controlled and therefore not included in the calculation.

Also, in some cases, it is more appropriate to measure a user path directly in order to be as close as possible to the behavior of the site in its real conditions of use. Whether it’s for the web or a mobile application, Greenspector performs the measurements (always on real user terminals) after automating the path (via the GDSL language). The ecoscore is then established from the metrics represented via 3 ecoscores: Mobile Data, Performance and Energy.

What is a web benchmark?

In order to evaluate the environmental impacts of websites, Greenspector has several operating modes and tools. The easiest to implement is the web benchmark. This standard methodology allows to measure any web page and compare it with other pages.

The measurements are performed on a real smartphone available on our test bench, most often in WIFI (even if other connection modes, such as 3G or 4G, are possible) and with the Chrome browser.

Such a measurement lasts 70 seconds and includes:

-The loading of the page
-A pause step with the page displayed in the foreground
-A pause step with the page displayed in the background
-Scrolling on the page

In addition, a reference measurement is performed on an empty tab in Chrome.

Several iterations of measurement are performed to ensure their stability.

We thus recover metrics on the data transferred but also the impact on the user’s terminal and in particular on the battery discharge. In addition to this, the correct implementation of some thirty good practices is automatically verified.

Then, the environmental indicators are calculated taking into account, when possible, the real statistics of the page use. You can find more information about this on the dedicated page on the Greenspector blog.

Once all this information is available, it becomes easy to compare different web pages, whether they are on the same site or not. This is the operating mode that is used in the framework of the website rankings proposed on this blog, but also at the request of a client in order to establish an inventory of one or more of its websites and to propose an action plan. It can also be a way to build a competitive benchmark to position itself in relation to a sample of similar sites.

You can already have an overview of all this via the Mobile Efficiency Index (MEI) made available by Greenspector to evaluate the impact of a web page for free.

For the moment, we only have to see how the ecoscore is calculated in the context of a web benchmark.

Calculating the ecoscore for a web benchmark

First of all, the ecoscore established for a web page is the average of two values:

-A Client Resources ecoscore which reflects the way client resources are managed from a sobriety point of view when accessing this page
-A Network Ecoscore which reflects the network (and server) load

Client Resource Ecoscore

The Client ecoscore is based on 12 controls performed on the metrics directly retrieved from the user terminal (and collected via its operating system). These metrics concern, among other things, transferred data, but also battery discharge, CPU and memory. For each, 4 to 5 thresholds are defined to determine the acceptable values. According to these thresholds, a score is calculated. The scores for all the metrics are then aggregated to calculate the Customer Ecoscore.

For example:

-The maximum score for data transferred during page loading can only be obtained if its total weight is less than 500 KB
-For the battery discharge, we compare it to the one measured during the reference step described above

The thresholds used are defined via a database of measurements in order to be able, according to the statistical distribution of the measurements previously obtained, to determine the expected thresholds.

Network Ecoscore

Today, the Greenspector methodology is based on measurements only on real user terminals. As a result, the definition of the Network Ecoscore is slightly different. It is based on two elements:

-Comparison of metrics related to data transfer with thresholds defined in a similar way to those used for the Client Ecoscore calculation
-Automatic verification of the implementation of some thirty best practices

For example, we ensure that text resources are compressed on the server side, that images are not resized in the browser and that there are no more than 25 HTTP requests in total. These are therefore good technical practices (rather efficiency-oriented) that can be found in most good practice guidelines for ecodesign or responsible design of digital services.

Conclusion

All these elements make the web benchmark a very efficient process to evaluate the impacts of a web page and compare it with other web pages. It is also an excellent way to start a more in-depth analysis, especially by looking at the most impactful pages of a site. In some cases, it will be more judicious to start with the least impactful pages. A design flaw on a high impact page will often be specific to it, whereas on a low impact page, it will often be common to all the pages.

The web benchmark, among other things through the calculation of the ecoscore, illustrates once again the need to use both measures and good practices in an approach to reduce the environmental impact of a digital service.

Analysis of the 10 sites nominated for mobile excellence by Awwwards

Posted on October 5, 2022October 24, 2022 by Laurent DEVERNAY

Reading Time: 4 minutes

Awwwards references websites that stand out from the crowd in terms of their conception, user experience and design. It is a true reference for web designers and web developers around the world. The concept is simple : every day, designers submit their websites to Awwwards. The site is submitted in the “Site of the day” category. It is judged by members of the Awwwards community of designers, developers and agencies. The best site of each day of the year appears in the book “The 365 Best Websites Around the World”. Every month, a site is elected “Site of the month”. At the end of the year, during a ceremony, the jury chooses the best of the year.

The Awwwards site has grown since its creation in 2009. The nominees are divided into 6 groups:

Sites of the Day
Sites of the Month
Sites of the Year
Developer
Mobile Excellence
Honorable

There are also site themes called Categories, of which there are 26.

Pretty sites but not necessarily sober ?

Our curiosity led us to analyze 10 sites nominated on Awwwards. We have selected sites nominated in the “Mobile Excellence” group. These sites are judged on 4 criterias :

Friendliness
Performance
Usability
PWA

Awwwards assigns a score for each of the above criteria, which is then used to calculate a total score.

At Greenspector, we decided to go further in the analysis of these sites to see if they met our sobriety criteria.

Additional analysis of sites at the bottom of the ranking

Betterup.com

More than 200 HTTP requests to load the page and then 1 request about every 10 seconds. The requests point to about 50 domains.

These queries can be found on the RequestMap (a tool created by Simon Hearne):

While the presence of the cookie banner is legitimate, the chatbot obscures a good part of the display, which is problematic for an Awwward-awarded site. Is this chatbot really necessary? Shouldn’t it open (and load) only on user request?

It should also be noted (but unfortunately this is often the case) that about thirty requests are triggered as soon as cookies are accepted.

When scrolling, the number of requests and the amount of data transferred increase considerably following the direct integration of a Vimeo video. The use of the facade pattern would have been more judicious. We also notice a carousel which is difficult to use on mobile (swipe only).

The lazy-loading is well implemented but we note various superfluous visual effects (in particular parallax) which still come to weigh down the site, in particular with scrolling.

When we scroll down to the bottom of the page, we are at more than 400 HTTP requests and more than 12 MB of data transferred.

Finally, the Wave plugin detects about 40 accessibility errors and about 30 contrast errors.

We had previously discussed the subject of sober sites, but here we are typically on a site where a very busy design and too many third-party scripts greatly degrade the user experience. This is particularly true when we look at the measurements during the pause stages:

Ideally, there should not be any data transfers or such sharp spikes in the battery discharge rate. This may be due to third party services or animations.

Datagrid.co.jp

For this site, the loading never really ends, as the Firefox developer tools show:

The stats here (including loading time) never stop increasing.

The site is undoubtedly interesting from the point of view of pure design but it is a site that is absolutely not usable:

-The perpetual movements (without the possibility of control) will make it inaccessible for some users.
-The continuous requests to about fifteen domains will put a strain on the data plan of some users.
-Contrast errors are indeed present and keyboard navigation is more than laborious.

All this results in an environmental impact more than consequent with continuous data transfers and solicitation of the battery of the smartphones used, even in background.

Webflow.com

The remarks on the two previous sites apply largely to this one. When loading, there are more than 200 requests for 2 MB transferred. Indeed, there are more than 57 domains, which corresponds well to the slogan of the site proposing to make your website a marketing asset.

If the size of the images is rather well controlled, most of the weight of the site comes from the JS with more than 100 requests of which a dozen are more than 100 kb each.

The lazy-loading of the images does not seem to have been implemented and the design of this homepage seems to be much too heavy anyway.

On the other hand, the errors reported by the Wave plugin are almost non-existent.

In short, there is still work to be done in order to make this homepage more sober, to better integrate certain elements but also to limit the use of third party services.

Additional analysis of top-ranked sites

Ladispensadelchianti.it

This site is rather light (just over 1 MB) and fast to load. We still get 60 HTTP requests for the first load, spread over 15 domains.

This homepage is visually rich but remains clear. The images are optimized (especially through the use of webp format). It is regrettable that lazy-loading is not implemented.

The cache is globally well managed, which is a very good thing.

On the other hand, we notice that the fonts are rather large, for a total of 5 requests. It would be better to use system fonts or a variable font to limit the number of requests.

Also, from an RGPD perspective, it would be best to avoid Google fonts or host them yourself.

Some accessibility errors appear with Lighthouse.

Animations should be limited to the scroll and cursor movement effects seem superfluous (even harmful for the user).

Ingridparis.com

This site is apparently quite sober. No requests to third party services and globally optimized images but too many. The implementation of lazy-loading (preferably natively) would be a very good thing.

The loading time is made longer by the default loading of a 1 MB video and about 20 requests for the fonts alone.

On the other hand, the cache is implemented on almost all elements.

Even if Wave reports few accessibility errors, animations should be less present at the scroll on the page. Currently, they make the scroll step the most impactful step from the point of view of the battery discharge speed.

Azzerad.com

The trend observed so far seems to be confirmed: many images (optimized but most of them are loaded twice) and many animations.

15 queries just for fonts but not many queries to third party services.

In short, a site that would benefit from being a little more sober in its presentation and from going further in the technical optimization to avoid that the efforts (especially image optimization) are cancelled out by bad practices (such as double loading of images).

On the Wave side, some accessibility errors come up but mostly contrast problems.

Data projection to measure environmental impact

We went further in the analysis by carrying out a data projection in order to obtain additional details, notably on the CO2 impact, the water footprint and the soil footprint.

Here, energy, data exchange, CPU and memory usage are directly measured on the device. The environmental impact and Ecoscore (based on the measurements but also on the application of good practices) are calculated. You will find the details in the dedicated article on the blog. It is thus possible to compare the different sites, classified here according to their Ecoscore (the higher the better).

version	ecoscore	CO2 impact (gEqCO2)	requests	Energy (mAh)	Data exchange (Mo)	CPU (%)	Water footprint (Litres)	Surface footprint (m2)	Memory (Mo)
hskr.ru	60	0,30	23	5,45	1,82	2,71	0,05	0,61	682,42
ladispensadelchianti.it	75	0,31	56	4,73	1,57	1,14	0,05	0,55	511,82
ingridparis.com	65	0,36	38	5,54	3,59	2,11	0,06	0,63	632,50
azzerad.com	63	0,38	75	5,59	1,98	1,50	0,06	0,65	735,91
marcoambrosi.salon	52	0,41	47	5,81	4,75	2,44	0,06	0,67	701,52
once-lifetime.com	45	0,45	56	5,73	6,37	2,24	0,06	0,66	734,36
grege-interieurs.com	39	0,64	26	11,20	6,80	5,06	0,11	1,25	746,73
webflow.com	33	0,67	179	6,34	7,17	3,21	0,09	0,80	863,02
lamalama.n	42	0,71	21	9,71	13,42	4,71	0,10	1,09	828,77
blueyard.com	56	0,72	50	8,02	15,13	2,56	0,10	0,92	575,93
datagrid.co.jp	29	0,80	128	9,34	11,02	3,15	0,11	1,10	671,31
betterup.com	27	0,81	121	11,28	7,85	3,51	0,12	1,31	862,15

Conclusion

When the design of sites must be judged or compared, those that come out on top are often sites offering a profusion of images and other visual effects such as animations or video. Even if these design choices can be more attractive or entertaining, they often harm accessibility but also environmental impacts… and therefore, ultimately, the users themselves.

Even when looking for sites specifically dedicated to sustainability, one finds examples with numerous accessibility errors or transferring files larger than 5 MB when loading.

On the Awwwards site, usability is indeed one of the criteria taken into account. However, a quick look at the scores shows that even for betterup.com, which has many accessibility errors, the usability score is often very high. It is normal that a subjective element, often linked to personal experience and the perception one has of such creations, comes into play. Nevertheless, an objective measure should allow to relativize and nuance the statement, as well for accessibility as for sobriety (even performance). These additional constraints could be a source of creativity and give rise to innovative user experiences while remaining respectful of users and the planet.

Get in touch

Digital sobriety at Greenspector

Posted on August 24, 2022August 25, 2022 by Laurent DEVERNAY

Reading Time: 6 minutes

As we talk more and more about digital sobriety, it’s important to come-back to this notion. Especially it’s a part of greenspector activity.

Definition

Digital sobriety is a global approach of digital, respectful of the earth and people.

Since few years, this topic takes more and more extent. We see this notion almost everywhere but often limited in consideration of environmental impact. For many Eco-design has been the gateway into the digital sobriety.

Eco-design and digital environment impact consideration
Digital accessibility and inclusion
Attention economy
Respect for personal data and privacy protection
Cybersecurity
Ethics
Low tech and fight against technological solutionism

Eco-design and digital environment impact consideration

Various aspects of digital sobriety

Environmental impact consideration plays a crucial role in digital services. Beyond resources consumption related to their use (for example, energy needful to charge the battery), these services affect the user’s equipment: battery and components wear, memory and system surcharge… Those impacts motivate early change of latest and newer equipment.

However, today, the manufacturing of those equipments represents the phase of digital services with the greatest impact on the environment. It suits to create websites, mobile applications, and other digital services with as low impact as possible.

That’s why the repositories have been increasing. Examples include the GR491 of INR, the RGESN of DINUM, the 115 best practices or OPQUAST.

Add to this the law REEN as well as tools for evaluating the impact of digital services

Finally, we observe that the subject is gaining momentum and structuration. We can only delight even though there is a long way to go.

The benefits for users and companies are considerable. Overall, this approach improves the user experience (and in particular performance) as well as reduces development, maintenance and hosting costs. Similarly, the adoption of eco-design leads to the development of expertise, an improvement in brand image and constitutes a factor of attractiveness for customers but also for future employees

As a result, an eco-designed digital service will often have a smaller scope, which will facilitate its security, its compliance for accessibility and will tend to restrict the personal data collected.

Eco-design also tends to ignore mechanisms aimed at capturing attention (infinite scroll, autoplay of videos, excessive notifications, etc.). This also constitutes an ethical advance: the user is no longer just a consumer who must be retained by all possible means. We gain their trust and support by first providing them with quality service, tailored to their expectations.

Finally, by placing the user at the center of considerations, digital sobriety tends to avoid technological solutionism. This will avoid (among other things) going to digital services when it does not seem necessary. Sometimes a good old SMS can replace a website or a mobile application: a low-tech solution can meet user needs just as well (sometimes even better).

At a time when more and more services (including public ones) are becoming digital, the accessibility of digital services is a central subject, in a process of inclusion and access to services for all. Unfortunately, this important subject does not yet receive all the attention it needs, although many tools exist and are being developed. The standard (RGAA) is now in its fourth version and the legislative framework extends to public structures as well as companies whose turnover exceeds 250 million euros. It offers a concrete approach to WCAG: a complete panel of W3C recommendations for accessible web content. Verification tools are numerous, even if they are not sufficient to verify all the criteria.

Yet, even today, 97.4% of the most used websites have at least one accessibility error. The compliance with administrative procedures is also far from what one might expect. Accessibility nevertheless remains an essential subject for digital sobriety technology and contributes to ensuring the usability of digital services as well as their sustainability.

Beyond the penalties incurred by companies in the event of non-compliance with obligations, the benefits of this approach are numerous :

Ensure that everyone can access the services and information offered under good conditions.
Reach as wide an audience as possible, in particular via the curb cut effect.
Develop internal expertise (retention of employees and attractiveness for recruitment).

The attention economy is a field relatively little known as such, although it is already deeply rooted in our daily lives. These are all the mechanisms (design, design, functional, and others) that make us addicted to our smartphones and certain apps. We are talking here about captological mechanisms (or deceptive patterns): infinite scroll, notifications, modals, autoplay, etc. Through these design choices, the time spent on our mobiles increases, and our attention span decreases. The stake around our attention is above all financial. All this is detailed in the book The Goldfish Civilization and structures such as Designers Ethiques have already taken up the subject.

This problem is all the more fundamental since we find ourselves faced with tools designed to spend as much time as possible on them, even though their use has a non-negligible environmental impact (via the wear and tear of the terminals, their energy consumption but also by ultimately pushing consumerist behavior, in particular through massive exposure to advertisements). It should be noted that in addition to these harmful impacts on the environment and the individual, there are ethical considerations since this system often results in greater collection of personal data.

Regarding personal data, the question is not new, but the implementation of the GDPR was an important turning point. The aim here is to regulate the capture and storage of personal data of European citizens but also by European companies. This complex subject is particularly linked to micro-targeting (targeted advertising based on data collected on the Internet user) and is all the more dizzying in that it involves companies buying and reselling personal data (data brokers, all against a background of surveillance and political issues as in the case of Cambridge Analytica). More recently, the subject of personal data has returned to discussions following the questioning of the use of Google Analytics and Google Fonts, particularly in France. Not to mention the leaks of personal data that occur very regularly.

Cybersecurity is present everywhere, through security breaches and other incidents that we hear about regularly. Today, it would seem aberrant or even irresponsible to offer a digital service that is not secure. However, this area requires many skills as well as constant monitoring. Again, digital sobriety can reduce the attack surface of a digital service. In return, care must be taken to ensure that the protection of the user does not force him to update his applications and software too often, under penalty of tending towards software obsolescence. Likewise, open source makes it possible, via total transparency, to prevent the presence of vulnerabilities.

Ethics is a complex but necessary subject in the digital field. It is often at the heart of discussions, especially on the vast subject of algorithms and machine learning, for example in the case of self-driving cars. In order to design a digital respectful of individuals, the question of ethics is inseparable.

Finally, technological solutionism, largely theorized by Evgeny Morozov, warns that digital is not always an appropriate solution. This awareness is all the more essential when we seek to reduce the environmental impact of digital technology.

Digital sobriety as part of the Greenspector’s work.

At Greenspector, digital sobriety is at the heart of our business. Even if our primary concern remains the reduction of the environmental impacts of digital services, all this is accompanied by considerations related to digital sobriety technology. The inextricable links between the different aspects of this subject mean that it is essential to guarantee a global approach so as not to miss an area for improvement, or even to avoid providing a recommendation that would harm the users in one way or another (deterioration of accessibility, security risk, etc.). If the impact is not always directly measurable or the seemingly minimal gain from the point of view of sobriety, other axes such as accessibility, the absence of captological mechanisms, and respect for privacy will contribute to making a more resilient product. This is why (and this is just one example among many), we encourage our customers not to directly integrate content from third-party services such as Youtube, Twitter, and others.

Get in touch

For this, Greenspector supports its customers in the eco-design of products throughout the life cycle of the project, but also in the measurement of consumption and the monitoring of impacts over time, in addition (for example) to an improvement process. These are the principles that we also apply to our own products.

In order to work for a digital system that respects people and the planet, it seems essential to apply these values right down to the proposed working framework: allow everyone the possibility of teleworking as much as necessary, insist on the right to disconnect and give everyone the opportunity to adapt their schedules to their own needs. There is also the desire to free up time for everyone to carry out digital monitoring, to create spaces to share the results of this monitoring and to support the development of skills.

Resources to go further

The resources to become aware of digital sobriety are multiplying, but here are already two good starting points :

Does a sober site have to be ugly?

Posted on July 11, 2022July 12, 2022 by Laurent DEVERNAY

Reading Time: 8 minutes

Today, we focus on a question that comes up very often when we address the question of web eco-design or digital sobriety: is an eco-designed site necessarily ugly? Often, the request consists of obtaining examples of “pretty and eco-designed sites” (preferably with a purpose similar to the current project). Specialists in web accessibility have no doubt encountered this type of question frequently. It is already not easy to define what would be, in absolute terms, a “pretty” site. The concept is itself very subjective.

Quick access
Eco designed Sites Ranking
Methodology
Ranking Analysis
Conclusion

We will therefore proceed differently. We will first compile a list of sites that are sober. There are lists and directories for this, which will be listed later. After compiling the list, we will do a quick analysis to exclude sites that are not as sober as advertised (too much data transfer, too many requests, etc.). Finally, we will use the Greenspector tool to decide between them (by classifying them and identifying those that are more impactful at first sight).

Finally, armed with this list, we will look at what they look like and try to identify design trends, depending on their purposes (an information site does not necessarily look like an e-commerce site or a web agency, for example). Moreover, it will provide an opportunity to keep in mind other aspects of Digital Sobriety, such as accessibility. Having a site that is light and pleasant to look at does not make sense if it is unusable for part of the population.

The purpose here is to offer a list of websites with a lower environmental impact. Everyone is free to find those that seem attractive to them and that correspond to their expectations (in terms of purpose, target, etc.). Thus, this list could be a source of counter-arguments concerning eco-designed sites which would necessarily be ugly. It can also be a way to find sources of inspiration in order to design eco-designed and attractive sites.

Where are the sober sites?

We have chosen to go through the lists and catalogues of sober sites, with the bonus of other sites crossed elsewhere.

Here are the lists in question:

There are probably others, but this is already a good starting sample. If you have others in mind or want to test your site’s sobriety, do not hesitate to contact us.

A first analysis was carried out with this first list (more than a hundred references in the end). This is mainly based on the Network tab of the DevTools to watch the HTTP requests and the amount of data transferred.

In the end, only about forty sites are left, which are then used for a benchmark with the Greenspector tool.

Sober sites: the verdict by measurement

The benchmark of the selected sites makes it possible to classify them according to their respective EcoScores (the idea being to obtain an EcoScore as close as possible to 100).

Ranking	URL	Ecoscore	Energy (mAh)	Data (Mo)	Requests HTTP	Carbon Impact (gEqCO2)	Water Surface (Litres)	Land use (m²)
1	https://kuroneko.io/fr/	94	4.24	0.14	2	0.18	0.04	0.46
2	https://lesraisonnees.co/	94	4.08	0.21	11	0.19	0.04	0.45
3	https://brawcoli.fr/	92	4.08	0.13	11	0.19	0.04	0.45
4	https://solar.lowtechmagazine.com/	92	4.35	0.35	17	0.21	0.04	0.48
5	https://www.pikselkraft.com/	91	4.35	0.11	3	0.19	0.04	0.48
6	https://amap-chelles.net/	90	4.59	0.34	4	0.2	0.04	0.5
7	https://primitive.wildandslow.fr/	90	4.1	0.16	11	0.19	0.04	0.45
8	https://productfornetzero.com	90	3.99	0.17	14	0.19	0.04	0.44
9	https://www.mountain-riders.org/	90	4.31	0.23	19	0.21	0.04	0.48
10	https://fairness.coop/	89	4.28	0.09	14	0.2	0.04	0.47
11	https://jeudi.am/	89	4.47	0.15	20	0.22	0.04	0.5
12	https://www.boavizta.org/	89	4.26	0.27	9	0.2	0.04	0.47
13	https://lowtechlab.org/fr	87	4.09	0.22	6	0.18	0.04	0.45
14	https://www.gov.uk/	87	4.35	0.24	15	0.21	0.04	0.48
15	https://www.treebal.green/	87	4.19	0.8	17	0.21	0.04	0.47
16	https://www.boutique-natali.com/	86	4.84	0.44	25	0.25	0.04	0.54
17	https://designersethiques.org/	85	4.06	0.28	17	0.2	0.04	0.45
18	https://oceanfifty.com/	85	4.63	0.42	14	0.22	0.04	0.51
19	https://anelym.fr/	84	4.64	0.17	23	0.23	0.04	0.52
20	https://lowimpact.organicbasics.com/eur	84	4.65	0.74	33	0.26	0.04	0.53
21	https://www.europeansleeper.eu/en	84	4.33	0.73	31	0.24	0.04	0.49
22	http://www.biocoopmontreuil.fr/	83	4.75	0.53	23	0.24	0.04	0.53
23	https://www.licoornes.coop/	82	4.37	0.17	28	0.22	0.04	0.49
24	https://empreintedigitale.fr/	81	4.26	1.14	26	0.24	0.04	0.48
25	https://www.international-alert.org/	81	4.67	0.83	28	0.25	0.04	0.53
26	https://www.laboutiquedupartage.fr/	81	4.77	0.31	20	0.23	0.04	0.53
27	https://www.light-communication.fr/	81	4.53	0.19	13	0.21	0.04	0.5
28	https://dolo.biz/fr/	80	4.81	1.19	15	0.25	0.04	0.53
29	https://www.polybion.bio/	80	4.88	1.02	10	0.24	0.04	0.54
30	https://zugvoegelfestival.org/	79	4.26	0.52	44	0.25	0.04	0.49
31	https://pathtech.coop/	77	4.55	0.66	6	0.21	0.04	0.5
32	https://dalkia.fr/	76	4.28	0.89	38	0.25	0.04	0.49
33	https://sustainablewebdesign.org/	76	4.88	1.02	43	0.29	0.05	0.56
34	https://palaeyewear.com/	74	4.51	1.19	78	0.32	0.05	0.54
35	https://themarkup.org/	73	5.27	1.13	14	0.26	0.05	0.58
36	https://www.ademe.fr/	72	4.75	0.64	26	0.25	0.04	0.53
37	https://theadccawards.ca/	71	5.46	0.29	6	0.24	0.05	0.6
38	https://flowty.site/	63	6.91	0.35	21	0.32	0.06	0.77
39	https://heylow.world/	62	6.14	0.35	19	0.29	0.05	0.68
40	https://becolourful.co.uk/	60	6.15	0.23	15	0.28	0.05	0.68
41	https://www.ec-lyon.fr/	59	5.06	0.81	43	0.29	0.05	0.58
42	https://www.wholegraindigital.com/	58	8.65	0.65	25	0.41	0.08	0.96
43	https://daviddaumer.com/	50	7.83	0.32	13	0.35	0.07	0.86

For each of its websites, measured on an S7 smartphone (Android 8), the measurements were carried out using our Greenspector Benchmark Runner, allowing automated tests to be carried out. The measurements were taken at the end of June 2022.

Scenario details:
– Loading the website
– Page scroll
– Inactivity website in foreground
– Website inactivity in the background

Each measurement is the average of 3 homogeneous measurements (with a low standard deviation). The consumption measured on the given smartphone according to a wifi type network may be different on a laptop PC with a wired network for example. For each of the iterations, the cache is first emptied.

Find out how Greenspector assesses the environmental footprint of a digital service.

By classifying the results (by EcoScore) and looking at the extremes, we already notice two things:

Some sites have scores above 80 or even 90. This is a rare occurrence and highlights sites that have made an effort to maintain digital sobriety.
Some sites have an abnormally “low” EcoScore. Thus, these are rather light sites, but they are still impactful.

https://daviddaumer.com/ (EcoScore Greenspector 50): few requests on the page, little data transfer. We look with EcoIndex, and the score A is obtained (which is the best possible score). EcoScores drop due to animations that continuously drain the device’s battery. Therefore, by displaying this page, the battery is discharged faster, which increases its wear and predicts the need to replace the battery. It induces heavy environmental impacts, most of which come from the device fabrication. The impact of CSS and JS processing should be limited. Are animations necessary? What are their accessibility and attention capture impacts?

The reasoning is pretty much the same for:

https://www.wholegraindigital.com/ (EcoIndex B, EcoScore Greenspector 58… and some animations, some of which are continuous)
https://www.ec-lyon.fr/ (EcoIndex B, EcoScore Greenspector 59… and a carousel that should be avoided)
https://becolourful.co.uk/ (EcoIndex A, EcoScore Greenspector 60)
https://heylow.world/ (EcoIndex A, EcoScore Greenspector 62)
https://flowty.site/- (EcoIndex B, EcoScore Greenspector 63)
https://theadccawards.ca/ (EcoIndex A, EcoScore Greenspector 71) : the environmental impact of the animations here is far from negligible, the site is also very light and sober. On the other hand, this abundance of visual effects seriously harms the usability of the site, in particular from the point of view of accessibility.

In the end, the examples illustrate the need to consider all factors before claiming that a site is sober or has benefited from eco-design. It is good to make efforts to reduce the number of requests and the amount of data transferred. On the other hand, JS or CSS treatments (more particularly animations) can cancel out a good part of the benefits thus obtained. Especially (and I insist on this point) that these animations potentially have a detrimental effect in terms of capturing attention but above all accessibility. On this subject, I invite you to refer, among other things, to criterion 13.8 of the RGAA (On each web page, is each moving or flashing content controllable by the user?). The most glaring example here is https://heylow.world/ with its very present animations which further impair readability for all users.

Analysis of the ranking of sober sites

We started with what to avoid to produce an eco-designed website that is visually pleasing without sacrificing usability. Let’s now take a closer look at the sites to extract relevant examples.

We can already consider the list of sites with an EcoScore > 70% as sites on which a sobriety effort has been made. It remains to be seen what can make them attractive and which ones to highlight.

Note: to avoid possible bias, we haven’t included the Greenspector site has not been included (even if its EcoScore is around 72).

E-commerce

The list contains 3 e-commerce sites:

https://lowimpact.organicbasics.com: as of this writing, the standard site is under maintenance. In the “low impact” version, the choice of sobriety is clearly displayed. The focus is on simple shapes (via SVG) and solid colours. On the other hand, it is regrettable that this version is not the default version of the site. This significantly undermines the impact of this approach.

https://palaeyewear.com: the homepage is rather light and pleasant. It includes the classic elements for such a site: a video (integrated soberly), some products, consumer opinions, some news, an impact report, etc. Several good efficiency practices are not respected but this page is doing better than most other e-commerce sites. Everything gets complicated when you access a product sheet. Here, more than 100 requests and several MB of data are transferred. The eco-design effort should therefore have been pushed further, in particular by basing itself on a user journey (navigation and purchase of a product) rather than only on the home page.

https://www.boutique-natali.com: On this page, we also find several elements specific to this type of site (current promotions, reinsurance elements, products highlighted, etc.) in addition to highlighting the eco-design approach implemented. The same sobriety can be found on the product sheets. Admittedly, some types of products sold online probably require more images (for example in the field of fashion or cosmetics) but in my opinion, this is a good basis for thinking about designing an online store. light and pleasant to use.

Magazines and online press

https://themarkup.org is a sober and elegant site at the same time, which is all the more remarkable for the online press. These sites are usually weighed down by advertising and trackers, among other things, which is not the case here. An important site to keep in mind is an example of an eco-designed online press site. Be careful, however, the lightness of this site compared to other similar sites is partly due to choices of an economic model. Once again, this highlights the role that all the actors of a project have to play on the subject of digital sobriety.

https://solar.lowtechmagazine.com: This is probably one of the best-known examples. The radical choice of environmental impact reduction is clearly displayed here. This will not necessarily be unanimous (notably because of dithering).

We find a similar logic on the Designers Ethiques site (layout similar to an old-fashioned paper newspaper for a more sober result) or even (for the structure) on that of Pikselkraft. The Low-tech Lab site, if it takes up certain elements, goes to a page richer in content and with a less rigid structure. The home page then seems more attractive and the content easier to identify.

Others sites

https://lesraisonnees.co: a scroll-based one-page site. An agency site with classic content but produced in a very sober and efficient way, very clear. A very good example.

https://brawcoli.fr: the classic elements are grouped together on a single page, putting well before what this restaurant offers.

https://primitive.wildandslow.fr: we find in the list of many agency sites or freelancers specialising in the creation of sober sites (which is logical and even reassuring). The idea is generally to present everything on a single page with solid colours and few images (all optimised). Primitive by Wild&Slow is quite representative while standing out, among other things, for areas with non-linear contours. In other cases, the emphasis is on geometric shapes rather than more complex images.

https://www.treebal.green is a much richer variant graphically and for all that quite sober.

https://www.mountain-riders.org is a good example of using the principles seen above with a very contrasting graphic charter for a clean and attractive final rendering.

Although it may seem less attractive than others, https://www.gov.uk shines with its lightness and accessibility. Great efforts have been made here at the level of information architecture. It is in any case interesting to have here an example of accessible and sober public service.

Even if continuous and ubiquitous animations are to be avoided, some lightweight sites use them sparingly:

In any case, it is advisable to keep in mind the accessibility as well as the fact that this type of addition is only cosmetic. For some sites like https://dolo.biz/, the attractiveness of the home page relies heavily on the animations but everything remains efficient and rather pleasant (even if it will not necessarily be practical for everyone’s navigation, in particular, the keyboard).

In a totally subjective way, I also retain https://zugvoegelfestival.org for the choice of colours and navigation on the home page. It is just unfortunate that the various navigation elements on the site are not available (at least by click) upon arrival on the site.

And a last special mention for https://sustainablewebdesign.org which uses geometric shapes, and bright colours and emphasises accessibility while being a mine of information on web eco-design.

Conclusion

The ranking presented here should give you a better idea of what is possible with a sober website. This list is expected to grow over time and serve as an inspiration for those who wish to create sober websites.

One must consider accessibility when using a site and dig as deep as necessary into the notion of sobriety if the feeling one can get is partly subjective.

Metaverse and Digital Sobriety

Posted on June 22, 2022June 22, 2022 by Laurent DEVERNAY

Reading Time: 5 minutes

The concept of the Metaverse isn’t new, and some may even remember Second Life, some consider it to be its first manifestation. The idea is to offer a virtual environment via what is now called XR (eXtended Reality), a mixture of augmented reality (a bit like Pokemon Go) and virtual reality (the older ones will think of the film The Lawnmower Man but we will prefer the example of Oculus Quest).

In October 2021, Meta (formerly called Facebook) announced that it was going all out on the subject of the Metaverse. A huge amount of investment is needed to create 10,000 jobs and train those who will work in this field. Many large companies have followed suit so as not to miss out.

The ultimate goal would be to provide users with a potentially 3D immersive environment where they could find their favourite brands and interact with whoever they want without leaving their homes.

Coupled with cryptocurrencies and NFTs, the metaverse would even be one of the pillars of Web3.

Like connected glasses, this is a digital Arlesian, and we are entitled to wonder if this new attempt will be successful this time. Except that the real question is whether the metaverse is compatible with current issues related to digital, which we find in particular through Responsible Digital.

Metaverse and Digital Sobriety

By taking up the main challenges of Responsible Digital, let’s see what we can expect from the metaverse.

Accessibility

While more than 96% of websites have at least one accessibility error, the accessibility of the web as it exists today remains very problematic. Likewise, remember that access to the web remains complicated for a large part of the world’s population, whether due to an outdated device, an insufficient internet connection or simply insufficient skills to be able to fully use the digital tools. Including these three issues, Digital illiteracy affects 17% of the French population.

In such conditions, it’s a safe bet that the metaverse will not come to fix things. In the metaverse, those who are unable to access the web in satisfactory conditions today will probably be left out. Not to mention that the prerequisites in terms of the device power and internet connection may be much higher (but we will come back to this later).

Security

Digital illiteracy has a substantial impact on security: if individuals are not sufficiently prepared to use digital tools, they are exposed to risks they cannot control. There is no doubt that the metaverse will come with new attack opportunities. We can already imagine to what extent such an immersive universe and today also linked to major brands can offer new vectors for phishing. It is also to be feared that, in order not to interfere with the immersion or the comfort of the users, safety takes a back seat.

Capturing (and manipulation) attention

Attention capture (see French CNUM report in PDF) consists of setting up design mechanisms (scatological mechanisms or dark patterns) to retain the user’s attention for as long as possible. In the metaverse, one can imagine that this will only get worse, one of the objectives being immersion. We are exposed to more than 5000 advertising stimuli each day, especially via the web. Based on the list of companies contributing to the metaverse, this is unlikely to succeed.

How, under these conditions, will our filter bubble evolve? Is there not a risk of seeing the influence of certain digital players on the political context increase? Should we be worried about Meta taking over the subject of the metaverse (in short: yes)?

Here are just a few questions among many others (on the moderation of this new shared space, the rights to the content that will be (re-)produced there, etc.).

Digital Sobriety

It is interesting to consider the metaverse from the angle of environmental impacts.

You will quite easily find experts extolling the merits of the metaverse to unclog the roads, project yourself into spacious offices at a lower cost, perform surgeries from the other side of the world, etc.

It’s always thrilling to hope that someone will come up with a product that solves a whole host of issues we didn’t even know existed. In this specific case, I would be in favour of the Design is the Problem approach. Nathan Shedroff explains how to rethink design in order to come up with truly sustainable solutions. He takes the example of the Segway PT, a personal, electric and removable/repairable transport device. Presented in this way, one would think that it would be a good idea for the planet. Except that the real concern of this device is that it does not meet a real user need. Indeed, public transport, cycling and walking can ideally replace it, with a much lower impact and financial cost. Any resemblance to electric scooters is purely coincidental (or not).

The metaverse poses the same problem in its very concept: it seeks to meet a myriad of diverse and varied needs, even though less impactful and costly alternatives exist. Only its technical and innovative varnish promotes its adoption and leads large companies to blindly embark on it.

In order to assess the environmental impact of the metaverse, several elements must be considered.

On the one hand, generating and displaying an immersive virtual environment is very resource-intensive. Below 90 fps, the user is exposed to nausea and dizziness. In addition, in recent years, everyone has been able to discover increasingly magnificent 3D virtual environments (largely through video games). It, therefore, seems essential to align with these types of visuals, which will be costly both for their products and for their display.
On the other hand, the use of the metaverse (in particular taking into account the elements indicated in the previous point) will probably require better user equipment (even new user equipment) as well as an internet connection with a very high speed (would not be -what to display a virtual environment while holding the 90 fps). Knowing that very logically (and this is also what we have clearly seen with video games), renderings and attendance should (if all goes well for the metaverse) increase over time, encouraging the race to renew equipment.

Even as initiatives are multiplying to reduce the environmental footprint of digital technology, the arrival of the metaverse, therefore, represents a major risk.

Conclusion

Efforts to extend Responsible Digital principles to the web are increasingly intense, and the work is already colossal. The arrival of Web3 and more particularly of the metaverse risks making these principles all the more essential but also more difficult to enforce. It seems (for once) easier to generate jobs and spend crazy sums for a concept whose usefulness remains to be proven than to work to make the web less impactful and more accessible for all.

The metaverse may indeed be designed with an eye to efficiency, or may even follow certain principles of Responsible Digital (though I seriously doubt this). In any case, the very nature of the project suggests that sobriety is not considered. It is all the more regrettable as the Digital Responsible itself contains the elements and principles that would help the achievement and adoption of the metaverse. However, the priorities seem to be different, and we can only regret to see once again the means of concentrating on something that will probably not contribute to making the web better. In the end, the metaverse seems to go against the efforts needed to mitigate climate change.

CAPTCHA and digital sobriety

Posted on May 9, 2022May 10, 2022 by Laurent DEVERNAY

Reading Time: 3 minutes

Security is an essential part of responsible digital. It is not uncommon to wonder how to protect your site, especially when you allow the possibility of sending content from your website: form (in particular contact), comments, etc. We know that a good part of the activity on the web is not due to humans (How much of the internet is fake?). Nobody wants to undergo an injection or other malicious act via their website.

At the end of the 90s, a miracle solution appeared in the form of CAPTCHA. Today, we find this component almost everywhere. You may need to copy difficult-to-read characters, click on photos with different elements, or click on a box to confirm that you are not a robot.

But what about its environmental impact? How to reconcile it with digital sobriety? That’s what we’re going to see here!

Looking for the best solution

The CAPTCHA meets the need to secure the data submitted by Internet users on your site.

The problem is that this way of doing things, among others with reCAPTCHA, is often laborious for users. Additionally, the user journey is longer, which increases the environmental impact of digital services when it does not result in abandonment altogether. Especially for users with disabilities who may find it impossible to complete the task. Not to mention the additional requests (CSS, JS and other iframes) necessary to integrate this type of component into a page.

Thus (and this is an essential point of responsible digital), the search for the soberest CAPTCHA takes accessibility into account first.

The accessibility of CAPTCHAs is a recurring problem, and there are many solutions. The main watchword here is not to use CAPTCHAs. Thus, form security should no longer be the responsibility of users. The subject has been previously discussed, among others at Orange.

There are several possibilities:

Identify the entry time to exclude entries that are too fast
Use a filter (regular expression or other) to identify suspicious responses
Randomly add a question that a bot will not necessarily be able to answer (“Which animal is barking?”, “How much is one plus one?”, “How many d’s in pudding?”, etc.). By leaving the possibility of refreshing the question in case of difficulty for the user.
The honeypot (to which we will return)

In the end, it is the honeypot solution that seems the most adequate in most cases. Detailed elsewhere on a Canadian government site, it consists of adding a hidden field in the form concerned. This field should be set to be filled out only by bots. It does this by hiding it from users and assistive technologies while giving bots code elements that make them think it’s a required field. This means that when validating the form, responses with this field filled in should not be taken into account. While the honeypot requires some thought for flawless implementation, it remains very light and elegant because it keeps the focus on the original goal: to prevent bots from sending data through a digital service. Rather than impacting the user to ensure that he is not a robot, we leave the user journey intact to focus on bot detection.

Conclusion

The example of CAPTCHA proves to be representative of a responsible digital approach. In order to improve the security of a digital service, we are first interested in the accessibility of possible solutions (the free and widely used solution not being here again necessarily the best) to finally ensure via digital sobriety that the chosen solution does not degrade the environmental impact of the service.

Resources to go further

How to make CAPTCHA accessible to everyone

Cleaning up bad bots (and the climate)