back

Minimalist Websites

"Labour-saving machinery only creates endless and worse labour."
(J. R. R. Tolkien in a letter to his son Christopher, 1944)

Why Minimalism?

I'm keeping the design of this website simple, because:

Last but not least, it is my hope that keeping the design minimal will allow me to focus more on creating actually interesting content.

Compatibility

All pages are valid HTML and CSS according to the W3C Validator.

Some pages are interactive and therefore require JavaScript. I tried to keep the scripts as tiny as possible though.

If you run into any technical/accessibility issues on this website, please let me know how I can improve it.

Technical Details Behind the Scenes

For those interested in the actual process of how to build a minimalist website, here is a more technical description of what I actually do when creating and expanding pages on this website:

The vast majority of pages is actually just static HTML and a bit of CSS, written in my favorite text editor, Vim, with the help of a few custom mappings. If I need to make bulk changes to multiple pages, I would use Vim macros and/or basic Unix text processing tools like grep, sed etc.

One exception are the conlang grammars that are also available as PDF files. In this case, I obviously wanted to avoid maintaining two separate versions of the same document.

To keep things simple, I created a custom document format very similar to Markdown, and a custom parser for it written in the Go programming language, both called duo. The duo system comes with two backends. One outputs a HTML file directly, the other creates an intermediate LaTeX file which is then converted into PDF by LuaTeX.

This became necessary especially for the Emoji Language, where the PDF version contains a lot of small images. I built support for Unicode emoji directly into duo, which made the whole process much easier than with existing tools.

The other exception are pages with interactive elements. These are HTML and CSS as well, but also require some JavaScript. All scripts are executed on the client side, to avoid unnecessary server load and security risks. To keep the build process fast, I stick to classic jQuery and try to avoid packaging further third-party libraries. Both freqy and the "Compare C/V ratio" method of the SSM calculator employ Chart.js to render beautiful charts, though.

To speed up local development, I created a little web server, also in Go, that serves the pages from disk, with two important extra features: First, it monitors all files for changes and injects a little JavaScript snippet, so that the web browser automatically reloads a page when it is edited on disk. Second, it allows for highlighting sections that I'm currently working on which are not yet published on the live site.

Finally, to ensure standards-compliance, I use an offline version of the Nu Html Checker (validatornu) with a script that validates all HTML and CSS files, both manually and automatically created ones.

To orchestrate all parts of the process and only execute the steps actually required at the time, I use a combination of the entr utility and a classic Makefile handled by GNU Make.

As you can see, I strongly believe in using the appropriate tools for the job. While the process described here works well for this conlang website, it may not work as well for other websites.

Another tool I have experience with and would recommend for building minimalist websites is the Hugo static site generator. Also, pandoc and Asciidoctor are great for converting text into multiple formats.


Copyright © 2021-2022 by Thomas Heller [ˈtoːmas ˈhɛlɐ]