LOW←TECH MAGAZINE
patreon
Rebuilding a solar powered website
🕑 Added 2023-06-11 09:26:34 +0000 UTC
During the last months we have been working on switching the solar powered website from one static site generator platform (Pelican) to another (Hugo). Many readers will not notice the changes right away, as we have not made any major adjustments to the design. Nevertheless, the new platform has allowed us to address some issues based on the feedback we received over the years.
The new solar website was designed by Marie Otsuka and Roel Roscam Abbing, the same people who were behind the first solar design. Marie Verdeil assisted throughout the process and coordinated the migration of the website.
Switching platforms
The original solar website, launched in 2018, ran on a static site generator called Pelican. While this remains a good choice for a relatively small website, the solar-powered version of Low-tech Magazine has grown significantly over time. Initially it featured only a selection of the English language website, but has expanded over time to contain not only more English language articles, but translations in five languages as well. Organizing articles and publishing changes on such a large website became a cumbersome process. For example, it took more than an hour to regenerate the site on changes – even if we only added one comment.
Hugo is a static site generator written in a faster programming language. In Pelican, much of the functionality we needed for the website such as multiple language support and image compression came as plugins of varying quality. This lead to limitations over time. In Hugo, these features are better supported from the start as they are core to the project. In addition, as a consequence of switching to Hugo we managed to reduce the generation time on the server from over an hour to 20 minutes (whereas on a modern laptop the difference is between several minutes and several seconds). That reduces the energy use of the server.
Aside from faster website builds, Hugo allows for a better organisation of content and is more flexible in defining categories for displaying that content. This allowed us for example to create dedicated pages highlighting the different contributors and translators to the magazine. Migrating all content from Pelican to Hugo was a time-consuming task, because our Hugo setup requires its own shortcodes to allow the display of both the original and dithered images. We made an automated script to convert the articles from one platform to another on March 20, but it took another two months to iron out and manually repair inconsistencies in the content.
Design changes
Battery meter
The new platform allowed us to address two design issues that regularly came up in the feedback over the last years. The first concerns the battery meter, which reflects the battery status of our off-the-grid website configuration. Some people found that it interfered with the reading process, especially when it’s halfway the page. The battery meter remains an elementary part of our design, revealing the material infrastructure that supports the website. However, it now remains at the top of the document, and no longer moves along as one scrolls down an article to interfere with the text.
Images
The second and major design improvement concerns the images. Dithered image compression works great for many images, and even makes black and white images more attractive. However, some images become unclear. This is especially so for graphs, which can become unreadable if they are not designed with dithering in mind. For some other images, the colors convey information that is lost in the dithering process.
The new design allows the visitor to turn off the dithering compression for individual images, revealing the original photo or illustration. The original images we show are compressed in a conventional way and are slightly heavier than the dithered images. Revealing them thus increases the load on our server. It remains to be seen how this will influence the energy use and uptime of the solar website.
Furthermore, the images are no longer full screen, which is especially advantageous when the website is viewed on a large computer screen. Finally, we improved the dithering compression to increase energy efficiency on the browser side.
Running Low-tech Magazine on one website
This major redesign is the penultimate step towards running Low-tech Magazine on just one (solar-powered) website. Ever since the launch of the solar powered website in 2018, the old (English language) website has remained online and up-to-date. This is troublesome, for several reasons.
First, running two similar websites is not consistent with our aim to lower the ecological footprint of the publication. The more so because the original website – a dynamic website hosted on blogging platform TypePad – is not lightweight. A second website running on grid power also defeats the purpose of going offline when the weather is bad – the old website remains online no matter the weather. Second, the need to update two websites involves a lot of extra work that would better be dedicated to writing and researching. The layout for every article has to be made twice, on different platforms. Comments and changes to the articles also have to be updated on two platforms.
The higher quality of the images was one of the main reasons to keep the old website up-to-date. Now that the original images can be viewed on the solar powered website, we will no longer update the old website. From now on, new content (including comments on older articles) only appears on the solar powered website. The TypePad website will remain online until summer, when we plan to move the part of the archive that has still not been converted to the static web format. It concerns mostly articles and pages from the early days.
For most other languages, the switch to the solar powered website has been completed already and the original websites have been shut down. The only exception is the original Dutch language website, which is no longer updated but remains online (also hosted at TypePad) to keep the older articles accessible. Due to the high number of original articles on that website it will be the last original website to disappear, if ever. It still has the original design from 2007.
User-friendliness
The new solar design brings nothing but advantages to the readers of Low-tech Magazine. However, on the publishing side, the balance is less positive. A greater usability for the visitors has gone (partly) at the expense of a lower usability for the author. The shortcodes used by Hugo are much clunkier than the syntax used by Pelican, and that adds to the time that it takes to make the layout for an article. This partly negates the time that is won by no longer having to update the second website.
Static websites are much more energy efficient than dynamic websites. However, static site generators still have a long way to go in terms of usability before they can become more mainstream and compete with tools such as WordPress. In the next months, we will try to improve things on the publishing side, and as always we welcome your feedback and suggestions. Please also share bugs or inconsistencies that we have missed in the migration. Thanks to everyone who has supported this project over the years.
Kris De Decker, Marie Otsuka, Roel Roscam Abbing, Marie Verdeil
Comments
cass strong grinch
Excellent write and thank you for the discussion of the design choices! 👏 for Hugo. It's one of the finest pieces of software out there.
Low-tech Magazine
Hi nicolas, thanks for your feedback. Indeed we may install a frontend to make things easier on the publishing side. No Tech Magazine remains on WP for now, but the plan is to rebuilt it, too. In fact, we started doing that and got pretty far already. However, the difficulties with the migration of the main site made us decide to postpone this project for a while.
nicolas
This is great to read, congrats and well done on the move to the new generator and the closure of the non-solar website! I had wondered in the past why the original website was still online. For the ease of use, I’m sure you have looked into it already, but just in case, can one of these be used or adapted for your usage? https://gohugo.io/tools/frontends/ Asking by curiosity and not to suggest more workload: what about notechmagazine.com? Will it remain a separate Wordpress blog or will it receive the same treatment as lowtech at some point (or be integrated into the solar website in some way or another)?
