documentation
There is a lot of knowledge about digital technology around, maybe not in particular how it works but what one can do with it. But there seems not so much knowledge or let's say culture in responsible use. In this regard one of the lessons learned by looking at a vast choice of web design frameworks is not to use them; but if there is something to say, communicate, design and good reason to do something – here are a few insights from building an online shop for immaterial values.
framework ecosystem
Even when dealing with a small thing like this online shop, it makes sense to start by looking at the bigger picture.
“It is too easy to forget that every entrepreneurial act, even recycling, is itself a tax on the ecosystem.”
Helen Mayer Harrison and Newton Harrison state this from an artistic perspective. From a designer's perspective, Tom Jarrett puts it this way:
„There’s a need to reconnect the digital to the physical, from minerals and energy to the physical infrastructure that powers the internet. We have to repurpose our digital design processes to consider and reflect these ecological needs, instead of optimising only for business and growth objectives, to achieve more transactions, interactions and attention.“
The fundamental question when designing this online shop is the question of balance. Does the benefit, the sense of telling a story here, outweigh its cost in terms of resource consumption? Answering this question requires the development of a feeling for the use and finite nature of resources.
social frameworks
An online shop as an artistic project makes it possible to choose less benefit (on a small scale) and more balance (on a large scale). It is difficult to justify „less“ in the everyday life of a society that believes in progress, where people perhaps also think of themselves in competitive relationships. „Growth“ is an argument that already carries the justification within itself. The reverse is true in the case of „reduction". Even if it brings benefits in the long term, it is suspect. (Perhaps because accepting it would make too much questionable?) Under these conditions, the question „What do I really really need?“ can be answered for oneself; however, as soon as a network of people is directly and indirectly affected, we become familiar with the inertia of current social values.
how much is it
A lot is necessary and happens to a product before it ends up in a store. But the consumer does not need to know about any of this, according to the economist Friedrich Hayek in his 1945 text „The Use of Knowledge in Society“, because all he needs to know is the (monetary) price: how much it costs. The problem is that many costs do not play a role in the price.
The few large corporations and, in the shadows, the countless small offerings are optimizing themselves to uniformity via the price: „feed-based interfaces that display algorithmically ordered content in a near infinite timeline that can consist of auto-playing videos, photos, gifs, advertisements, text and links“, as designer Tom Jarrett summarizes it and draws the conclusion from it:
„Design is being dictated by goals to increase engagement, advertising interactions and data collection, not user experience. It seems like this could also have a direct relation to the digital platform’s energy consumption and carbon impact.“
If the question is what does it cost, then price is only one factor among many.
human in mind
In public relations, the individual is often addressed, for example in climate protection. Each one of them has to change its behavior - and conversely, companies and institutions succeed in freeing themselves from responsibility, or at least can distract from it.
„There are users and there are coders.“, says artist and designer Silvio Lorusso and the way the roles are currently interpreted results in „impersonal computing“. Smartphones in particular contribute to the fact that the possibilities of leaving pre-programmed paths are decreasing. The devices and interfaces of software are designed in such a way that people cannot make them their own. Services only save time as long as you follow the pre-programmed path. Building an online shop from people's point of view means giving them as much freedom of choice as possible and a sufficient knowledge base so that the individual is able to do what seems right to them.
attention and deception
With „the economy of attention" architect and software developer Georg Franck formulated a theory for the practice that defines today's digital platforms, namely: stealing people's time in order to sell the data generated in this way. The endless stream of content – inserts, notifications, automatically loaded media, animations ... – abuses human behavior.
Designing websites in such a way that people end up doing what the coder wants them to do is known as „deceptive patterns" or „dark patterns". The website deceptive.design lists countless of these techniques.
The irony of a work that (almost) dispenses with these methods is that it quietly promotes responsibility in a noisy environment.
privacy by design
People invest a lot of time in monitoring other people in as many parts of their virtual lives as possible. Cookies are one element of this. In addition to the social consequences, their enormous use now also has ecological consequences. In her project „carbolytics“, Joana Moll analyzed the top 1 million websites and discovered unimaginable quantities of cookies. The amount of data alone is enormous, plus chain reactions of computing processes for evaluation (some of which consume energy on the devices of the 'users' themselves) and, as a result, increased consumer activity.
Even if the selection option „only non-essential cookies“ suggests that a website would not work without cookies: Even an online shop can do without them!
Something else at this point: Increasingly, data exchange between server and browser is encrypted via HTTPS to protect it from third parties. This strengthens privacy - and requires computing power. In her paper „Power Consumption of TLS: How the Additional 'S' in HTTPS Impacts the Power Consumption of Power-Pluggend Devices“, Amra Čaušević looks at the technical basics.
technical frameworks
Anyone who sees a website as a long-term commitment has good reason to do without one of the many frameworks as the basis for a website. In his text „Minimizing Computing Maximizes Labor“, Quinn Dombrowski cites the example of Flash-based websites which rendered inaccessible and unusable as soon as Flash stopped being widely supported. At this point, transferring the content to a new framework fails due to a lack of resources. This usually already applies to upkeep and maintenance. Relying on the web standards HTML, CSS and Javascript has so far proven to be more durable and 'sustainable'. There are also well-documented examples and definitions.
Coding a website from scratch requires the developer to understand how to make decisions that deliver efficient code and minimise resource requests. The ability to maintain and update code regularly helps eliminate inefficiencies and further improves a website’s long-term energy efficiency.
This type of „minimal web development“ can be described as the luxury of those who have the necessary know-how; however, the question is how long can one afford the luxury of using things that one don't actually understands or that only work with a great deal of energy?
being part of a power grid
The shift towards renewable energies also means a culture of variable energy supply; the sun does not shine at night, the wind turbine stands still when there is no wind. As an example of a resource-saving website, „Low Tech Magazine“ has a solar-powered website, „which means it sometimes goes offline“.
For this reason, the online shop has opening hours in order to consume less energy at times of high load on the power grid. For the Apache Server software, which many web servers use, such a time switch can be implemented using the .htaccess file.
Before such considerations, the first step is probably to decide in favour of a web host that uses renewable energies for its infrastructure. The Green Web Foundation is a first port of call for an overview or a test of your own website.
less media as a message
Of course, the easiest way to cut back on the data size and therefore energy use of a website is using less media content. But if the decision is made in favour of using media, there are ways and means of using them as moderately as possible. Depending on the application, downsizing, compressing or saving in special file formats make sense.
A technology from the 1970s, "dithering", was used for the image files of the online shop. This reduces the number of colours in the image and simulates colour depth by using patterns. The algorithm used here was described by the physicist Bryce E. Bayer in his paper „An Optimum Method for Two-Level Rendition of Continuous-Tone Pictures“ in 1973, which is efficient in terms of both storage space and computing power.
static site as content managment
The most common content management systems (CMS) use databases and server-side computation. The systems are therefore so large that even the smallest content has space in them; so often too much of a good thing.
The content of the online shop is created as static sites in HTML, as they are unlikely to change in the foreseeable future. The files are sent straight to the browser. The browser can save them locally and, as long as the content is the same, load them locally when they are accessed without having to download them again.
If the number of subpages exceeds a manageable level, static site generators (SSGs) are a compromise between using a hand-coded static website and a full CMS, while retaining the benefits of both. SSGs generate static HTML pages during the build process, eliminating the need for server-side processing when a user requests a page. This approach reduces server workload and energy consumption, resulting in a more efficient website. Popular examples of SSGs include Jekyll, Hugo, and Gatsby.
generic fonts
Generic fonts such as Arial, Times New Roman, Courier or variants thereof are most likely to be available on all operating systems, whether Linux, Windows or Mac. For the online shop the generic fonts Arial and Times New Roman are used to display the text without the need for additional server requests and the download of font files.
color palette
The online shop incorporates a dark and a bright theme. By being able to switch between color modes users are able to read comfortably and with a minimum of screen brightness. If in a dark environment, it is much more comfortable reading a white text over a black background; while if in a light environment, the opposite is much better.
It is difficult to determine which color palette is saving the most energy. There is no such thing as a perfect theme for every screen type, usage behaviour and light condition, although in some modern screen technologies like AMOLED (where a black pixel is just a LED being turned off) there seems to be a significant advantage in using dark themes.
further reading
Branch Magazine: A Sustainable and Just Internet for All – branch.climateaction.tech
Low-tech Magazine underscores the potential of past and often forgotten technologies and how they can inform sustainable energy practices. – solar.lowtechmagazine.com
Examples of low-carbon web design and development – lowwwcarbon.com