Na meer dan tien jaar is Lowtech Magazine aan een nieuw webdesign toe. We grijpen die gelegenheid aan om een website te ontwikkelen die bij de inhoud past. Het nieuwe Lowtech Magazine draait op 100% zonne-energie en gaat off-line bij aanhoudend slecht weer.
Waarom een lowtech website?
Het energieverbruik van internet blijft toenemen. Enerzijds omdat we sinds de komst van mobiele telefoons, tablets en draadloos internet steeds vaker online zijn. Vroeger hadden we alleen maar toegang tot het internet als we thuis, op kantoor of in de bibliotheek aan een desktop computer zaten. Nu zijn we altijd en overal online.
Anderzijds blijft de zogenaamde ‘bitsnelheid’ van online media stijgen. Zo vraagt het downloaden van een webpagina nu gemiddeld drie keer meer dataverkeer dan in 2010. Dat is onder meer te wijten aan steeds grotere afbeeldingen en video’s in steeds hogere resolutie. Maar ook reclameboodschappen, cookie-waarschuwingen en slordig geschreven code zijn met de vinger te wijzen.
Hernieuwbare energie is niet genoeg
Datahotels laten draaien op zonne-energie of windenergie – zoals bijvoorbeeld Greenpeace voorstelt in haar jaarlijkse ClickClean report – volstaat niet om het groeiende energieverbruik van internet aan banden te leggen. Om te beginnen verbruikt het internet al drie keer meer energie dan alle windturbines en zonnepanelen wereldwijd produceren.
Daarbij zijn er fossiele brandstoffen nodig om windturbines en zonnepanelen te maken, dus zolang het dataverkeer toeneemt, stijgt ook het gebruik van fossiele brandstoffen. En omdat er niet altijd zon of wind is, moet er ook infrastructuur worden gebouwd voor de opslag van energie – ook dat kost fossiele brandstoffen.
Lowtech web design
Het inzetten van hernieuwbare energie is uiteraard geen slecht idee, maar tegelijk moet ook de kern van het probleem worden aangepakt. De nieuwe website van Low-tech Magazine wil laten zien dat dit perfect mogelijk is. Ze werd gemaakt in samenwerking met web designer Marie Otsuka en kunstenaar Roel Roscam Abbing.
De nieuwe website is zodanig “afgeslankt” dat de gemiddelde paginagrootte nu zes keer lager ligt dan op de oude website, en ongeveer drie keer lager dan die van de gemiddelde webpagina in 2018.
Dat deden we onder meer door de keuze voor een statische website, een techniek uit de jaren 1990 die veel zuiniger is dan een dynamische website op basis van een database (zoals WordPress). We maken ook gebruik van standaard lettertypes die in de browser zitten.
Verder werden de afbeeldingen ongeveer tien keer “lichter” gemaakt door een oude printtechniek toe te passen: lageresolutiebeelden worden omgezet naar zwart-wit en krijgen dan een steunkleur.
Zelf Website Hosten
Omdat de nieuwe blog zo energiezuinig is, kan de website bij de auteur thuis in Barcelona worden ‘gehost’, op de eigen internetverbinding én op zonne-energie. Met een op WordPress draaiende blog zou dat te veel energie kosten, maar met een afgeslankte statische website kan het perfect. Bovendien zijn statische websites makkelijker te onderhouden en een stuk moeilijker te hacken.
De website draait op een Olimex A20, een mini-computer die slechts 1 tot 2 watt elektriciteit verbruikt, afhankelijk van het aantal bezoekers. Het actuele energieverbruik van de computer kan op de blog worden geraadpleegd.
De benodigde elektriciteit (24 tot 48 Wh/dag) wordt geleverd door een zonnepaneel van 50 watt-piek op het balkon. Het paneel ontvangt maximaal zes tot zeven uur direct zonlicht, en door de opstelling is de elektriciteitsproductie erg beperkt bij bewolking.
Offline bij slecht weer
De batterijcapaciteit is zo klein mogelijk gehouden om fossiele brandstoffen te sparen. De server draait op een 12V loodzuuraccu met een capaciteit van 14 Ah. Bij aanhoudend slecht weer gaat de website off-line.
We mikken op een “uptime” van 90%, wat betekent dat de website naar schatting 35 dagen per jaar off-line zal zijn. Een batterijmeter en weersvoorspelling helpen de lezers hun bezoek aan de website te plannen.
Overal Toegankelijk
Een laag energieverbruik is niet het enige voordeel van een afgeslankte website. Ten eerste gaat het downloaden van een webpagina erg snel, ook al staat de server niet op een centrale locatie in het internet.
Ten tweede is een afgeslankte website ook beter toegankelijk voor mensen met oude computers en trage internetverbindingen. De doorsnee website is nu onbereikbaar voor zowat de helft van de wereldbevolking. Bovendien versnellen steeds “zwaardere” websites de veroudering van computers.
Dat een piepkleine server aangedreven door een zonnepaneel op het balkon heel veel verkeer aan kan, werd al snel na de lancering duidelijk. Of zelfs voor de lancering, want de website belandde op de voorpagina van Hackernews toen ze nog in de steigers stond.
Het resultaat waren meer dan 35.000 bezoekers op 24 uur tijd. Zoveel verkeer zou geheid problemen opleveren met dynamische websites geplaatst bij webhostingbedrijven, tenzij er fors wordt betaald voor extra bandbreedte of een upgrade – ook al is die maar af en toe nodig.
Broncode en Handleiding
Eén zuinige website maakt het verschil niet, en dus ondernemen we de nodige stappen zodat in principe iedereen het design kan toepassen en aanpassen. Daartoe hebben we de broncode van het design vrijgegeven en handleidingen gepubliceerd:
- How to build a low-Tech Website: Software and Hardware
- How to Build a Low-tech Website: Design Techniques and Process
- SERVER: [Olimex A20 computer](https://homebrewserver.club/low-tech-website-howto.html#server.
- SERVER SOFTWARE: Armbian Stretch. We schreven technische documentatie voor het configureren van de webserver.
- DESIGN SOFTWARE: Pelican static site generator.
- INTERNETVERBINDING. 100 MBps glasvezel internetverbinding. Hoe configureer je de router?.
- SOLAR PV SYSTEM. 50 Wp zonnepaneel en 14Ah 12V loodzuurbatterij. Handleiding in voorbereiding.
- MEDIA LINKS: onze website in de media.
Reacties
Als je op dit artikel wil reageren, stuur dan een mailtje naar solar (at) lowtechmagazine (dot) com. Je gegevens worden niet voor andere doeleinden gebruikt. Blijf je liever anoniem, sluit dan je bericht af met een pseudoniem.
Reacties
h.honnest
Super interessant, integer, innovatief, bewonderenswaardig en nastrevenswaardig.
Enige wat ik me afvraag is of die 35 ingecalculeerde offline dagen niet zullen gaan leiden tot minder raadplegen van de website en dus ook van al die interessante artikelen die erop staan…
In dat geval zou deze lovenswaardige switch van Low Tech Magazine mogelijk juist kunnen leiden tot een vertraging in de omslag naar een duurzamere wereld…
Misschien dan toch maar een concessie doen om de boel 365 dagen per jaar in de lucht te houden? Of zou dat leiden tot al te ver afdwalen van het ideaal? (lastige kwestie kan ik me voorstellen)
Anna Vester
Geachte lezer
Kan ik doneren door overmaking op een bankrekeningnummer?
Met vriendelijke groet
Anna
Danielle
gaaf en het levert ook een eigenzinnig mooi beeld op.
maar hoe houd je de bots in toom: de niet menselijke bezoeker die inmiddels meer dan 50% van een website bezoek uitmaakt en een behoorlijke bandbreedte aan energie verspilt?
YJoris
Deze mededeling en tegelijk info over een duurzame website was eigenlijk te verwachten Kris, als je consequent wil blijven met het onderwerp. Dank je dat je inzicht geeft van het hoe achter de schermen van een website.
Zelf ben ik nog niet aan een website toe, gezien ik ook al jaren in transitie leef; dwz complete omschakeling van fossiele brandstoffen naar duurzamer leven. Niet simpel allemaal: mijn aardgas heb ik een 4tal jaren laten afsluiten en dus alle verwarming & koken hier op groene stroom, maar ook de batterij van mijn e-scooter laat ik daarmee op; naast mijn fiets en trein/OV het enige vervoermiddel. Spijtig genoeg geen eigen zonnepanelen, ik neem stroom af van ecopower.
Nu ben ik ook toe aan nieuwe batterijen, wat niet goedkoop is.
Betreffende mijn internet? Nog steeds per kabel, niks wifi; ook bewust geen smartphone en gsm gebruik ik slechts één keer op twee maanden of zo, bij een verdere verplaatsing dan nomaal. Ik heb tot op het laatste steeds telefoonkaarten gebruikt in de telefooncabines, tot die dienst ook volledig verdween…
Betreffende websites, zou best een internationaal symbool verplicht moeten gebruikt worden en gezet op elke website, zodat de surfer onmiddellijk kan zien of deze website duurzaam/op groene stroom draait of niet.
Proficiat met Uw aanpak en openheid!
Zelf zit ik er niet zo mee in dat de website soms onbereikbaar is, noch dat het in het Engels moet (maar Nederlands is makkelijker natuurlijk). Groeten.
Henk
We zullen eraan moeten wennen dat energie niet altijd en onbeperkt beschikbaar is, dat zal een klap geven. Met een batterij-lampje een boek lezen en het reisje uitstellen tot de accu van de e-bike is opgeladen met zonne- of windstroom. Maar de meesten zullen blijven dromen van waterstof en atoomenergie.
Kris De Decker
Lezers die liefst doneren via bankrekening: stuur een mail en je ontvangt de nodige gegevens. Dank.
@ Toon
Reacties zijn inderdaad een beetje problematisch. Voorlopig worden ze manueel geplaatst. Dat vraagt wel wat werk, maar dat is meestal beperkt tot de eerste dagen na de publicatie van een nieuw artikel.
Op termijn willen het proces stroomlijnen en ook de reeds bestaande reacties op vorige artikels integreren. Een plugin zoals Disques is niet compatibel met onze filosofie.
Langs de andere kant hebben we gemerkt dat reacties via email een andere toon hebben. Ze worden zorgvuldiger geschreven en we krijgen geen domme, snel geplaatste commentaren.
Het klopt dat de afbeeldingen ook op andere manieren kunnen worden gecomprimeerd, maar de “dithered” beelden zijn ook een ontwerpkeuze. Smaken verschillen en dus vindt niet iedereen dat mooi. Maar dat is prima.
We gaan onderzoeken of de Nederlandstalige blog kan worden gemigreerd zonder een omzetting naar Markdown. Het is intussen duidelijk dat het de Nederlandstalige lezers niet kan schelen hoeveel energie de site verbruikt. Beetje deprimerend, maar c’est la vie.
Toon
Een boeiend experiment, en een passend pleidooi voor statische sites, die vaak ruim voldoen. Voor veel ‘dynamische’ sites geldt uiteraard nu ook al dat hetgeen een bezoeker te zien krijgt in feite een statische versie is, vanuit de/een server cache. Energie, bandbreedte, processorkracht, geheugen, etc. kosten namelijk ook geld, dus dit is een afweging die louter commerciële uitbaters van website ook wel maken. Alleen niet dermate doorgedreven zoals in jouw voorbeeld (omdat de arbeidskosten om een site hyperzuinig te maken op een bepaald punt niet meer opwegen tegen de uitgespaarde energiekosten).
Reacties van bezoekers zijn in een 100% statisch verhaal uiteraard niet (meer) nogelijk zonder dat je een externe dienst als Disqus of zo gaat gebruiken. Dat lijkt me toch een belangrijk nadeel. Valt m.i. wel goed op te lossen door een eigen reactiesysteem te schrijven waarbij de site opnieuw gegenereerd wordt, wanneer er een reactie wordt gesubmit. Je zou dat dan ‘dynamisch’ kunnen noemen, maar het is alleszins zonder database.
Qua afbeeldingen denk ik dat je beter een andere oplossing had gekozen. De transparante grijswaarden-afbeeldingen die je nu gebruikt zijn dithered, wat ervoor zorgt dat de compressie niet optimaal is. Een full-color jpeg met een gemiddelde kwaliteit en optimale compressie haalt gelijkaardige bestandsgrootten. Daarnaast kan je ook het png-compressie-algoritme handig inzetten door illustraties met veel volvlakken te gebruiken, die zien er superscherp uit en zijn slechts enkele kilobytes groot. Je afbeeldingen zien er momenteel erg grof en korrelig uit. Ik zou dan eerder voor meer kleur maar minder detail, en dus meer stilering gekozen hebben.
Ik weet niet hoe het precies zit in Pelican, maar in Jekyll kan je ook prima HTML in artikels zetten, dus dan hoeft die hele omzetting naar Markdown niet noodzakelijk. Het hangt er natuurlijk wel vanaf hoe netjes die oorspronkelijke HTML is, maar die kan je wss in bulk met een paar goeie regexen strak zetten.
Pien
Dank voor de inspiratie! Ga gelijk kijken in hoeverre ik dit op mijn eigen site kan toepassen, had er nooit bij stilgestaan dat een CMS zoveel stroom gebruikt…