Website Case Study

View website

Overthere Link

Page weight: 53.88 KB

Carbon per page view: 0.017g homepage

A sandbox for web sustainability aims to be a lightweight alternative to “Link in Bio” services. It started as a side project to explore Kirby CMS but quickly turned into something more serious when I tried to integrate sustainability into the process.

With this project, I’m exploring how to include sustainability in every facet of a digital product. Small improvements over time make a tiny but meaningful contribution to the planet.

Making a low impact website does not have to be a constraint. It could be seen as a sandbox in which you would be surprised by the solutions you could find. For example , on the landing page, you can see alternative skins on mockups if you want to. But rather than loading a new image every time, a few lines of javascript will apply a bit of CSS to change the colour variables of the said mockups.

Some specs

  • The service is built on the flat-file CMS Kirby. It is green-hosted at Infomaniak (Swiss) and renders a static profile page to reduce the server’s workload.
  • Every asset is compressed as much as possible (including fonts which are subsetted to reduce their amount of characters). The product also applies a strong cache policy to limit bandwidth usage.
  • The user portal and content saving rely on PHP. It’s coupled with raw javascript and preprocessed CSS (SASS) in the frontend. No dependencies.
  • It avoids superfluous code as much as possible. This means goodbye analytics! The less data, the better. The data, which could be sensitive such as payment information, is handled with Gumroad. It has a really easy-to-use API to generate user licences and subscriptions.
  • Premium users can also track (with a homemade code) their carbon impact based on the number of page views. This feature has room for improvement but it is already good to raise awareness.

In the end, a profile page with weighs around 30 to 40kb which is far less than similar services. Profiles are statically served to improve loading performances.

Beyond these technicalities

To create a sustainable digital product, good design practices and code efficiency are important. But it has to go further than that.

Also, I believe a digital product should limit its impact beyond its URL. Here are 2 leads I followed:

  1. I decided to monetize the project and use revenue wisely. At the end of each year, benefits are split between green projects (long-term investments) and NGO donations. A bit is kept to pay for the servers and marketing.
  2. Ha yes, marketing, let’s talk about it. Until now I’ve been reluctant to create an ad campaign on Instagram. The bandwidth usage goes quickly through the roof. I created a little set of rules to limit the impact of the posts. It prefers quality over quantity, with a simple image or very short video loop instead to reduce the size of a post. The fact that the content could help raise awareness also makes the communication somehow useful and educational.

More from the case studies