Low-tech Magazine was born in 2007 and has seen minimal changes ever since. Because a website redesign was long overdue — and because we try to practice what we preach — we decided to build a low-tech, self-hosted, and solar-powered version of Low-tech Magazine. The new blog is designed to radically reduce the energy use associated with accessing our content.
The solar powered server that runs the new website.
Read this article on the solar powered website. It is also available in French and Spanish.
Why a Low-tech Website?
We were told that the Internet would “dematerialise” society and decrease energy use. Contrary to this projection, it has become a large and rapidly growing consumer of energy itself. According to the latest estimates, the entire network already consumes 10% of global electricity production, with data traffic doubling roughly every two years.
In order to offset the negative consequences associated with high energy consumption, renewable energy has been proposed as a means to lower emissions from powering data centers. For example, Greenpeace's yearly ClickClean report ranks major Internet companies based on their use of renewable power sources.
However, running data centers on renewable power sources is not enough to address the growing energy use of the Internet. To start with, the Internet already uses three times more energy than all wind and solar power sources worldwide can provide. Furthermore, manufacturing, and regularly replacing, renewable power plants also requires energy, meaning that if data traffic keeps growing, so will the use of fossil fuels.
Running data centers on renewable power sources is not enough to address the growing energy use of the Internet.
Finally, solar and wind power are not always available, which means that an Internet running on renewable power sources would require infrastructure for energy storage and/or transmission that is also dependent on fossil fuels for its manufacture and replacement. Powering websites with renewable energy is not a bad idea, however the trend towards growing energy use must also be addressed.
"Fatter" Websites
To start with, content is becoming increasingly resource-intensive. This has a lot to do with the growing importance of video, but a similar trend can be observed among websites.
The size of the average web page (defined as the average page size of the 500,000 most popular domains) increased from 0.45 megabytes (MB) in 2010 to 1.7 megabytes in June 2018. For mobile websites, the average “page weight” rose tenfold from 0.15 MB in 2011 to 1.6 MB in 2018. Using different measurement methods, other sources report average page sizes of up to 2.9 MB in 2018.
The growth in data traffic surpasses the advances in energy efficiency (the energy required to transfer 1 megabyte of data over the Internet), resulting in more and more energy use. “Heavier” or “larger” websites not only increase energy use in the network infrastructure, but they also shorten the lifetime of computers — larger websites require more powerful computers to access them. This means that more computers need to be manufactured, which is a very energy-intensive process.
Being always online doesn't combine well with renewable energy sources such as wind and solar power, which are not always available.
A second reason for growing Internet energy consumption is that we spend more and more time on-line. Before the arrival of portable computing devices and wireless network access, we were only connected to the network when we had access to a desktop computer in the office, at home, or in the library. We now live in a world in which no matter where we are, we are always on-line, including, at times, via more than one device simultaneously.
“Always-on” Internet access is accompanied by a cloud computing model – allowing more energy efficient user devices at the expense of increased energy use in data centers. Increasingly, activities that could perfectly happen off-line – such as writing a document, filling in a spreadsheet, or storing data – are now requiring continuous network access. This does not combine well with renewable energy sources such as wind and solar power, which are not always available.
Low-tech Web Design
Our new web design addresses both these issues. Thanks to a low-tech web design, we managed to decrease the average page size of the blog by a factor of five compared to the old design – all while making the website visually more attractive (and mobile-friendly). Secondly, our new website runs 100% on solar power, not just in words, but in reality: it has its own energy storage and will go off-line during longer periods of cloudy weather.
The Internet is not an autonomous being. Its growing energy use is the consequence of actual decisions made by software developers, web designers, marketing departments, publishers and internet users. With a lightweight, off-the-grid solar-powered website, we want to show that other decisions can be made.
With 36 of roughly 100 articles now online, the average page weight on the solar powered website is roughly five times below that of the previous design.
To start with, the new website design reverses the trend towards increasingly larger page sizes. With 36 of roughly 100 articles now online, the average page weight on the solar powered website is 0.77 MB — roughly five times below that of the previous design, and less than half the average page size of the 500,000 most popular blogs in June 2018.
Below: A web page speed test from the old and the new Low-tech Magazine. Page size has decreased more than sixfold, number of requests has decreased fivefold, and download speed has increased tenfold. Note that we did not design the website for speed, but for low energy use. It would be faster still if the server would be placed in a data center and/or in a more central location in the Internet infrastructure.
Source: Pingdom.
Below are some of the design decisions we made to reduce energy use. We have published a separate document that focuses on the front-end efforts, and one that focuses on the back-end. We have also released the source code for our website design.
Static Site
One of the fundamental choices we made was to build a static website. Most of today’s websites use server side programming languages that generate the website on the fly by querying a database. This means that every time someone visits a web page, it is generated on demand.
On the other hand, a static website is generated once and exists as a simple set of documents on the server’s hard disc. It's always there -- not just when someone visits the page. Static websites are thus based on file storage whereas dynamic websites depend on recurrent computation. Static websites consequently require less processing power and thus less energy.
The choice for a static site enables the possibility of serving the site in an economic manner from our home office in Barcelona. Doing the same with a database-driven website would be nearly impossible, because it would require too much energy. It would also be a big security risk. Although a web server with a static site can be hacked, there are significantly less attack routes and the damage is more easily repaired.
Dithered Images
The main challenge was to reduce page size without making the website less attractive. Because images take up most of the bandwidth, it would be easy to obtain very small page sizes and lower energy use by eliminating images, reducing their number, or making them much smaller. However, visuals are an important part of Low-tech Magazine’s appeal, and the website would not be the same without them.
By dithering, we can make images ten times less resource-intensive, even though they are displayed much larger than on the old website.
Instead, we chose to apply an obsolete image compression technique called “dithering”. The number of colours in an image, combined with its file format and resolution, contributes to the size of an image. Thus, instead of using full-colour high-resolution images, we chose to convert all images to black and white, with four levels of grey in-between.
These black-and-white images are then coloured according to the pertaining content category via the browser’s native image manipulation capacities. Compressed through this dithering plugin, images featured in the articles add much less load to the content: compared to the old website, the images are roughly ten times less resource-intensive.
Default typeface / No logo
All resources loaded, including typefaces and logos, are an additional request to the server, requiring storage space and energy use. Therefore, our new website does not load a custom typeface and removes the font-family declaration, meaning that visitors will see the default typeface of their browser.
We use a similar approach for the logo. In fact, Low-tech Magazine never had a real logo, just a banner image of a spear held as a low-tech weapon against prevailing high-tech claims.
Instead of a designed logotype, which would require the production and distribution of custom typefaces and imagery, Low-tech Magazine’s new identity consists of a single typographic move: to use the left-facing arrow in place of the hypen in the blog’s name: LOW←TECH MAGAZINE.
No Third-Party Tracking, No Advertising Services, No Cookies
Web analysis software such as Google Analytics records what happens on a website — which pages are most viewed, where visitors come from, and so on. These services are popular because few people host their own website. However, exchanging these data between the server and the computer of the webmaster generates extra data traffic and thus energy use.
With a self-hosted server, we can make and view these measurements on the same machine: every web server generates logs of what happens on the computer. These (anonymous) logs are only viewed by us and are not used to profile visitors.
With a self-hosted server, there is no need for third-party tracking and cookies.
Low-tech Magazine has been running Google Adsense advertisements since the beginning in 2007. Although these are an important financial resource to maintain the blog, they have two important downsides. The first is energy use: advertising services raise data traffic and thus energy use.
Secondly, Google collects information from the blog’s visitors, which forces us to craft extensive privacy statements and cookie warnings — which also consume data, and annoy visitors. Therefore, we replace Adsense by other financing options (read more below). We use no cookies at all.
How often will the website be off-line?
Quite a few web hosting companies claim that their servers are running on renewable energy. However, even when they actually generate solar power on-site, and do not merely “offset” fossil fuel power use by planting trees or the like, their websites are always on-line.
This means that either they have a giant battery storage system on-site (which makes their power system unsustainable), or that they are relying on grid power when there is a shortage of solar power (which means that they do not really run on 100% solar power).
The 50W solar PV panel on the balcony.
In contrast, this website runs on an off-the-grid solar power system with its own energy storage, and will go off-line during longer periods of cloudy weather. Less than 100% reliability is essential for the sustainability of an off-the-grid solar system, because above a certain threshold the fossil fuel energy used for producing and replacing the batteries is higher than the fossil fuel energy saved by the solar panels.
How often the website will be off-line remains to be seen. The web server is now powered by a new 50 Wp solar panel and a two year old 12V 7Ah lead-acid battery. Because the solar panel is shaded during the morning, it receives direct sunlight for only 4 to 6 hours per day. Under optimal conditions, the solar panel thus generates 6 hours x 50 watt = 300 Wh of electricity.
The web server uses between 1 and 2.5 watts of power (depending on the number of visitors), meaning that it requires between 24 Wh and 60 Wh of electricity per day. Under optimal conditions, we should thus have sufficient energy to keep the web server running for 24 hours per day. Excess energy production can be used for household applications.
We expect to keep the website on-line during one or two days of bad weather, after which it will go off-line.
However, during cloudy days, especially in winter, daily energy production could be as low as 4 hours x 10 watts = 40 watt-hours per day, while the server requires beteen 24 and 60 Wh per day. The battery storage is roughly 40 Wh, taking into account 30% of charging and discharging losses and 33% depth-or-discharge (the solar charge controller shuts the system down when battery voltage drops to 12V).
Consequently, the solar powered server will remain on-line during one or two days of bad weather, but not for longer. However, these are estimations, and we may add a second 7 Ah battery in autumn if this is necessary. We aim for an "uptime" of 90%, meaning that the website will be off-line for an average of 35 days per year.
First prototype with lead-acid battery (12V 7Ah) on the left, and Li-Po UPS battery (3,7V 6600mA) on the right. The lead-acid battery provides the bulk of the energy storage, while the Li-Po battery allows the server to shut down without damaging the hardware (it will be replaced by a much smaller Li-Po battery).
When is the best time to visit?
The accessibility of this website depends on the weather in Barcelona, Spain, where the solar-powered web server is located. To help visitors “plan” their visits to Low-tech Magazine, we provide them with several clues.
A battery meter provides crucial information because it may tell the visitor that the blog is about to go down -- or that it's "safe" to read it. The design features a background colour that indicates the capacity of the solar-charged battery that powers the website server. A decreasing height indicates that night has fallen or that the weather is bad.
In addition to the battery level, other information about the website server is visible with a statistics dashboard. This includes contextual information of the server’s location: time, current sky conditions, upcoming forecast, and the duration since the server last shut down due to insufficient power.
Update April 2019: To access Low-tech Magazine no matter the weather, we have several offline reading options available. For example, we offer a 710-page perfect-bound paperback which contains 37 of the most recent articles from the website (2012 to 2018). A second volume, collecting articles published between 2007 and 2011, will appear later this year. The books are based on the same electronic documents that make up the solar powered website.
Hardware & Software
We wrote two extra articles with more in-depth technical information: How to build a low-tech website: software and hardware, which focuses on the back-end, and How to Build a Low-tech Website: Design Techniques and Process, which focuses on the front-end.
SERVER: This website runs on an Olimex A20 computer. It has 2 Ghz of processing power, 1 GB of RAM, and 16 GB of storage. The server draws 1 - 2.5 watts of power.
SERVER SOFTWARE: The webserver runs Armbian Stretch, a Debian based operating system built around the SUNXI kernel. We wrote technical documentation for configuring the webserver.
DESIGN SOFTWARE: The website is built with Pelican, a static site generator. We have released the source code for ‘solar’, the Pelican theme we developed here.
INTERNET CONNECTION. The server is connected to a 100 MBps fibre internet connection. Here's how we configured the router. For now, the router is powered by grid electricity and requires 10 watts of power. We are investigating how to replace the energy-hungry router with a more efficient one that can be solar-powered, too.
SOLAR PV SYSTEM. The server runs on a 50 Wp solar panel and one 12V 7Ah lead-acid battery. However, are still downsizing the system and are experimenting with different setups. The PV installation is managed by a 20A solar charge controller.
What happens to the old website?
The solar powered Low-tech Magazine is a work in progress. For now, the grid-powered Low-tech Magazine remains on-line. Readers will be encouraged to visit the solar powered website if it is available. What happens later, is not yet clear. There are several possibilities, but much will depend on the experience with the solar powered server.
Until we decide how to integrate the old and the new website, making and reading comments will only be possible on the grid-powered Low-tech Magazine, which is still hosted at TypePad. If you want to send a comment related to the solar powered web server itself, you can do so by commenting on this page or by sending an e-mail to solar (at) lowtechmagazine (dot) com.
Can I help?
Yes, you can.
On the one hand, we're looking for ideas and feedback to further improve the website and reduce its energy use. We will document the project extensively so that others can build low-tech websites too.
On the other hand, we're hoping for people to support this project with a financial contribution. Advertising services, which have maintained Low-tech Magazine since its start in 2007, are not compatible with our lightweight web design. Therefore, we are searching for other ways to finance the website:
-
We offer print-on-demand copies of the blog. These publications allow you to read Low-tech Magazine on paper, on the beach, in the sun, or whenever and where ever you want.
The solar powered server is a project by Kris De Decker, Roel Roscam Abbing, and Marie Otsuka. The printed website is made by Lauren Campbell.
Read Low-tech Magazine Offline
Read Low-tech Magazine with no access to a computer, a power supply, or the internet. The printed archives now amount to four volumes with a total of 2,398 pages and 709 images. They can be ordered in our Lulu bookstore.
(1)
Very interesting project! It'll be interesting to see how well it holds up during the winter.
What software are you running on the server to keep the energy usage so low? (I'm mainly interested in the OS and HTTP server.)
I have a few ideas/suggestions:
I think it should be possible to reach much higher uptime by creating a network of nodes that all host the same set of websites. It wouldn't be a very simple project, and you might argue that it's not as lowtech anymore. But hear me out:
Say you have 5 "lowtech websites" each running on its own server (node), and each located in a different place on earth. You could then duplicate the content of each server to the 4 other servers. This only costs you extra storage. The servers only need to communicate with each other when the content changes. The energy/bandwidth cost of this communication should be negligible for static websites that are updated for example once a day.
The main challenge is the DNS. There needs to be some kind of load balancing between these 5 clients. A rudimentary solution would be to use round-robin DNS. Say you have and A record for solar.lowtechmagazine.com that contains all 5 of the nodes' IP addresses and a lifetime of 5 minutes. Every time a node detects it is going to go down in less than 5 minutes, it updates this DNS record: it removes it's own IP address. Every time a node boots back up, it re-adds it's own IP address to the DNS record.
I'm not an expert on DNS, so I'm not 100% sure that this would work. But I think it's worth investigating if you're thinking about improving uptime.
Obviously more complex schemes would be necessary to handle unexpected node downtime. Depending on the type of website this may be overkill.
About the images. I think you may have gone a bit too far in the image compressing. I see that most (all?) of the images on the grid-powered website or stored in the lossless PNG format. In general this is not a good choice for photos (as opposed to icons or other graphics with few colors): the file size will be much larger than when you're using the lossy JPEG format.
For example: the main picture for this article is 739 KB in PNG (http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad3b23825200b-750wi)
The dithered version in PNG is 43 KB, which is indeed a huge improvement, but comes at a big cost in image quality (https://solar.lowtechmagazine.com/dithers/sps_close.png)
The B&W JPEG version of the main picture (70% compression) is only 35 KB (https://i.imgur.com/9Z5HkTk.jpg), and I'd say the image quality is much higher than that of the dithered image. (The image resolutions don't match entirely. For the same resolution the image size of the JPEG would probably be more or less the same as the dithered image, but with increased image quality.) You could even lower the JPEG quality further than 70%, but this quickly becomes rather unpleasant to look at, so you may not want to do this.
Posted by: Seppe | September 25, 2018 at 05:41 PM
(2)
Very interesting experiment!
But what about CDN caching and all other kind of caching between your server and each of the browsers?
It might very be the case that CDN will cache the content of this website for some time according to default cache policies, and also that the client's browsers might also cache part of the website directly.
I'd say that having big caching time for the browser is a big plus, as it would still allow users to access previously accessed pages when they are down at no energy cost.
On the other hand, estimating network caching energy usage might be complicated.
Eventually, I'm not quite sure that the solar panel is the best idea, as it is made thanks to fossil fuels, and its CO2 equivalent won't be offset until its end of life…
Posted by: Jiehong | September 25, 2018 at 07:05 PM
(3)
"The design features a background colour that indicates the capacity of the solar-charged battery that powers the website server. A decreasing height indicates that night has fallen or that the weather is bad."
So that's what it is! It looks more like a glitch. I think it would be better to just add it to the header:
This is a solar-powered website, which means it sometimes goes offline. Battery: xx%
Some other minor issues (in Firefox):
The area you can click on links is some places longer than the text.
When the window is wide the images become too big and lines denoting cut-out text go much further out than the text, which looks odd.
Posted by: Sofie | September 25, 2018 at 07:31 PM
(4)
Suggestion - it would pass the right message
(and save a few nano-ergs of energy)
if you could abbreviate each posting in the rss feed
to just the first few words, as in (e.g.)
BBC News - UK
http://feeds.bbci.co.uk/news/uk/rss.xml
Hacker News
https://news.ycombinator.com/rss
etc
Posted by: Richard H | September 25, 2018 at 07:43 PM
(5)
Quite enjoyed the article, and am interested how you did the image dithering and coloring. Do you have a link that explains more?
Thanks, Alex
PS you could add a logo if you convert /create it in svg and embed it in the page.
Posted by: QWxleA | September 25, 2018 at 08:59 PM
(6)
I think it's a really cool project. I'm a hobbyist website tinkerer with a blog, and I've been experimenting with CMSes (I just installed WordPress, but I think it might be too much for what I want to do -- really I'd like a flat-file, static site that I can push to from anywhere (i.e., with a webform), which is what I can't figure out).
I'm writing you because I was curious if you'd share how your publishing workflow works -- do you have a CMS that you use? If so, how do you get from a web form to a published post? Is that how you do it?
Posted by: Case D | September 25, 2018 at 09:04 PM
(7)
Jiehong posted:
> Eventually, I'm not quite sure that the solar panel is the best idea, as it is made thanks to fossil fuels, and its CO2 equivalent won't be offset until its end of life…
It was the case some years ago, but modern panels are much more efficient and it is no longer the case (you should find numbers by looking for "solar energy payback time").
Posted by: Claude | September 25, 2018 at 09:45 PM
(8)
A computer is NOT low tech! :))
If your blog runs in cloud, it will use the same amount of electricity - if it runs on an ARM processor, like the Cortex-A7 processor - as it is using now.
When your blog is not visited by anyone, the processor will be serving someone else's blog (or doing some other work).
I like this blog, but please, don't try to fool people that are not familiar with computing.
Posted by: Daniel | September 25, 2018 at 10:28 PM
(9)
"Less than 100% reliability is essential for the sustainability of an off-the-grid solar system,"
Pretty much the same thing to be said for solar power in general, what? But, tallyho.
Posted by: Gerard vanderleun | September 25, 2018 at 11:04 PM
(10)
I went to Patreon and joined. I'm happy to support.
https://www.patreon.com/lowtechmagazine
Posted by: Joshua Spodek | September 25, 2018 at 11:23 PM
(11)
Some thoughts:
RSS feed is missing!
jquery-3.3.1.min.js is the biggest file on your page, from the limited amount of JS I saw, it could be easily removed. you could cache the your in a separate js file, this would also prevent uselessly sending your script to browser that won't support/accept it.
would you mind sharing the dithering script you apply to images?
I discovered LOW TECH MAGAZINE through this article and I'm really happy with the look and feel of the website! Keeping the default typeface is so rare nowadays and it works very well without JS.
Posted by: tx | September 25, 2018 at 11:30 PM
(12)
RSS feed lives here:
https://solar.lowtechmagazine.com/feeds/all.atom.xml
Posted by: kris de decker | September 25, 2018 at 11:33 PM
(13)
@6 (Case D)
Look into various static site generators, like Pelican, Jekyll and dozens of others - https://www.staticgen.com/
They require a little bit of effort to set up, design the template, etc, but then whenever you want to publish, you run a command and it (re)generates all of the html. You can run the generator on the server itself, or on any other machine and just send the results to the server (somewhat automatically, via rsync, ftp, scp, etc).
I publish a blog this way via Pelican. I edit a file in reST (other languages also supported) and when I'm ready I run 'make html' and 'make publish' to send it to the server.
Posted by: George Dorn | September 26, 2018 at 02:17 AM
(14)
very cool. have you considered p2p/distributed web technologies like beaker browser? https://github.com/beakerbrowser/beaker
Posted by: Perry | September 26, 2018 at 03:47 AM
(15)
Hi, I'm the owner/operator of instantfloppy.net. I raw-code all of my webpages in HTML and I was wondering if you had any pointers about lightening up the size of pages. I was especially impressed with the dithered black-and-white images on solar.lowtechmagazine.com and I'd really like to know how you do that so I can use your technique (with credit, of course :). Love the blog and thanks for any help you can provide (or just give me a link if you've done something on this).
Posted by: Deven | September 26, 2018 at 04:04 AM
(16)
Your site doesn't load in Naked Browser on Android.
Posted by: Dan | September 26, 2018 at 04:06 AM
(17)
It’s a cute idea, but please don’t dither your images.
One problem which you haven’t addressed is the increasing attitude towards web-pages as being “disposable”.
A good page, living on a sensible URL, could be available for decades if not centuries - but then, surely, there must also be a compromise made to maintain sources at the highest basic quality possible? What is worse that researching an interesting topic, only to run into photocopies of photocopies of a now lost technical drawing, which has become indecipherable over time. Dithering is basically this. You are an important source. Please don’t be a source providing photocopies of photocopies. I often find myself just grabbing screenshots and putting them into presentations or other documents. Ironically, this leads to a continual bit-rot as others do the same and screenshot my content. It’s surprising how many images in searches are clearly screenshots of poorly rescaled original images. Dithering will make this even worse.
I understand you’re trying to make a point - and there is a perverse value in stubbornly pissing into the wind, otherwise I wouldn’t enjoy low-tech so much and try to put it into practice myself - but please don’t let a low-energy perspective compromise on the real core of what you do, which is communicating excellent alternatives.
Posted by: Ben S | September 26, 2018 at 12:13 PM
(18)
Thanks for this excellent post about a very important experiment. The adjustment around a website always being on seems like an important part of this work.
I’ve recently been experimenting with dat [1] which can often involve adjusting expectations about when content is going to be online or not. They have some nice instructions for publishing your static site using dat [2], which would mean that someone could potentially get your website from a peer who is sharing the cost of keeping your content online.
I honestly don’t know of what the energy costs associated with this are, but presumably the peers would only start to contribute traffic when content was requested. I imagine this is something the dat folks would be interesting in helping answer.
Sincerely,
Ed Summers
[1]: https://datproject.org/
[2]: https://taravancil.com/blog/how-i-publish-taravancil-com/
PS. I love the idea of doing web comments over email. It also makes me wonder if there could be static site plugins for supporting this process. Like running a Pelican/Jeckle/Hugo/etc conmand every day to examine an mailbox and look for comments on webpages. I guess there would be a necessary step of reviewing them too.
Posted by: Edward Summers | September 26, 2018 at 12:17 PM
(19)
My off-grid solar server:
http://www.earth.org.uk/note-on-Raspberry-Pi-2-setup.html
You may also be interested in some of my tools to reduce page and image weight. (No ditherin:; zopfli(png) and similar in my case…)
Posted by: Damon Hart-Davis | September 26, 2018 at 12:21 PM
(20)
Hi Kris,
That's an absolutely fascinating article! I really like what you're doing.
You mentioned that you were looking for ideas. There's a technology you could use that would allow people to see something from your website, even when the server is down: service workers.
As long as someone has visited your site at least once, you could show them something when they try to visit the site when the server is powered down. That could just be a simple message, or it could be articles that you previously put in the visitor's cache (for example, every time someone visits an article, you could store a copy of that article in a cache to show them later when the server's offline).
Usually service workers come into play when the user's device isn't connecting to the network, but they also apply in your situation, where the server isn't connecting to the network.
I'd be happy to help you write the service worker script if you like.
Cheers,
Jeremy
Posted by: Jeremy Keith | September 26, 2018 at 12:41 PM
(21)
Cool idea, but I would recommend to add a service worker js, so it will cache the website data on the client and so its even available when no internet connection is available.
Posted by: Prov94 | September 26, 2018 at 01:34 PM
(22)
thx Chris & team inspiring as always. maybe we also need 'real' solar powered web APIs aka a OCR web Api? As we learned the AWS(Advanced Web Service) make a huge amount of the internet traffic and buying always a super expensive software to substitute the service can not be the solution. going back to the shareware area on CD-Roms or sticks is not realistic or? i once published on linkedIn why AI with the many layers architecture is a energy sucking zombie. and new ideas energy guzzling ideas are coming...like picture recognition services: dash buttons with a camera in your fridge or on your desk always connecting to AWS's with AI checking what you maybe needing soon or thinking about ...
cu
via peakaustria
Posted by: Thomas Reis | September 26, 2018 at 04:27 PM
(23)
Claude posted (http://www.lowtechmagazine.com/2018/09/how-to-build-a-lowtech-website.html?cid=6a00e0099229e88833022ad3940476200d#comment-6a00e0099229e88833022ad3940476200d):
> It was the case some years ago (...)
Wow, indeed, it seem to have really improved. Thanks for that info!
Posted by: Jiehong | September 26, 2018 at 04:35 PM
(24)
Hello there,
I absolutely love this concept, and I hope this is where the world is headed; it simply doesn't make sense to bloat the internet with so much needless data.
My first thought, which commenter Alex also mentioned, is that you may be able to preserve the "modern" look of your site by using .svg graphics for logos and some images (such as graphs). As cool as dithered images look, I suspect a .svg would have an even smaller footprint, and could greatly improve the readability of content such as graphs used in "How Much Energy Do We Need?"
Secondly, I've heard a lot of people say recently that the future of the internet is decentralization, with users "seeding" visited websites to future users to create a more efficient and secure internet experience. I believe that this concept would lend itself well to the ideals of low energy consumption, potentially providing backup should your server ever go down due to weather. I know it isn't practical to implement right now, but I hope that is where the world is headed.
Thank you for the well-written and thought-provoking article.
Posted by: Jacob Hall | September 26, 2018 at 05:47 PM
(25)
I like the old-timey dithered look of your images, and the way you are using the multiply blend to sepia tone them, that is very cool! However, if you want to have even lower page weight, then you might consider converting the images to grayscale jpg with a reduced quality instead of converting to dithered png.
Here's a quick comparison using your original image, the dithered image that appears in the article, and a conversion to gray jpg using an ImageMagick 'convert' command.
zeppelin:/tmp> convert -grayscale RMS -quality 50 -geometry 800x600 6a00e0099229e88833022ad3b23825200b-750wi.png test.jpg
zeppelin:/tmp> du -bh 6a00e0099229e88833022ad3b23825200b-750wi.png sps_close.png test.jpg
739K 6a00e0099229e88833022ad3b23825200b-750wi.png
43K sps_close.png
28K test.jpg
The image (test.jpg) is 15KB smaller than your dithered one, and still looks good with your color blending method.
If you like the rough look that your dither gives the images, you could ramp the -quality parmeter down to 10 or so, and your jpgs will start to look rough and mottled too- AND the image size will be reduced into the 9KB range for even more weight reduction.
zeppelin:/tmp> convert -grayscale RMS -quality 10 -geometry 800x600 6a00e0099229e88833022ad3b23825200b-750wi.png test10.jpg
zeppelin:/tmp> du -bh test10.jpg
9.1K test10.jpg
Cool stuff, good luck with your web server!
-jsj
Posted by: Jeff Jahr | September 26, 2018 at 06:45 PM
(26)
I'm such a fan. I love your work, I only wish you published more frequently.
The low tech website is brilliant.
I would happily pay to get print versions of your articles.
I'd likely print the whole archive! I'm a paper freak. Film and paper-based photographer, book collector, and collector and archivist of a wide variety of paper-based artifacts.
As a media archivist I'm constantly railing against digital storage, on the cloud or on drives. The future is going to have a dim understanding of what happened in our century, since most of the evidence will be non-existent/un-recoverable.
Keep up the good work! I hope I get the opportunity to purchase some print on demand articles.
Posted by: Bill Daniel | September 26, 2018 at 06:50 PM
(27)
Great website. I've read every article and thoroughly enjoyed them and learned much. Congrats on practicing what you preach and documenting it.
Signed up on patron, recurring, 25.00 monthly.
I'm founder/CEO over at Suborbital-Systems, we are building high altitude, low energy network nodes (wifi on a balloon) so we are obsessed with all manner of energy efficiency. I'd love to have the site do a story on us, especially as an update to the building low tech network article. we are enabling radical self reliant/operating networks all over the world.
Posted by: Charles N Wyble | September 26, 2018 at 07:23 PM
(28)
It might go against the spirit of what you're trying to do with your solar web site, but users could go to the web archive of solar.lowtechmagazine.com when it's down (once it is archived; www. is already archived):
https://web.archive.org/web/*/https://www.lowtechmagazine.com">https://www.lowtechmagazine.com">https://web.archive.org/web/*/https://www.lowtechmagazine.com
On the other hand, you're not using ads, so you're not out any money if users go to the archived site instead.
Posted by: Drew Gulino | September 26, 2018 at 09:02 PM
(29)
Just messaging you to inquire about a particular article from September of last year, "How (Not) to Run a Modern Society on Solar and Wind Power Alone."
The first substantive image from that article, which is "a visualization of 30 days" of different forms of data, seems to have suffered greatly from the dithering process - to the point where it's illegible, in fact.
The actual data trends can be seen fine, but because the data is colour coded, there's a loss of distinct information. You might be aware of this, and if so, please disregard this email - I just wanted to bring it to your attention! Love the site, and love the articles.
(for clarification, the article in question is located at https://solar.lowtechmagazine.com/2017/09/how-to-run-modern-society-on-solar-and-wind-powe/)
Posted by: Ethan B | September 26, 2018 at 09:05 PM
(30)
I wish you success in your solar-powered website experiment.
You've got me thinking now about ways I might decrease my internet footprint. One thing I plan to do is delete any unnecessary online accounts where my data is being maintained even though I don't use the services--online shopping accounts for stores that I can visit in person, for example!
Posted by: MW | September 26, 2018 at 09:12 PM
(31)
Like others have said:
Instead of dithering you can use JPEG. I can achieve 52.4 KB with the image of this post, keeping the colors (compressing with gimp, quality 70, artifacts visible, but if you ask me only to somebody looking for them). Sure it's slightly more, but the image looks almost the same.
Also, since your homepage has a lot of images and might get lots of visits, why not thumbnail the images to a lower resolution? This might cut in half or more the size of the homepage.
Also embedded svg for the logo or other non-photographic graphics it the way to go (if embedded you avoid http requests).
Additionally, like already said, eliminate jQuery (or at least use the slim build, that eliminates some features, see here https://cdnjs.com/libraries/jquery).
Putting the computer outside in winter might help a bit with energy efficiency and cooling.
I am convinced this is a low-power website and I like the project, but it remains to be seen wether more energy could be saved in a data center where the computational resources are shared and they have proper cooling solutions.
Posted by: Francesco | September 26, 2018 at 09:24 PM
(32)
Just so you know, if you "snap to web colors" when exporting your dithered PNG you can get a similar aesthetic at an additional 50% size savings.
Posted by: Evan V | September 26, 2018 at 09:27 PM
(33)
Yep, the JPEG format is much better in storing pictures than PNG, You can even use bpg to reduce size while maintain pretty acceptable quality.
Visual comparison:
http://xooyoozoo.github.io/yolo-octo-bugfixes/#mascot&jpg=s&bpg=s
I think this is over engineered with a huge trade off on the image quality.
Posted by: Mengyang Li | September 26, 2018 at 09:30 PM
(34)
One potential way to reduce energy consumption while still retaining content accessibility might be to publish the site on IPFS, as I've done with my blog [1]. That way, people accessing the site help serve the site.
1: https://leotindall.com/post/putting_this_blog_on_ipfs/
Posted by: Leo Tindall | September 26, 2018 at 09:34 PM
(35)
So I checked the solar powered website images to the regular website images.
To my shock and dismay, TypeKit for some reason uses PNGs for photos. This is extremely inefficient: PNG really is only good at compressing smooth surfaces and gradients. Photos are a terrible choice for PNGs.
I made a test gallery to compare alternative options:
https://blindedcyclops.neocities.org/low-tech-image-tests/gallery.html
In my experience, and as shown in the above gallery, cleaning up the image first makes an enormous difference in compression size, and results in better maintained quality at extreme compression values. I suggest Darktable and GIMP:
http://www.darktable.org/
https://www.gimp.org/
Another conclusion that I would draw is that JPGs aren't that bad.
However, if we insist on using dithered PNGs, here are some suggestions.
PNGquant is a lossy PNG encoder, which can be found here:
https://pngquant.org/
The downside is that it only supports Floyt-Steinberg dithering.
PNGs can also be losslessly optimized with optipng:
http://optipng.sourceforge.net/
It is often even worth putting the output of GIMP and/or PNGquant through optipng for a few extra percentages.
Posted by: Job van der Zwan | September 26, 2018 at 09:46 PM
(36)
If you use the PfSense router software it is possible to run it as a router on a single nic like there is in the Linux box you use for the web server. It requires a standalone switch tho and the single nic limits some functionality, but it should be totally capable of running with the web server no problem. If the Linux box can be expanded with an extra nic, you will have a very strong router solution comparable to any $$$ priced router on the market.
Posted by: Jens Sigurdson | September 26, 2018 at 10:23 PM
(37)
I have a suggestion on how to improve the website. You should publish the website on ipfs (ipfs.io). IPFS is a next-generation network of computers that works with content, not addresses.
In the internet, when you want to access a website, you need it's IP address. You connect to that IP address and ask the server for the content you want. You can't get the content if you can't reach the server, i.e. f the server is off-line, during maintenance, DeDosed, has crashed, or there's no route to the server (i.e. because the server's ISP is down, your ISP is down, some DNS server is down (that has actually happened, even to the giants), , the ISP censors your access to that website etc). IPFS goes around all of that.
IPFS is content-addressed. It means that for every piece of content ever shared on ipfs, there exist a hash that uniquely identifies that content. A hash is a long, alphanumeric text string generated by performing some calculations on every byte of the hashed content. If one byte changes, the whole string changes drastically. Hash algorithms are designed so that it's very hard, given a content and it's hash, to make a different piece of content with the same hash (collision resistance). That essentially means that a hash uniquely and unambiguously refers to a particular piece of content.
What does it have to do with ipfs?
Ipfs is content addressed. That means that, when you download content from IPFS, you don't need an address of a node hosting that content. You need it's hash. There are mathematical algorithms that let your computer (your node) collaborate with other nodes and find a node that has the content you're looking for pretty easily. You don't need to retrieve the content from the node it has been originally posted by, you can retrieve it from whomever wants to give it to you.
After retrieving, the content is re-hashed (to verify that it's the exact same piece of data you asked for) and added to a special list, allowing other nodes to get it from you. Interested nodes can also (pin) some content. That means they will keep it around until unpinned, not until a program thinks it's no longer necessary.
This has a lot of benefits. THe original poster needs to be online only when the content is first published. When the content is in the network, anyone that already has it can serve it to the interested parties, and those interested parties will serve it to other interested parties in the future, even if the node goes off-line, gets hacked, raided by the police or the content gets censored and prohibited in any country. There's also no risk of DeDos, because the more people request the content, the more nodes have it and the easier it is to get.
At this time, when IPFS is not ery popular, it's benefits are questionable when it comes to energy saving. However, if it becomes popular (and putting your blog there is a small step, in that direction), it will e a game changer for the internet. Now, for services to work, datacenters need to be on-line. with IPFS, however, you can build an off-line first internet.
If it's night in Europe, nodes can be off-line because there's no solar energy, however, in the USA, some nodes might have the content you're interested in. If the content is popular, there's no need to transmit the content through a long cable under the ocean thousands of times, as Americans can just get it from some close nodes.
Posted by: mikolaj holysz | September 26, 2018 at 10:48 PM
(38)
Love the idea, great job. For the even more low-tech site definitely remove jQuery and rewrite in plain JS part for the icon and weather.
Posted by: Ivan Vandot | September 26, 2018 at 10:51 PM
(39)
Wow, this is good news! As one of your readers who lives in a passive solar off-grid home in northeastern North America, your new lower-bandwidth site loads wonderfully fast over my slow cell signal. I tend to browse in “text mode” anyway, for speed and readability on my little phone screen.
Because of my slow connection I have become painfully sensitive to the growing bandwidth requirements you describe, even to read the news. I rely heavily on the text-only NPR page and the text-only National Weather Service forecast page; in cloudy weather they are sometimes the only pages that DO load!
Glad to be able to add the solar version of your site to the list. It is an informative, entertaining, and practical resource (I am now a thermal cooker aficionado, thanks to you!)
anja
PS I agree with Sofie that a simple text battery percentage in the header would probably be sufficient and more readable (when Safari isn’t already in text mode) than having the web page display battery status via background color.
Posted by: A Baldo | September 27, 2018 at 12:47 AM
(40)
Love the idea. Here are a couple of ideas which might improve the site further
There's an easy way to shave a few bytes. The type="text/JavaScript" attribute to the tag is not needed on html5 pages like yours.
But there may be a more complex way of doing away with jQuery entirely.
All you seem to be using jQuery for is to pull in a JSON file with the current weather and battery stats. Your server is obviously creating the JSON file on the fly. If instead you created a small CSS file with the data you could pull it in instead, setting the attributes of the battery div and using the content declaration of :before and :after pseudo elements to insert words like "snowy" into your content. You'd need to ensure the CSS file wasn't cached, either server side or using a little JavaScript.
Cheers
Posted by: Garve Scott-Lodge | September 27, 2018 at 01:19 AM
(41)
Here is a quick note from Low-tech Magazine. We are a bit overwhelmed by all the feedback, especially because we were still working on the website when word got out.
We managed to fix the most obvious errors, took away the scaffolding, and launched a partly untested website, only to be flooded with traffic. Between 16:00 and 23:30 yesterday, the solar powered server registered 35,000 unique visitors, all while working flawlessly and using only between 1 and 2 watts of power. That's comparable to a very small LED reading light.
In the comments, many people focus on the battery meter and the dithered images, and they come up with very clever ideas to do it differently. For our project, low energy use was not the only goal. We also wanted it to be obvious to visitors that the server is solar powered and that the website is built in a very different way. If it would look and feel just like any other website, almost nobody would realize it is special.
Of course other ideas for image compression are very worthwhile and we look forward to try out some of the ideas and discuss them further.
We are still writing technical information (to be published soon), refining the software, and experimenting with various set-ups of the battery system, so expect more updates in the next days and weeks.
PS: There's a lot of interesting comments on the project over at Hackernews:
https://news.ycombinator.com/item?id=18075143
PPS: And there is a nice article on Treehugger:
https://www.treehugger.com/solar-technology/low-tech-magazine-switches-low-tech-low-carbon-website.html
Posted by: Kris De Decker | September 27, 2018 at 01:54 AM
(42)
hi there, curious if you have considered doing an inverted color scheme, so dark background with light text. http://blackle.com/ claims to have saved lots of watt hours for not being on a white background.
i love the magazine and look forward to reading more in the future
Posted by: Jeff Gnatek | September 27, 2018 at 02:48 AM
(43)
Great re-design, completely in line with the site's topic! Reminds me in a way of Fidonet, a lowtech computer network that was popular in early 1990s, before the Internet takeoff. It was ran by volunteers, who ran bulletin board systems that dialed automatically each other in the early morning hours to exchange emails, which took quite long to travel on it compared to the modern email.
Posted by: Sava Chankov | September 27, 2018 at 03:12 AM
(44)
YAY! You guys are my heroes! I've been wanting to do such a thing for some time.
But wouldn't caching deal with that?
We run a MediaWiki server on a Mac Mini, and are running memcached. About 90% of page requests end up being served by memcached, as far as I can tell. And with an SSD behind that, there isn't too much energy penalty for a cache miss, anyway.
Posted by: Jan Steinman | September 27, 2018 at 07:14 AM
(45)
Re. the 10W+ router: since you're on fibre internet, you may probably directly link the server to the fibre ONT, and get a DHCP address from the operator. You would still have the ability to connect from your laptop using a switch and 2 VLANs (the operator DHCP stuff probably already use a VLAN). You would have to check the details for your country/operator.
Re. CDN, IPFS, etc.: since this server is 2W max, adding more infrastructure will kill the energy efficiency (I doubt the typical-low-powered IPFS server around is less than 20W). The page lightness makes all that useless. The RSS feed makes the CDN perfectly redundant too. 500k page views in a few hours for this little thing is impressive!
Re. multi-site web-serving: I use "booth", a software package that distribute tickets to 2 or more locations. The location that have the ticket updates the DNS record to bring the traffic to itself, using a simple home-made script. The DNS stuff relies on setting the TTL very low (~5 minutes). This works great for my pro-hosting needs (semi-solar-powered highly-available hosting at 200W). Using this on very distant locations would make the website highly available at very low cost, and only twice the power (probably 2W active/loaded server + 1W standby server). Since there is no database, dual-active hosting is also very easy, using DNS round-robin. You just need to distribute the content (rsync) and aggregate the logs (mergelog) when there is plenty of sun.
Posted by: Nicolas Huillard | September 27, 2018 at 11:00 AM
(46)
You did a really great job here. Improvements are always possible (and welcome) but hey guys, that's what I call a redesign!
Glad to see some folks showing us the path.
Posted by: STPo | September 27, 2018 at 11:57 AM
(47)
First, I'm a huge fan of your solar project !
I'm a front-end developer and I see some improvements :
- as mentioned in other comments you can easily remove jquery (or at least use the CDN version : https://code.jquery.com/jquery-3.3.1.min.js it will be less ressource intensive for your server) and as I like your project, I rewrite your code in vanilla javascript : https://jsfiddle.net/59kopbx3/ (let me know if you have any issue)
- images have width 100%, this is ok for mobile but not really on desktop, as your images max size is 800px, so I think you can add this style : .entry-content p.img{ max-width: 800px } it will be less pixel to render, so less energy consumption for visitors.
- also mentioned in other comments, PNG is not the lightest image format, you can have almost the same weight and preserve colors with jpg (or even webp)
- you can "minify" images. All images comes with metadatas, those datas are not necessary for displaying image on the web (ex for sps_close.png : https://imgur.com/VsSji3A 40.172 bytes vs 43.415 bytes for original). Have a look at https://github.com/imagemin/imagemin
- you can lazyload images (https://css-tricks.com/the-complete-guide-to-lazy-loading-images/). Don't use the technique using 'scroll' event as it's really ressource intensive for visitors, prefer the Intersection Observer API
- you can also improve browser caching to limit reload of assets https://varvy.com/pagespeed/leverage-browser-caching.html
- you can also replace images cloud, sun in footer by unicode characters, https://unicode-search.net/unicode-namesearch.pl?term=cloud https://unicode-search.net/unicode-namesearch.pl?term=sun
That's it :)
Posted by: Laplace Victor | September 27, 2018 at 12:00 PM
(48)
First of all: I love your website and wish I had come across it much earlier.
The article on how to build a lowtech website was super inspirational and sparked (re-sparked?) my interest in building a website with easy and low-impact tools.
My comments on the project:
1) I would love if you would give direct IBAN bank account information if in any way possible. As much as I respect the mission of donation tools like patreon and librepay, they *do* take their cut from the donations. The most direct way to support your product and your mission is monthly payments directly to you. I understand that this is only free of charge if your supporters happen to have an EU bank account with IBAN/BIC, but it would be worth at least giving readers the option to support you in that way.
2) I am not a big fan of the yellow battery indicator that is (as of right now) splitting the screen in half. This feels gimmicky to me and is distracting my attention from your great articles. (Very much personal preference of course)
3) In addition to other people commenting on the use of dithered images, you might consider hosting more hi-res (jgp?) versions on the server and linking the dithered images to them. That way people who *want* the better picture quality can have it, without everyone having to load articles with heavy images in them.
Keep up the great work, I will definitely come back more often!
Cheers,
Paul
Posted by: Paul Ito | September 27, 2018 at 12:03 PM
(49)
Excellent project!
I love the idea of a static, non-always on website.
You’re making a fair point, and I agree we need to make a mental shift in what we expect from the on-time of a website.
However, I have some issues with the images.
As some people already mentioned, the dithering really lowers the quality a lot, while a lossy compression could achieve the same file size but with better quality.
Another issue is the black-and-white. This is indeed a smart thing to do as it saves a lot in file size, however, you have to make sure that your article does not depend on the color in the image..
E.g. in your article on the high-speed trains (https://solar.lowtechmagazine.com/2013/12/high-speed-trains-are-killing-the-european-railway-network/) the original low-speed train route and the newer high-speed train route between Paris and Amsterdam are shown on a map in different colours. Of course both look the same in black and white and the distinction is lost. Maybe you could solve such issues by make one of the lines dashed?
Posted by: Frederik Van Der Veken | September 27, 2018 at 12:05 PM
(50)
Kris, I am cuban reader that become crazy with the cool low tech website
Could Low Tech design and host low tech websites for a fee, that contributes with the magazine?
Posted by: Abelardo | September 27, 2018 at 12:08 PM
(51)
Just wanted to say absolutely fantastic project - I will be watching this develop and plan to use your example as a template to follow in a website I will be building in the next year or so. The work you are doing is so important - thank you!
Posted by: Skye | September 27, 2018 at 03:53 PM
(52)
I haven't had a chance to read all the way through your latest article (and won't understand most of it when I do) but I did catch one point that I thought worthy of consideration in the design of your energy storage system.
I see that you chose to use lead / sulfuric acid batteries as your battery back-up. May I suggest that you consider switching to iron-nickel batteries. It may be that I'm preaching to the choir but, in case you haven't heard of them, iron-nickel batteries are a proven if bulky rechargeable technology. They use alternating iron and nickel plates (relatively cheap) in a basic electrolyte to store energy.
They are rechargeable hundreds of times, have less toxic waste products, and are very durable. They have a slow charge and discharge rate but should present few problems for powering low-tech websites. While the units can be quite expensive, they are also amenable to home-production (something that anyone who can assemble a low-tech website should be able to handle).
Well, even if I don't understand the exact nature of this technology, I feel that the possibilities and the look into energy cycling will be helpful to me.
Posted by: Geoffrey Tolle | September 27, 2018 at 04:18 PM
(53)
Dear low-tech readers,
Quick introduction: I'm Roel one of the collaborators of the project that worked on the web design, back-end and hardware.
As Kris already mentioned, we got caught off guard by the unplanned early launch and all the attention. We are still smoothing out most of the design. Having said that though, solar.lowtechmagazine.com was intended from the start as a public learning moment. The site we've made should thus be understood both a proposition but also as a question and we really appreciate your insights and feedback. These insights and feedback we will use to further improve the website over time and document how and why so they can be points of departure for others.
@Seppe:
We are aware that we could make multiple servers around the world to always have the sun shining and use clever routing to always have the machine on-line. However this was besides the point for us and contra-productive to our message. If weather-based renewable energy is to ever become our main source of energy, that only works if we massively decrease our energy use and adapt our patterns to availability.
In the case of our server it is fairly simple to have a 90% uptime with a cheap and energy efficient computer and a small solar panel. However. to go above that 90% we would need to double or triple the machines used, the solar panels necessary and our storage capacity available. That is not even mentioning the resources necessary to maintain all of this in different parts of the world. If this is to work in a sustainable way, we have to change our attitude and the best way to do that in terms of web is to challenge the holy grail of 'uptime'.
For me the articles 'How (Not) to Run a Modern Society on Solar and Wind Power Alone' and 'How to Run the Economy on the Weather' where very informative in this respect.
As others like @Daniel have pointed out, there is an energy advantage also in economies of scale, running multiple websites on a single machine.
I was very surprised for example during our peak traffic of yesterday. While on the front page of the popular website HackerNews we got 500,000 requests in a few hours, yet the 15 minute average load of the server never reached above 30% of total capacity. So yes multiple popular websites built around the same principles and technologies could have fit comfortably on the same machine.
Something that isn't addressed that much in the comments, but which was very important for the design process and the future archive-ability of low tech magazine is how we converted all of the articles into markdown plain text files, and have made archives of all the original images. This means the 'sources' of the site are in a format which is legible across time and distinct computing environments. Another benefit is that the articles can be written off-line and generated into the website or its RSS feed when necessary. This means the process of dithering the images is part of the generation of the website, so the originals are not lost.
This brings us to the point of the dithered images, which seem to be the most divisive element of the web site :)
@Francesco, @Evan V, @Menyang Li and others
I've looked extensively into image compression and have learned a lot in the process. The choice for the dithering the images was not only one to reduce the size of the file. It was also a design decision to make the web page more calm, legible and outspoken at the same time. I agree that similar space savings can be achieved with colored jpegs with very lossy compression but in my opinion they look a lot worse and need to be displayed small. We also made a decision to stretch the images to full width of the browser to create pauses in the text, whilst creating a sort of visual rithm.
I am also aware that in theory PNG is not the optimum image format, however it is a format that lets me limit the color palette to save space and still create great crisp dithered images. In my post-processing pipelines I've run tools like ‘optipng’ over the resulting output but they could only shave off another 5% of the image size at the cost of having two full extra hours of processing.
However, @Job van Der Zwan, I really appreciate your side-by-side comparison and it reminds me a lot of what I have been doing the past months. I am very impressed with your results and would like to find a way to see how we can create this style of crisp dithered jpegs in an automated pipeline. So please lets continue this conversation!
We plan to publish the pelican theme and all the code in the beginning of next week so those of you interested could have a look at it.
Another issue with the images is that of course not all images lend themselves to the technique, which has been pointed out a few times by some of you. This is something which we will address as well.
The jquery dependency, has also been pointed out a lot and we will remove it sooner rather than later. @Laplace Victor thank you so much for making a pure js implementation. This really helps. We'll be trying it out asap. Again once we've published our sources we are really open to pull requests.
This weekend I will publish an addendum to this article on the technical details for the server configuration.
As Kris already mentioned in this article and on the 'donate' page of the solar site, advertising trackers are incompatible with the new website design and we really want to make Low-Tech Magazine tracker free and sustainable so if you enjoy our work or find our public research useful please donating.
Many thanks for the comments!
Posted by: Roel RA | September 27, 2018 at 04:37 PM
(54)
Very interested project. Please note however that when I first go to www.lowtechmagazine.com and then to the solar website, I transfer additional data and thus the total energy consumption is higher.
If your server has 2 GHz of CPU and 1 GB of RAM I think you can still use wordpress with several layers of caching - first nginx cache and then WP object cache (APCu preferred). Of course the energy usage would go slightly up, but the website would just look normally.
Posted by: Gregor | September 27, 2018 at 04:50 PM
(55)
Yes, grid-powered router is the weakest part of this project.
Have you ever heard about mesh networks and Hyperboria project
(https://docs.meshwith.me/)?
When you setup a hyperboria node you could backup your internet connection
with Wi-Fi, GSM or another link and powered them by solar.
The cost is access only via hyperboria network when a grid is off, you could run both versions
(for "normal" IPv4 and for Hyperboria mesh) simultaneously.
I don't know how "expensive" in CPU and power is to run a Hyperboria node.
Good luck! I love this idea!
Posted by: Tomasz Jadowski | September 27, 2018 at 06:47 PM
(56)
Your new solar site is fully accessible from not so powerfull client like old pcs and old tablets with poor hardware and obsolete OS. The regular site makes the browser of my 6 years old tablet to crash but the solar one is perfect ..and faster. Static sites are increasing the life of all clients.
Posted by: ijk_ijk | September 27, 2018 at 08:09 PM
(57)
Hi,
This is so cool.
I have always thought static websites are the best when your content is just pictures and words. Even the old image rollovers can be fun and generate a little interactivity. But I especially like the dithering idea. I use dithering as an artistic tool for some of my works because I find the dot pattern generated rather pleasing to look at. I also play around with the number of colors and swap colors used in the images. Photoshop's "Save for Web(Legacy)" tool is where I play with images and dithering. I find the diffuse style of dot pattern the most aesthetically pleasing.
Another energy saving concept is that of a black background. When displayed on users devices it required less energy. But it's a significant change to the site appearance.
I just wanted to let you know that this is a fantastic idea you have and it gives your website a palpable quality that does not exist on any dynamic webpage.
Posted by: J Campbell | September 27, 2018 at 08:42 PM
(58)
I'm a front-end developer, and just wanted to state that I completely love your decision to go low-tech and energy-efficient with your site. If you have any other great resources on the topic, I'd love to read more.
Posted by: Joel Mikulyak | September 27, 2018 at 10:01 PM
(59)
Hi all,
I'm Marie, and I'm one of the designers / developers of the website. Thanks so much for your feedback! As Kris and Roel have mentioned, it somehow got out before we were quite ready, but it's been amazing to hear all of the responses so far. We'd planned for this platform to provoke discussion, so we're excited to get this jumpstarted.
A large part of the challenge of this project was balancing functional decisions with the design concept. Often, we opted for the more radical option so that this design questions our current aesthetic expectations. To chime in:
Images
Dithering
Certain images are better suited for other forms of compression. But our goal was to not only compress images, but also to call to attention this act of compression.
We found that dithered images can be stretched beyond their actual image size while providing a distinct aesthetic, and that the artifacts of compression can become an integral part of the design.
(Along those lines... many sites produce multiple images for different sizes appropriate for various display sizes. We opted to use the same image file for both thumbnail and featured images to prioritize the caching, even if it means that the listing pages may be a bit heavier.)
SVG
Inline SVG definitely makes sense as a lightweight graphic form! (They're actually used for the social media icons already.)
I also agree that the legibility of graphs can be improved with SVGs. But we'd need to convert the given raster images we have of these graphs into a vector format — which, if done automatically, would end up producing a super heavy SVG file. What would be ideal is for any informational graphics to be readable and text-based, with svg/css-based shapes, which we unfortunately currently don't have the capacity for within our workflow. But definitely a problem to address!
Using an SVG for the logo is a good practice too, which I've actually seen done well on many sites. But once defined, that logo would have to be preserved on any platform, not just on this website — whether publishing in print or web form. That file would need to be sent around as an asset for any marketing needs. Again, we wanted to question what it means to create a "brand" identity.
We also played with Unicode for the weather icons, but found that the way they displayed (especially more non-default characters such as "windy" or "clear night") were too unreliable. We'll work on better sizing/compressing these though! Also, more improvements are coming to the battery indicator / dashboard / weather page!
JS
jQuery
As Roel mentioned, removing jQuery is in the plans. Thanks to all those with the tips! We thought about doing some more research on potential browser compatibility issues the library helps take care of, but looks like it won't be an issue.
Offline
Service workers for offline reading is something I've also been doing some research on! We're looking forward to further develop how caching might fit into improvements for the site.
Thanks again for all of the comments!
And we appreciate your patience as we work through some kinks.
More soon!
Posted by: Marie Otsuka | September 28, 2018 at 05:48 AM
(60)
I’m a longtime reader and fan; I just wanted to let you know that on Firefox 61.0.2 on Mac OS 10.13, the website has a huge semi-transparent yellow box over the lower half. I think it’s a sun-meter or a battery-meter.
I’m not sure whether it’s deliberate or if it’s a bug that is causing it to cover all the text on the page. If it’s deliberate, I just wanted to let you know that it makes it almost impossible for me to read the page, it’s super distracting. I’d love for it to be just a thin sidebar or something in a top scrolling navbar sort of thing. Having something overlaid on the text like that basically renders the website unusable for me.
Thanks for all the work that you do, and the new server sounds really cool!
Posted by: QB | September 28, 2018 at 09:40 AM
(61)
Very interesting article!
No need to dither (interesting look, though), instead compress:
I reduced my sites images drastically (factor 10) using this article, without loosing much quality ..
https://www.smashingmagazine.com/2015/06/efficient-image-resizing-with-imagemagick
Posted by: Jonas | September 28, 2018 at 09:43 AM
(62)
I would just like to comment that I like the new solar website, and I can't wait for everything to be moved over so that eventually the regular one can be taken down entirely....
Now, I would like to send in an idea, largely about the article suggesting a speed limit for the internet.
ARM processors, such as those used on our phones(and your solar powered server) have almost 3x bettery performance per watt than the Intel and Power9 Processors used in mainstream datacenters. If all of these were switched over to ARM-based chips, the energy usage of the internet would be reduced 3x, while keeping the same performance that we have now. The CPU's used in consumer laptops and desktops are getting more efficient as well, some of them are already being replace with ARM chip's.
In fact, the new Windows On ARM laptops with 25 hours of screen-on-time per charge, could easily be charged entirely with one of those portable camping solar panels...
Posted by: MsZ Divert | September 28, 2018 at 09:57 AM
(63)
I did the same years ago, and am very happy with that. The reason I am writing, however, is your comment that you did this also to have source files in markdown format that would remain fully readable and reusable as long as possible.
I think that you may be interested in these slides from a seminar of mine, where I make exactly the point that FILE FORMATS are one of the big obstacles not just to free markets, but to low-energy, low-waste information technology in general:
http://mfioretti.com/how-file-formats-can-be-used-favor-or-hamper-innovation-active-citizenship-and-really-free-markets/
more on the same topic on my blog:
http://stop.zona-m.net/tag/saveaswwf/
on a related topic, my posts on the incredible waste and pollution that the internet of things, as advertised today, will generate are here:
http://stop.zona-m.net/tag/iot/
Looking forward to any feedback you may have.
Keep up the good work!
Marco
PS: which static site generator are you using? My websites are done with Hugo.
Posted by: M. Fioretti | September 28, 2018 at 10:02 AM
(64)
First off thanks for introducing the world to your website, absolutely love it. I'm new to reading your site, but I assume low-tech is not at the exclusion of clever solutions (which IMHO is where the fun starts). The capability of low cost hardware means that there is a huge amount of potential in even the most basic setups.
It is a very neat idea and I think it could be a very useful concept which could also be applied to many situations where internet access is difficult or limited. In some cases a link to the internet may not be possible, so localised hotspots could also be used. This could be in developing countries, areas of natural disasters or even war zones. Allowing vital information to be broadcast, from medical information/advice to emergency assistance, lost/found persons to providing educational resources. Potential website-in-a-box?
This could also provide an excellent project for schools for teaching.
With regards to the site as a technology news site, I have several observations (none is intended as criticism):
Images:
I agree the dithered styled images are a nice design feature and adds a real charm to the site, particularly the colour categories flowing through to the article. However, you are right to concede that certain images don't lend themselves well to this treatment - ie. your web page speed test image. For diagrams/tables etc SVGs or similar would allow technical details to be read clearly, even if you apply the same grayscale colour mapping (if feasible).
Power bar:
Although I don't think I have any particular sensitivity to colours, I do find the colour hue across the article very distracting when trying to read and absorb the content (people who are particularly sensitive to this - often a characteristic of neurodiversity - will find it even harder). Perhaps consider limiting the overlay to the home page only, or (if feasible) to the article header bar only. A nice feature would be to have a day/night theme so people can select a contrast which is best for them - ensuring the site is accessible to a wider audience (and as someone else commented an added bonus OLED devices will use less power).
Uptime:
I do agree with the principle of 90% uptime, and it underlines the whole concept - adding additional panels and battery/storage, like you say, isn't the point. However it would be interesting if you can determine if the downtime is likely to be off-peak or not. Clearly for yourselves and your readers within +/-2-3 hours GMT their peak times will be very similar and may well be a good fit to the site availability. A study of loading before a downtime could provide an indication of if a certain group of readers are inadvertently being excluded (due to geographical or demographical reasons). Longer term it may be possible to characterise the charging and the loading to allow the site to predict the best times to go offline in order to meet peak times (and provide forecasted downtimes during off-peak periods). I'm sure that would make an interesting project for some students looking at machine learning.
Multisite:
The multiple site location concept does introduce some excellent possibilities, since even one similar site elsewhere in the world could provide complete coverage with additional redundancy, while reducing overall power needs by sharing the serving of multiple sites. This does complicate the setup a little but it does provide the opportunity to grow the idea further. This could perhaps provide the opportunity to scale down the setup with smaller panels and battery. As mentioned before this could have very useful applications for the website-in-box concept where multiple setups could be meshed to cover an area.
Energy storage:
I wonder how feasible alternative energy storage systems would be. It would be interesting if eventually you could replace the need for the batteries completely by using kinetic storage or similar (I claim no knowledge on how practical this is and probably is not suitable for your setup).
Posted by: T C | September 28, 2018 at 11:34 AM
(65)
Great site, but what software did you use to generate the site?
You've given hardware details but no software.
Posted by: John | September 28, 2018 at 01:15 PM
(66)
I'm truly inspired!
I've already been running my web site on a Raspberry Pi for a couple of years now and it's proved very economical. This morning I've managed to get my home page size down from 225Kb to 7.5Kb just by getting rid of "decorative" images and reducing the size of others. I found that some page loading speed can be recovered by using sprites, assembled using glue-sprite.
If you didn't want to serve images on-the-fly a potential low(er) energy option is to use a Gopher server. I also run one of these on a low-power Raspberry Pi and it's very effective for serving documents of all types. I know it's an old protocol but according to a recent survey there are 333 active gopherholes (servers).
I plan to start setting up a solar-powered web/gopher server soon, but as I live in Yorkshire, UK, my sunlight hours are not quite as good as Barcelona!
Thanks once again for a brilliant idea - it's the future!
Posted by: peter garner | September 28, 2018 at 01:35 PM
(67)
My name is Craig. I'm a big fan of what you're doing with the Low Tech Magazine, and I love the idea of a solar powered website! The newsletter asked for feedback and suggestions, so I had a look if I could come up with any. This is all pretty rough, so I'm sure I've missed stuff, probably with responsiveness etc.
Anyway, this is my feedback:
Make battery meter a lot less in your face
Love the idea of the battery indicator, but it’s so distracting when reading! When it’s low it also visually breaks the content and makes anything in the battery indicator look like a footer. Here’s how I’d change it:
Align it right, not left.
Make its width something like 64px so it’s just a bar at the side (in the new whitespace)
Move the top border from the content to the battery div so it covers the top nicely.
Lessen the “intensity” of the black on the readout. I found something around #333 to be quite nice, but just play around and see what looks nice.
Also, when at smaller screen sizes, reduce it further and don't bother with the icon, and maybe even the number.
Centre content
Wrap your page in a div with margin: 0 auto; max-width 960px; or something like this to keep it in a nice tidy column on the screen. Otherwise it looks a bit like a newspaper and is hard to follow.
Font family
Really not a fan of the serif font. Nothing wrong with Arial and co, or maybe even a mono font to get that typewriter feel? Idk. I think just the normal sans. This won't increase network traffic, since it's not sending fonts.
Spacing
I have changed the page layout from using lists to using divs with display:flex. It's pretty powerful and a lot more flexible than ul. I think it will make life easier, and it's much easier to get decent spacing around things like the nav.
Logo
I do think you need a logo. A simple SVG is pretty tiny, and it makes the site look heaps more professional. I made a quick one, but use whatever (use that one if you want, or make your own, but I think it needs something!)
Sky background
I stuck a simply CSS gradient as a background to resemble the sky (since it's solar, it seemed nice). Not sure I like the gradient, but whatever. I did wonder about changing the background gradient by time of day. So at night where it's hosted, it would have a black background, then moving into yellow then blue as the day goes on. Only on the body background, not the content background or it would just be annoying. But it shouldn't be too hard. I think a gradient of black through yellow to blue scaled to something like 5000vh then offset based on the time. Shouldn't be much Javascript. Might look super ugly or distracting though, so not sure it's worth it.
Image sizes
There's one image I found called sunnyday.png which is displayed at width 20px, but the image itself is 800px wide! This is not good. It's a simple BW png so it's small, but a simple SVG is still less than 10% of the size. Further, if you're displaying images small on some pages and big on others, save two copies and only send the small one if you can. Storage is cheap, bandwidth (for you server) is not.
Minify agressively!
Ok, so I know how much we hate inlining, but it has its place. Not at the element level, but on the document level. The size of the files being sent is important, smaller files use less energy. However, the number of files is worth thinking about too. Sending a bunch of small files results in a server call per file, which can add up. Having a working copy of the site with all its separate files is a very good idea for building it, it’s SO much easier! But for the published one, I would think about minifying everything and putting your stylesheet contents in a style tag, using inline SVG for icons (this is a tradeoff, since they are duplicated when you use them again. And doing the “use” trick is not a whole lot better because it sticks them in an iframe-which means you’ve got another request anyway. But for small, one-hit images you could base64 encode them. For icons, make a stylesheet for just these and base64 encode the SVG itself, which is very small and doesn’t require hitting the server again.
I minified my version of your homepage to be one file which includes your original css, my overrides, the html itself, and the logo image as a base64 encoded svg. The whole thing is 41kb and loads instantly. It would only be one request to the server (the images on the page would all be their own, but there's not much you can do about this. Base64 encoding them would make them larger, so best to leave as is)
Also, you’re using jQuery. I would avoid that tbh. It’s a pretty big library, and all you’re doing is reading some JSON data, which you could do in a similar amount of code without needing to import jQuery at all. Until you rewrite that function, why not hotlink jQuery from a CDN? It will save your poor little solar server from transferring it each reques.
Don't hold open connections
Your script for showing battery percentage etc holds an open connection the server. I get why you did, but I think until you’ve got your power problems sorted, just query it on page load, then close the connection. Just fire and forget. Otherwise your server is maintaining a heap more connections than it needs, wasting power.
With something like this, you want your server to be doing as little as possible while still working. So anything the browser can do for you is fantastic. The use of image filters etc you’re doing is really great! Keep that up! Same goes for Javascript. So many effects can be done by the browser with some clever CSS. Try to avoid animating etc with Javascript when CSS will do fine. When you do need Javascript, try and avoid jQuery and other large libraries.
Also, when you are querying things like the weather JSON data, where are you getting that from? Can you hit that directly rather than storing it on your server then hitting your own server?
I know this seems like a lot, I hope it doesn't come across as arrogant or like I don't like what you've done. I am so impressed! I wish I could build something like this tbh. Just trying to throw some ideas around, and they hopefully some help. You're more than welcome to use any of my suggestions or code, or simply throw it all away.
I tried attaching my modifications etc but google doesn't allow sending zip files, so here's a drive link:
https://drive.google.com/drive/folders/1G8j1G9JyVuq8d8kz4EWUity2gmXKuuih?usp=sharing
If that link doesn't work I could try sending loose files.
I've also attached some screenshots just because it's easier to glance at them quickly.
http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad3b4657e200b-pi
http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad394c691200d-pi
http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad394c69e200d-pi
http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad36e9bd0200c-pi
All the best, and hope some of this helps.
[Craig, thanks a lot, I hosted your screenshots on Typepad otherwise the colours won't show, KDD]
Posted by: Craig Balfour | September 28, 2018 at 04:29 PM
(68)
Hi Team - I am impressed with the solar powered website running from the home. Congratulations. I disabled comments on my blog and used a contact form to let the visitors send a message to me. That was one portion of my blog which is hosted elsewhere. Your idea of asking the users to send email to get the comments is really well thought of. I am going to implement that in my blog.
1. How feasible is it to put the email address on the webpage?. Are you net yet spammed?. Are you doing something on this front?.
2. How are the emails converted as blog comments?. Is it a manual conversion or automated? If automated, could you tell us how?. I would like to implement that in my blog as well.
Posted by: Premkumar Masilamani | September 28, 2018 at 11:05 PM
(69)
Many congratulations on taking this step: making the statement, showing that it's possible and even extremely attractive to build a website without all the weight we've come to accept. Loading this website is like a breath of fresh air. And your server performance under peak load speaks for itself!
It's clear that you're doing more than publishing a website, it's a demonstrator of the energy usage involved in serving a site. Respect for that.
I would like to mention dat and Beaker browser again (mentioned at least once above). While making a point of letting the website go offline when the battery is empty is a powerful educational move, the various peer-to-peer protocols all overcome this limitation of the http model (I'm only familiar with dat). Publishing over both http and dat simultaneously is fairly straightforward and maintenance-free, so it adds little overhead. Then everyone who views your site rehosts it: if your server is offline, others can still access it via those peers. No need for the solar panels and battery or even the server, you can publish from your laptop. Even more (embodied) energy savings :)
Of course, this is only practically true once all browsers speak peer-to-peer protocols .. and I believe a server is still needed for DNS resolution (so people can find the dat archive that belongs with solar.lowtechmaganize.com). In the meantime, fantastic work of public education going on here.
Posted by: Hans Fast | September 28, 2018 at 11:08 PM
(70)
Hey guys,
love your project of low energy consumption website.
I have a two questions:
Any use of versioning system for development? If not, how would xou scale such a project?
How do you deploy? Simply copy files manually?
Thanks and cheers from Czech republic,
Jiří
Posted by: Jiří Maha | September 28, 2018 at 11:09 PM
(71)
Wow, fantastic project, I‘m in love!
I really like the literally spoken „background information“ about energy and weather.
This makes a big difference in perception and creates awarenes in several respects!
Pertaining the comment section, perhaps you can publish a timestamp, like when the mail was sent...
Posted by: Nikolaus Bartke | September 29, 2018 at 01:35 AM
(72)
@Nikolaus Bartke, @Premkumar Masilamani
For now, the comments are added manually to the page. However, this approach doesn't combine well with the amount of comments we are receiving at the moment. We're looking into ways of automating this process. A timestamp could be an idea indeed.
@TC, @Geoffrey Tolle
We chose a lead-acid battery as an energy storage medium because it was available from an earlier solar PV setup. The LiPo battery came with the server.
These batteries will need to be replaced within 1-2 years, but the ultimate goal is to replace them by a compressed air energy storage system. See: https://solar.lowtechmagazine.com/2018/05/ditch-the-batteries-off-the-grid-compressed-air-energy-storage/
It is one of our goals on Patreon: https://www.patreon.com/lowtechmagazine
The solar and battery system are still in an experimental phase. For now, it looks like we have overbuilt the system. This is mainly due to the fact that the router is not yet solar powered, but also because we overestimated the energy use of the server, and because we underestimated the energy production of the solar panel.
We already switched to a battery that is three times smaller: we are now running the sever on the 24Wh UPS LiPo battery and use the lead-acid battery only as a regulator. The next experiment is to run the setup with a smaller solar panel. The aim is to downsize the system as much as we can.
@peter garner
It would be great to see how a similar set-up works in a less sunny country like the UK. Keep us informed!
Posted by: Kris De Decker | September 29, 2018 at 12:15 PM
(73)
Many thanks to all the work that has gone into this site. On a personal level, it has inspired me to take up something along the same lines.
I'm not a technical guy, but I did notice that solar.lowtechmagazine.com loaded quite quickly even over a dialup connection. Image dithering may have played a role in the fast load time and perhaps it also requires less cpu power to present the image
in the browser. Power savings at the server and the browser.
Although it is most likely not compatible with the goals of
Lowtechmagazine, the Gopher protocol, I understand is also much less energy intensive. Perhaps a gopher server on the same machine could serve up a Gopher version of Lowtechmagazine.
Posted by: Greg Melton | September 29, 2018 at 12:21 PM
(74)
Hi there,
I love your solar powered project. Fantastic post about it too. One thing I noticed is that your dithered images can be even smaller file sizes if you run them through the tool at tinypng.com - I tried out a couple and it shaved 3-5kb off each image.
I'm a designer/dev and even though there are lots of ways to squish images in gulp, photoshop and many other tools, I've found that the tinypng tool works brilliantly, there's even a CLI you can use.
Just to clarify, I have no links to tinypng, I just really rate their tool.
In my job, I make a lot of static sites with lots of javascript scrolling effects and images so I'm always squishing and minimising to optimise performance but I'm still dealing with quite large page sizes so it's great to see optimisation really pushed to the limit.
I think it's a really interesting project. I work in the news industry so taking pages down to the bare minimum is a really interesting idea, especially when you're disseminating essential news in countries or situations where internet is sporadic at best.
Fascinating stuff and I can't wait to read how the experiment progresses.
Thanks,
Adam
Posted by: Adam | September 29, 2018 at 03:09 PM
(75)
Reader Qwerty translated the article to French: https://zestedesavoir.com/billets/2839/comment-fabriquer-un-site-internet-a-basse-technologie/
Merci beaucoup !
Posted by: Kris De Decker | September 29, 2018 at 03:11 PM
(76)
Hi, I saw yesterday your solar website (via Hacker Newsletter), amazing experiment: probably if half the web would save on bandwidth the world could be a better place.
Just a note, the dithered images are a nice hack but on my full HD screen are streched to the border and I think they would look better if you put a maximum width at 1080 px, also because the text doesn’t reach the borders (good) and the images are 800 px wide.
I subscribed the RSS feed, you have some nice articles there but I’m really curious how your experiment will evolve. And also you let me think about the option to migrate my personal site from WordPress to a static generator like HUGO.
All the best, Brando.
Posted by: Brando | September 29, 2018 at 05:14 PM
(77)
Hi,
I just read your article on your new web-server approach. Besides your technical implementation, I really liked the way you reduced the web sites data footprint. It is so refreshing to see a website that concentrates on content, and is not overloaded with cookies, banners and whatsoever content I had to ignore otherwise. Websites nowadays are so overloaded with functionality and advertisement, which distracts from the actual content of interest. Thanks! I think, others should follow your approach as well. Clean, nice, and slick.
N.Bennett
Posted by: N Bennett | September 29, 2018 at 10:32 PM
(78)
Hello everyone,
For those that have been wondering about the technical details of solar.lowtechmagazine.com I've written a guide on software and hardware over at https://homebrewserver.club/low-tech-website-howto.html
It should answer most of your questions but it has a few questions itself!
Please have a look at it and feel free to get in touch.
greetings,
Roel
Posted by: Roel RA | September 30, 2018 at 10:11 AM
(79)
I've been a happy subscriber to Low Tech Mag's newsletters for many years now and so glad to see web hosting addressed here, as it's also my nice product at the moment. It allows WordPress sites to be published as static websites, perfect for then serving on a raspberryPi, as some users have reported doing. Depending on the size/load of the site, you can also generate it on the Pi, but I'd keep that stripped down as much as possible and just do static file serving from it. Almost every Pi owner has another computer that can run their WP site for the development part.
Posted by: Leon Stafford | September 30, 2018 at 11:08 AM
(80)
Could you add a print-friendly layout of articles for easy printing them and read them offline? I am an English learner and I use your content as a learning personal materials, because when we read something interesting us, we spend more time with them and learning is more fun :-)
Posted by: Tom | September 30, 2018 at 03:21 PM
(81)
@Kris "due to the fact that the router is not yet solar powered"
Yes, make sure that everything needed to connect the server to the Internet (on your side) is solar-powered. Not powering the router, ONT or anything else from the sun is cheating ;-)
You should be able to switch off the grid in the house and still see the lights blink...
Having a nice RRD dataset of the information provided in /api/stats.json, and generating graphs from it would be very educational: we could see how the battery drains in the night, probably faster in the evening when lots of people browse the site, then less so in the middle of the night. We could notice when solar production starts in the morning, offsetting the drain from the server, then starting to charge the battery, and produce a lot of surplus at solar-noon. We should also see seasonal variations and how they're strong.
I use 5 minutes resolution RRD for a few days, then ~1h resolution for a full year, then store nearly daily data for a few years. The problem with RRD is that you must predefine everything at the beginning. The positive side is that it's very light, and suitable for the hardware you have (just take care of Flash wear, probably with tmpfs synchronized with Flash at intervals, or a kind of in-memory RRD server which will store the RRD file at intervals).
(I post on the heavy-website, in the hope that it may reduce your hand-work. You may decide to redirect from the old site to the solar one ASAP, not until you have solved the differences in URIs : old /2018/09/how-to-build-a-lowtech-website.html vs. new /2018/09/how-to-build-a-lowtech-website/ ; we should be able to replace www. with solar. in the addresse bar and get the same article, not a 404 - nothing a tiny rewrite in nginx couldn't solve)
Posted by: Nicolas Huillard | September 30, 2018 at 10:16 PM
(82)
Hi
I saw your post about the soler powered webserver. I think it's quite neat, but using grayscale PNGs makes a lot of graphics on your site kinda useless, especially any colored graphs like in this article:
https://solar.lowtechmagazine.com/2014/06/thermal-efficiency-cooking-stoves/
JPEG at a low setting will produce much better images, without loss of color.
For graphics, where PNG is more suited, using a palette makes more sense than grayscale. It's not always better to use a smaller palette either. smol-16.png uses only 16 colors, but takes up more space than smol.png!
Finally, you can use zopflipng to get the most out of the PNGs you've already encoded (if you have the CPU cycles to spare). I generated the attached images with these commands:
convert 6a00e0099229e88833022ad3b23825200b-750wi.png -quality 50% smol.jpg
convert 6a00e0099229e88833022ad3b23825200b-750wi.png -colors 256 -ordered-dither o8x8,4,4,2 smol.png
zopflipng smol.png -y smol.png
Oh, also a lot of links on the solar version of the site are broken :)
Posted by: Tomas | October 01, 2018 at 02:30 PM
(83)
@Tomas, @Nicolas
Thanks for pointing out the problem with broken links. As you have noticed, it's caused by a different URl structure on the old and new websites. We're fixing it ASAP.
Posted by: Kris De Decker | October 01, 2018 at 02:34 PM
(84)
I agree the "battery meter" is not clear. The battery is around 90% now and I kept wondering why the "white header bar" didn't scroll off with the top of the page. I read near the top of page and I hate the visual distraction (on all websites). If the battery was 50%-80% I think I'd close the page. :/
Why don't you make it 5-10em wide on the left or right so that it will (most likely) fall outside of the text column?
Or better yet make it a thin horizontal meter at the top or bottom?
Posted by: Rod | October 01, 2018 at 04:51 PM
(85)
Hello!
I applaud your recent effort to reduce the energy usage of your website. However, while reading this article: https://solar.lowtechmagazine.com/2015/04/how-sustainable-is-pv-solar-power/ I have had trouble reading and interpreting the graphs that are displayed. It seems the dithering effect you implemented may have been too severe for these information rich graphs - in particular various different colored labels are hard to discipher and the text in one chart is illegible.
It is up to you to weigh the trade-off in legibility vs. size for these images, but I thought I would let you know I had trouble reading them.
Thanks for providing this information,
Nick
Posted by: Nick | October 01, 2018 at 07:25 PM
(86)
Hello Kris,
Really love the design and mentality behind the website, I think it's the start of a new trend for all potential eco-friendly sites in the future. I can picture a coalition of energy saving sites existing with their own badge of honor.
One thing I'd like to suggest or ask about, and maybe it's something you guys have looked into, but whether inverting the site (dark background and light colored text) might not save more energy? I recall Google having an energy saving day many moons ago and they inverted the Google homepage to black for a day, saving a significant amount of power.
I use a plugin Google Chrome plugin called Dark Reader, which helps invert the color of pages in a readable manner, more for the sake of reducing fatigue on my eyesight.
It doesn't make much of a difference with LCD screens, but would with CRT and OLED screens, (which OLED may be the way of the future). It may be good practice to start with. https://www.quora.com/How-much-energy-would-be-saved-if-Google-used-a-black-screen-instead-of-white
I'm just wondering if this something you all have considered. I commend the extensive endeavor, creating rare and unique online experiences I believe enhances authenticity.
Posted by: Rick Canfield | October 02, 2018 at 01:07 PM
(87)
You might have heard this from others but there are many peer-to-peer and synchronization type of technologies that align completely with your goals. It allows people to share the hosting. The technologies haven't crossed over to critical mass, but do appear close. I follow things like Holochain, DAT project and Beaker Browser, IPFS, and Scuttlebutt. You have already done all the hard work and so any mostly available can be replicated now globally with very low total energy usage. I need to get my own website and cloud hosted application converted over to one or more of these. I'm sure the extended community will be happy to help further if you need it.
Posted by: Abraham Palmer | October 02, 2018 at 05:43 PM
(89)
@ Nick & others
We know that some images do not work well with the dithering plug-in and we will solve that issue. It's a good opportunity to try out some of the other compression techniques.
@ All
We have released the source code for the website: https://github.com/lowtechmag/solar
And we have published a hardware/software guide:
https://homebrewserver.club/low-tech-website-howto.html
Posted by: Kris De Decker | October 02, 2018 at 05:45 PM
(90)
I've seen that you used Armbian, that's a good choice.
Did you consider Alpine with the lbu mode? (r/o image with
commits made from the user with "lbu commit -a", will all the new stuff is written back to the sd image, which is the rootfs.
optipng can optimize PNG images without losing too much quality.
Finally, thanks for your low-power site inspiration :D
Posted by: Ander Gomez | October 03, 2018 at 12:27 PM
(92)
Very interesting discussion at Metafilter ( https://www.metafilter.com/176879/always-online ) where some commenters are arguing that we are "giving solar energy a bad name".
Posted by: Kris De Decker | October 06, 2018 at 12:50 PM
(93)
Your website is really excellent, bravo! And it is nice & practical to follow the rss. Just one (small) regret, there are no social links (you know, images where you may click to "bookmark" the page), on twitter (I like), facebook (I hate) or other social media.
Posted by: Fred | October 06, 2018 at 01:26 PM
(94)
Hi!
I was fascinated by the idea and the execution on your solar powered website. Really well done!
I know this is more of a proof-of-concept than an actual production version, but you could squeeze couple more percents of battery life if you'd minimise the pictures. Feel free to disregard this of course :)
I've ran some images from the website through ImageOptim tool and reached savings of 19.5% per file on average.
You can probably find a suitable tool with similar savings results to incorporate into your publishing workflow e.g. pngcrush.
Let me know if i can be of any help.
Regards,
Alex
Posted by: Alex | October 06, 2018 at 01:32 PM
(95)
I love the idea that you're pursuing with the server and it clued me in to some great resources for open-source hardware and related projects.
A couple thoughts on the comments section (and community). First, there are ways to accept comments, store them in git, then rebuild the site. Check out https://staticman.net/ which is designed for Gatsby.
Secondly, there is a burgeoning movement called IndieWeb that allows people to comment, like, or RSVP to your posts from their self-hosted website. Your site can be notified using a "webmention" so that you know they've commented via their own website. Webmentions work a lot like trackbacks, but have some cool new features. https://indieweb.org/Webmention
Somewhat related ideas: how does hosting on IPFS or Dat align with your goals? In that way, the static resources are distributed among nodes, and would still be available from the mesh if your node goes down.
Keep up the good work! Someone turned me on to your work from the Scuttleverse.
Posted by: Andy Jacobs | October 07, 2018 at 07:32 PM
(96)
Like the solar website layout but I agree that your site would use fewer resources if it was run on a cloud server. Modern cloud-based systems are very energy efficient. When no one is visiting your site you are still using power waiting for a request. On a cloud, that system is serving someone else's site. Second, your solar powered site is not low tech. ARM-based SBC running Linux using PV solar is anything but low tech.
I find it kind of funny that some of the same things you are using today I used 20 years ago when I wrote my companies website. I was obsessed with making it work well over dial-up and used a lot of static pages. For example, I had a directory of people looking for work. It was a static page that was generated when someone added an entry.
The dithering is kind of cool and retro looking but just not really worth it for informative sites.
Posted by: LWATCDR | October 08, 2018 at 01:19 PM
(97)
More articles and discussion about the solar powered server:
https://www.fastcompany.com/90246767/the-future-of-web-design-is-less-not-more
https://tech.slashdot.org/story/18/10/02/1739237/this-solar-powered-low-tech-website-goes-offline-when-its-cloudy
https://hackaday.com/2018/10/08/perfecting-the-solar-powered-web-server/
Posted by: Kris De Decker | October 10, 2018 at 01:07 PM
(98)
Hi Lowtech<-magazine Team,
Great work with your new solar driven web-server. Even when my SBCs are mostly a bit more power-hungry, I like the concept of max out an A20. 'Featured' in the forum now. :)
https://forum.armbian.com/topic/8315-daily-tech-related-news-diet/?do=findComment&comment=64064
I would love to see a short sum-up tutorial here as well (if time allows it):
https://forum.armbian.com/forum/26-research-guides-tutorials/
You might get some hints when posting it again there how to improve consumption even more.
Posted by: christian weber | October 16, 2018 at 03:18 AM
(99)
There might be a way to consume way less energy would be to use a mix
of an openwrt router as an HTTP proxy caching the connections, and
waking up a more powerful device, such as an Allwinner A20 board.
Some Allwinner boards have a PMU chip that is well supported on
Android kernels. But last time I looked at linux-sunxi.org, the
suspend to ram supporting that chip was sparse.
I have tried a setup with an openwrt router caching the pages, and
that can wakes up an x86 PC with an SSD within 2 seconds with a WOL
packet, and some iptables+tc delay magic.
Posted by: Benjamin Henrion | October 16, 2018 at 03:19 AM
(100)
Hello,
i read the article about image compression on your page.
https://homebrewserver.club/low-tech-website-howto.html
If you compress the image with https://tinypng.com/,
the image quality is better than dithering and the file is also small.
Dithering is not so nice in the browser display when zoomed out.
https://homebrewserver.club/images/international-switchboard.jpg
tiny.png from 163.3 KB (jpg) to 81.9 KB
Posted by: Andreas Kosmehl | October 16, 2018 at 03:28 AM
(101)
Thanks for this excellent post on a very interesting topic.
I share your concerns about the increasing energy demand (not only) of the internet. Therefore using a purely solar power setup (except for the router...) is a pretty radical, yet very consequent (given the "low tech") approach. In addition, to me it seems a bit like art :-)
Coming from a job, which is all about power conversion and power management (funnily enough: for ARM based system) and having an interest into solar power applications for myself I could not stop myself from digging into the described and depicted solar charger and supply setup.
I may well be wrong (having maybe searched for the wrong part, or maybe just found outdated information), but is it possible, that the charge controller is just a linear type with no MPP tracking? (I found this one:
https://wholesaler.alibaba.com/product-detail/CM2024-PWM-12v-24v-20a-solar_6 0099884539.html)
In this case, the power being stored into the battery is not 50Wp, but just, say, 20Wp (depending on the way the solar panel is built/ internally connected).
Opting for the (indeed) more complex technology of an MPP tracker, or at least simple switch mode step down converter (Solar -> Battery) could drastically increase the amount of power you can use for your setup or other
household applications.
Even if the charge controller was an MPP tracker, you might want to consider using one with a lower current rating. Using (massively) oversized supplies,
can ruin (usually it does) the efficiency of such a switcher.
In addition a separate step down converter from the solar panel directly to 5V for powering the server board might (depends on how's it built) increase the efficiency of the system even further. The input of such a setup would
be a (wired) OR (using a dual diode with a common cathode) from solar panel and 12V lead acid battery then.
Having built my own solar powered setup (for a clock and an USB charger/ 5V supply for all kind of stuff) I can highly recommend using some(!) more sophisticated parts. It really pays!
I would also be interested in getting to know, which way the supply voltage (5V?) for the Olimex board is generated?!
Best regards
Dominic
Posted by: Dominic | October 17, 2018 at 12:55 AM
(102)
Hi
I saw your article on the sustainability of solar power [1], and I believe your argment is a bit off.
Yearly insolation for PV purposes doesn't vary as much with lattitude as you think, at least judging by the use of GHI in the article, which is very unfair to any installation outside 30°N-30°S or so.
A more fair estimate is to use global normal irradiance (GNI), weighted by how much power loss is expected due to imperfect pointing [2]. If I do this for the solar installation I'm currently building I come up with the number 2500 kWh/year, for a 2750 W installation, based on data from the Swedish Meteorological and Hydrological Institute for my location.
Whether this pans out remains to be seen, so take these numbers with some reservation :)
There's two other problems near the poles however: fewer sun hours in winter, and the distance between rows must increase. The latter isn't a huge problem since land is much cheaper than PVs. The former is nicely covered by wind power, which is more plentiful in winter (but turbines must be quite large to be worthwhile).
Apart from this I think most of your points are valid.
Using nuclear power to produce PVs is something I've suggested to some environmentalists, and reactionaries pretending to be environmentalists, and neither of those have wanted to hear it.
Tomas
[1] https://solar.lowtechmagazine.com/2015/04/how-sustainable-is-pv-sol
ar-power.html
[2] http://solarpaneltilt.com/
Posted by: Tomas | October 17, 2018 at 01:00 AM