About This Website
This is a colophon page.
Overview
The World Wide Web is really quite glorious. What isn’t so glorious however is that exploration for many is confined to a few walled gardens. Worse is that these few walled gardens restrict creativity and promote endless vapid consumption. This website is a small step towards the World Wide Web’s re-decentralisation, that it may then free and inspire it’s explorers.
Maintenance of this website is largely a hobby and I don’t seek, or otherwise expect, visitors. Any writing is for purely selfish reasons: I write with the intent of distilling thoughts and solidifying ideas to enhance my understanding. Still, I hope others can benefit from what I share should they stumble upon it.
Small Files
This website stands against the website obesity crisis, wherein most websites today serve an unreasonably large payload1. Here you’ll find pages that load fast. In addition to the avoidance of superfluous features, extra time and care has been put into reducing file sizes.
This website has been entirely hand-coded. No static site generators, content management systems, web frameworks or the like. When I create a new page, I copy a template HTML file and continue from there. It can be bothersome, but I don’t post sufficiently often for it to be a chore. Besides, it’s nice not having dependencies.
Additionally, I want this website to be robust and to have longevity. For this I’ve followed Jeremy Keith’s description of progressive enhancement: to start from the lowest common denominator and then build up; that HTML is for structure, CSS is for presentation, and Javascript is for behaviour; that Javascript should not be relied upon for core functionality, but used for enhancements to the already existing core functionality2.
I use a single Javascript file, theme-toggle.js
, that determines the user’s preferred colour scheme, matches it, and enables switching between the light and dark themes through the toggle in the right of the navigation bar3.
Overall, I’m left with a lightweight concoction of HTML, CSS, and a little bit of Javascript.
Fonts used are hosted with the rest of the website files, I don’t use Google Fonts or a similar content delivery network (CDN). I don’t use variable fonts. I use two weights, regular and bold. A single variable font covering a great many weights would have a much larger file size than my regular and bold files combined.
To further reduce file sizes, I’ve subsetted the fonts I’m using to cover just the essential Unicode blocks:
Name | Range |
---|---|
Basic Latin | U+0000-007F |
Latin-1 Supplement | U+0080-00FF |
General Punctuation | U+2000-206F |
I encourage you to open the Network tab in your browser’s developer tools and poke around.
Good Typography
This website is predominantly text. As such, it’s been important to learn at least the basics of good typography for the improvement of readability.
For this, Butterick’s Practical Typography4 has been an invaluable resource. The fonts used here are by the same author; Equity as the serif font, Concourse as the sans-serif font, and Triplicate as the monospace font.
Easy Traversal
Traversal consists firstly of exploration and secondly of navigation. Exploration must be easy so that a destination can be easily found. Navigation must be easy so that once a destination has been found, it can be reached.
At least for now, this has in large part taken the form of the homepage activity feed: all pages and articles are displayed upfront in chronological order. The design of the activity feed has been brought about by a principle of high information density. I want a lot of options being displayed at once and for each to have a short curated description that provides valuable context.
In the future this may be improved with filtering for favourites, categories, or topics. As it stands currently, I am undecided if this has sufficient value proposition to warrant its implementation due to the relatively small number of posts and the infrequency of new additions.
Separately, on articles that are part of a series there are links to the previous and next parts if applicable. I’ve also added curated suggestions for what to read next at the end of select articles.
No Distractions
This website stands against the user-hostile web, wherein most websites today deploy features that are detrimental towards the user experience5. Here you’ll find the display of any content being with the utmost simplicity such that it can rightly be the sole focus. Commonplace annoyances such as tracking, pop-ups, cookie banners, and so on, are not to be found.
In seeking to reduce distraction, images and links are relatively few. Both must provide sufficient value to be included.
I have adopted Nicholas Carr’s removal of links from an article’s body and instead including references linking to footnotes at the bottom of the page6. Besides links often being differently styled in such a way that draws attention, I find that the presence of a link requires the immediate pondering of whether or not it should be followed. This disrupts the flow of a page’s content. A reference is a subtle signal that the link can for now be ignored; that it will later return where it can then be considered. While Nicholas hasn’t continued this, I like it.