Evan Boehs website email
United States
is very enthusiastic

Details ✨

in
garden

I recently got an email from a befuddled indiewebber who stumbled upon my little corner. They noted the intricacies, the ones recorded below, and then noted my lackluster analytics. They asked why I would devote so much time to a public service no one uses?

Indeed, I have asked myself the same question on occasion, and I think the answer really comes down to the message I am sending to the world. This website is a testimony to my claims of caring. It acts as proof to myself that I can do anything I set my heart to, and as proof to you and future employers that I care about the user, and about making beautiful, intricate, well designed experiences.
While I encourage you to browse around, I get you are a busy person, and so I am happy to lay it all out for your convenience.

It starts at the framework. It has always been clear to me that I want to avoid shipping extra framework code to the browser. I started writing plain html, tried svelte and realized that was a mistake. Through Svelte I discovered Astro, and while Astro fit the bill, we were not meant to be. That left static site generators like 11ty and Hugo. I opted to use 11ty for it’s flexibility.

11ty was not without issues. I am a digital gardener by trade, so for my and my reader’s sake I needed to organize my content. 11ty supports tags but not general taxonomies. While tags were useful, I needed custom taxonomies like location (blog/garden), state (evergreen/archived), and tags! So I wrote my own implementation.

Of course, this was not enough. I wanted support for plurals! That way, /states is a list of all states and /state/x is the x state! I also wanted to group nodes on taxonomy pages by location, so that happened in a flexible way.

The other thing critical to digital gardens is backlinks, so I wrote my own markdown-it plugin for it, and added “what links here” at the bottom of each page.

My site needed some personality, so the color theme became dynamic, based on a list of colors corresponding to taxonomy values. I also added a fun spark of personality with the is statements below my name on each page.

Another nice touch is the ASCII flower animation I custom coded. A design challenge was making it minify well, but I think I pulled it off elegantly. The code takes only a kilobyte or so, flowers included, while still animating smoothly.

I wanted RSS feeds, and those were simple enough to implement. I also themed the RSS feeds, and made it so RSS feeds could also be filtered by the location the post was filed under (/tag/fruit.blog).

PenPen has been a reoccurring theme in my writing, so I gave her her own color.

Behind the scenes, most excitingly, my website is purely semantic html. It uses JavaScript for a very small feature set, and of course everything works without it. I have tested the site in ((f)e)linx with great success. Combined, the entire site has a footprint of less than 5kb (excluding fonts and favicons)

For the record, I did try my best to reduce the favicon size. It itself is only about 2kb.

Squeezed into that 5kb is hidden indieweb support, seamlessly included in the HTML I hid RelMe links to other accounts and microformat markup. I am working on extending my indieweb support to include selfhosted micropub, webmention, indieauth, and more endpoints through my own code. I’m also quite active on the indieweb wiki.

For speed, my site is hosted with netlify (on my tests the fastest host). I use analytics, but I selfhost and use umami, a relatively privacy focused analytics solution who’s script is only about an additional 2kb. As a compromise, my analytics are publicly available - just as I see them.

I’ve made it a priority to reduce client side JavaScript, doing lots of things serverside. For instance, the random is is done using netlify’s edge functions (serverside!) instead of via JavaScript. For things that do require JavaScript like webmentions and the ASCII footer animation, progressive enhancement is always used.

I support the Gemini protocol for terminal reading, but I must confess it’s an afterthought.

I’m also in a ton of webrings (list coming soon)


What links here?

/details.html